Overview

The design system uses Tailwind CSS with color tokens exposed as CSS variables. Dark mode is class-based. Edit tokens once; components update across the app.

Key files

constants/colors.ts   # BaseColors tokens (RGB) and HexColors
tailwind.config.ts    # exposes --color-* vars, screens, animations
app/global.css        # selection, chart hues, code block overrides

Use tokens instead of hardcoded hex values to keep themes consistent and switchable.