How to work with DESIGN.md

DESIGN.md is the design contract for this starter. It describes the theme direction, source files, color tokens, typography, layout rules, dark mode, motion, and component patterns.

When you customize the starter, read this file before changing components. It will save you from small visual decisions drifting across pages.

Recommended workflow

1. Update src/config/site.js with your project metadata.
2. Adjust base brand tokens in src/styles/global.css, and non-default theme overrides in src/styles/themes.css.
3. Check /elements to see the visual impact.
4. Update docs/DESIGN.md if you change the system rules.
5. Compose new pages from existing components.

Keep it current

If the theme changes, update DESIGN.md in the same pull request. The document is not just project documentation. It is the prompt context future contributors will use to keep the site coherent.