All recipes
Recipes
Build a UI kit
Pick an accessible palette, generate card CSS, drop in placeholder content, and write share metadata for a new page.
Step 1 of 4
Pick the palette
Convert your brand colors between HEX, RGB, and HSL, then run each text-on-background pair through the contrast checker. Don't lock in a shade until it clears WCAG AA — 4.5:1 for body text, 3:1 for large text.