Color Tokens

Color System

Aavya uses a dual-theme color system anchored by Indigo as the primary color, with Aavya Cyan as the accent (focus rings, links, logo) and Mint reserved for semantic success states only.

Updated April 2026 — primary collapsed to a single indigo. Electric Violet has been retired as a brand color; the --violet token remains as a back-compat alias only. See /brand-guidelines/changelog for rationale.

Brand Colors

Indigo primary, Cyan accent, Mint success-only. Three colors, three roles.

Indigo

Primary — Buttons, CTAs, main actions, links

Aavya Cyan

Accent — Links, eyebrow text, focus rings

Deep Navy

Anchor — Logo mark, dark backgrounds, image overlays

Mint Green

Success — Semantic success states only (not a brand accent)

Role demotions: Mint (#2CB67D) is no longer a brand accent — use only through --success. Avoid bg-mint / text-mint directly in non-success UI.

Dark Mode Palette (Primary)

For cinematic video, hero images, and high-tech storytelling.

Background

Navy-anchored dark foundation

Card / Popover

Floating panels, cards, popovers

Secondary Surface

Elevated surface — one step above background

Muted Surface

Recessed surface — one step below background

Text Primary

Near-white — slightly cool for comfort on dark

Text Secondary

Mid-tone grey for supporting text

Visual Effects (Dark)

Lighting: Embedded rather than directional. Objects glow from within.
Glassmorphism: Semi-transparent layers with background blur for depth.
Glows: Subtle outer glows in indigo (#6366F1) to lift elements off the navy background.

Light Mode Palette (Secondary)

For documentation, process diagrams, and daylight social content.

Background

Near-white cool surface — never pure white for full backgrounds

Cards / Surfaces

Pure White — floating panels for separation

Secondary Surface

Subtle neutral — secondary containers

Stroke / Border

Light cool grey — defines edges

Text Primary

Deep Navy — maximum contrast and brand cohesion

Text Secondary

Mid-grey for supporting text

Visual Effects (Light)

Shadows: Soft, diffused drop shadows (#1E2338 at 5-10% opacity) for the “floating” effect.
Translucency: Frosted glass effect — white overlays at 80% opacity with high background blur.
Contrast: Crisp borders and clean lines rather than ambient lighting.

Prohibited Colors (Branding & Imagery)

These colors are forbidden in brand imagery, marketing assets, and visual design. Standard UI components (error states, form validation) may use conventional warm colors.

Red

#EF4444

Orange

#F97316

Yellow

#EAB308

Gradients

Approved gradient patterns for backgrounds and connection lines.

Dark Background Gradient

linear-gradient(135deg, #14172A, #1E2338)

Accent Gradient (Connection Lines)

linear-gradient(135deg, #4F46E5, #3AADDD)