Foundations
The Comitor palette is anchored by a warm gold — restrained as an accent, never as a background flood. Every token is available as a CSS variable and a Tailwind class.
Brand — Gold Scale #FBF5DC
gold-50
Tint backgrounds, hover states
#F8E89D
gold-100
Subtle highlights, badges
#F5D060
gold-200
Gold light — dark mode primary accent
#E8B824
gold-300
Brand primary — CTAs, active borders
#B88A00
gold-400
Gold deep — hover on primary
#7A5800
gold-500
Gold darkest — dark mode subtle tint
#5C4006
gold-600
Deep gold — dark text on light gold
Surfaces #0E1116
ink
Primary text, dark backgrounds
#3A3F4A
ink-soft
Secondary text, muted labels
#FBF7EE
paper
Light mode hero background
#EDE8D8
warm
Warm tinted surfaces, dividers
#FFFFFF
white
Card backgrounds, light UI
Neutrals — Gray Scale #F7F7F8
#EDEEF1
gray-100
Borders, dividers
#C8CBD3
gray-300
Placeholder text, disabled
#7E8290
gray-500
Muted foreground text
#3A3F4A
gray-700
Dark secondary text
#16181D
gray-900
Code block backgrounds
Semantic #0F1E3D
navy
High-contrast dark accent
#1F8A8B
teal
Info, links, secondary action
#D64545
red
Destructive, error, delete
#2EA56A
green
Success, active, positive
#F2C94C
yellow
Warning, pending, highlight
Contrast pairs Approved foreground/background combinations that meet WCAG 2.1 AA or AAA standards.
Foreground Background Ratio Rating ink (#0E1116) white (#FFFFFF) 18.4:1 AAA ink (#0E1116) paper (#FBF7EE) 17.1:1 AAA ink (#0E1116) gold-300 (#E8B824) 7.2:1 AAA ink (#0E1116) gold-200 (#F5D060) 9.1:1 AAA white (#FFFFFF) ink (#0E1116) 18.4:1 AAA white (#FFFFFF) gold-400 (#B88A00) 4.5:1 AA ink-soft (#3A3F4A) white (#FFFFFF) 9.3:1 AAA gray-500 (#7E8290) white (#FFFFFF) 4.6:1 AA white (#FFFFFF) red (#D64545) 4.5:1 AA white (#FFFFFF) teal (#1F8A8B) 4.7:1 AA white (#FFFFFF) green (#2EA56A) 4.5:1 AA