Quiz: Making It Yours

1. Why recommend CSS custom properties over Tailwind?

Tailwind is slower to render Custom properties are native, cascade correctly, and when Claude uses var(--color-primary), it automatically gets the right colour Tailwind doesn't work with Astro Custom properties support more colours

2. How many colours do you need to start a design system?

Seven — one for each token category Three — text, background, and a primary accent Five — primary, secondary, accent, background, text One — a primary brand colour

3. What instruction should be in your project CLAUDE.md for design consistency?

Always use the Tailwind colour palette Do not hardcode any colour, spacing, or font values — always reference CSS custom properties Match the design to the closest Figma mockup Use the browser's default styles

Check Your Understanding

Check Your Understanding