ColorSystem
tokenBreakdex::DesignTokens::ColorSystem
Adaptive color palette with four theme modes and semantic state/action colors
Maps every surface, text, and interactive element to a named color token so the UI never references raw hex values directly. Mode switching is instant because every widget reads from the same token map — only the underlying values rotate.
Relationships
Configured By 3
theme_setting_provideraccent_color_providerlearning_state_colors_provider
Breaks If 3
token_key_renamed_without_migrationmode_missing_required_surface_keyaccent_value_fails_contrast_check
Answers
Values
accent
#1F5EFFactionAgain
#C23B2AactionEasy
#0D9F9AactionGood
#1F7A4FactionHard
#B7791FstateLearning
#2F6BFFstateMastery
#1F8A70stateNew
#E45D7AModes
dark
bg
#090B10card
#11141Bfill
#1A1F29secondary
#A7B1C2separator
#283041text
#F7FAFFlight
bg
#F8FAFCcard
#FFFFFFfill
#F1F5F9secondary
#5A6272separator
#D9E0EAtext
#0B0D12mono Dark
bg
#090909card
#111111fill
#181818secondary
#B3B3B3separator
#F4F4F4text
#F4F4F4mono Light
bg
#F7F7F7card
#FFFFFFfill
#F0F0F0secondary
#5F5F5Fseparator
#111111text
#111111