Color
Varla colors are built for calm, high-contrast interfaces
—so dense protocol data stays readable without feeling loud.
Our palette
Varla uses a dark-first foundation to feel stable and infrastructure-grade, with minimal noise and clear hierarchy. Across any format—UI, docs, diagrams, social, decks, or print—color should prioritize readability and consistency.
Color works in layers: Primary + Special build structure, Neutrals ensure legibility, and Accents carry meaning. Accents aren't decorative—red is for critical/negative, lime is for positive/confirming—and if a layout feels loud, reduce accents instead of adding new colors.
Primary
Use as the base background across Varla, best for full-page canvases, large sections, and cover-style layouts.
Special
Use as layered surfaces to structure content, best for cards, panels, nested blocks, and deep backplates.
Neutral
Use for maximum legibility and strict utility, best for text, icons, strokes, and production needs.
Accent
Use only for semantic emphasis, best for critical/negative moments and positive/confirming moments.