1.1 KiB
1.1 KiB
Central color theme
The application uses one cohesive blue/navy theme. All colors are centralized in static/src/tailwind.css; templates do not define brand hex colors.
Palette and roles
--color-ink: #08376b— navigation, headings and structural contrast--color-sea: #0693e3— primary actions, links and active states--color-sea-dark: #1977ce— depth, secondary blue and hover states--color-coral: #fa9f00— selective attention, highlights and warnings--color-cream: #eeeeee— page background--color-soft: #eaeaea— secondary surfaces and conversation canvas--color-paper: #ffffff— elevated cards--color-mint,--color-sun— supporting light-blue and warm tints
Conversation surfaces and shadows are also variables in the same :root block.
Changing the theme later
Edit only the @theme and :root token values near the top of static/src/tailwind.css, then run:
npm run css:build
Component rules consume semantic names such as ink, sea, coral, and paper, so no template rewrite is required.