Skip to content

Global Styling

Tailwind CSS with custom design tokens will be used to keep everything consistent.

Two stylesheets handle theming: global.css for core styles and starlight.css for Starlight overrides.

Colors are defined in OKLCH for perceptually uniform brightness and contrast. The French Blue palette (50-950) provides the base, with semantic tokens (primary, accent, muted) that adapt between light and dark modes.

The site defaults to light mode and switches to dark with a .dark class.

Accessibility: WCAG AA contrast ratios, prefers-reduced-motion support, and clear focus rings for keyboard navigation.

Learn more about how shadcn-svelte handles theming: https://shadcn-svelte.com/docs/theming.