back to palettes
Color lane

Transformative teal + Adaptive violet

A 2026 product palette built around clear teal agency, quiet biophilic neutrals, and restrained signal accents for AI-era dashboards, settings, and operational tools.

Signature · the star
primary accentTransformative teal · #007c78
Adaptive violet · #7257ff
Warm signal copper · #d66a2e
Neutrals · the ground
bg
#f3f8f7
surface
#ffffff
text
#10211f
muted
#657673
border
#cadad7
Semantic · functional accessory
success
warning
error
info
Ramps
accent
neutral
Download .css
Do
  • · Use teal as the single primary action and active-navigation signal.
  • · Keep surfaces mostly neutral; let status colors communicate state, not brand mood.
  • · Use accent.700 or text on pale teal fills; use accent.50 text on accent.500 and darker fills.
  • · For dark UI, invert to neutral.950/900 surfaces with accent.300 for focus and primary affordances.
Don't
  • · Do not place muted text below body size on bg; promote to text or darken to neutral.700.
  • · Do not use violet and copper simultaneously for primary controls; reserve them for chart series and rare events.
  • · Avoid pure black/white pairs in dark mode except the light surface token already specified for document canvases.
try it

remix with this palette

Drop Transformative teal + Adaptive violet onto any UI language and swap the art style — the preview recolors live.

UI language
Palette · fixed
Transformative teal + Adaptive violet
Art style
Landing Page
no composition
live preview · recolored + filled