Colormapped
Curated color palette

Calm Violet UI Palette

A restrained violet interface palette with neutral surfaces, a soft supporting violet, and a strong primary action color.

This is a Colormapped-curated palette, not an official design-system palette.

Palette colors

Page background Canvas #F8FAFC
Subtle surface Soft Violet #EDE9FE
Supporting accent Lavender #A78BFA
Primary action Primary Violet #5B5CF0
Text / dark neutral Ink #1F2937

Each swatch chooses black or white label text using the higher WCAG contrast ratio for that single solid color. Final component contrast still depends on your actual text size and context.

Suggested use

Useful for dashboards, utility products, and interfaces where functional color data should remain more visually important than the brand chrome.

Surface Calm Violet UI Palette Example action

CSS variables

:root {
  --palette-1: #F8FAFC;
  --palette-2: #EDE9FE;
  --palette-3: #A78BFA;
  --palette-4: #5B5CF0;
  --palette-5: #1F2937;
}

Contrast snapshot

Canvas #F8FAFC Best of black/white: 20.07:1
Soft Violet #EDE9FE Best of black/white: 17.69:1
Lavender #A78BFA Best of black/white: 7.72:1
Primary Violet #5B5CF0 Best of black/white: 4.96:1
Ink #1F2937 Best of black/white: 14.68:1

This is a quick black/white text comparison, not a full accessibility audit. Use the Contrast Checker for the exact foreground/background pair you plan to ship.

More Calm Violet UI palette directions

Lighter workspace

More white space and softer violet surfaces.

#FFFFFF#F5F3FF#C4B5FD#5B5CF0#1F2937

Deeper product

Darker anchors with the same violet identity.

#F8FAFC#EDE9FE#5B5CF0#4338CA#111827

Violet cyan accent

Adds a restrained cyan supporting color.

#F8FAFC#5B5CF0#2DC8E8#E0F2FE#111827

Related palettes

Purple Color Palette

A purple palette with pale lavender, mid violet, saturated purple, and a deep plum anchor.

Blue Color Palette

A blue palette moving from a near-white cool surface through a saturated action blue to a deep navy.

Dark Color Palette

A dark neutral palette for interfaces with near-black navy, charcoal, slate, and muted blue-gray values.

Green Color Palette

A balanced green palette with pale surfaces, fresh mids, a forest accent, and a deep green neutral.