Skip to content

Brand kits in practice: one workflow for twelve client sites

Aya Studio template home page: Quiet spaces, built to last headline beside an architectural illustration

Picture an agency with twelve client sites in flight. Twelve brands, twelve sets of colours and fonts, and one team that cannot afford to relearn a design system each time.

The workflow

  • Open Brand kits from the palette icon in the Etchedy panel and search by mood: dark, serif, playful, mono.
  • Pick the closest kit. Every card shows its colours, its font pair and a specimen.
  • Copy the preview section and paste it on the canvas to judge the kit on real headings, buttons and cards.
  • Apply it. Colours, fonts, type scale, spacing, radius and buttons change together.
  • Fine-tune in Automatic.css. The kit is a starting point, not a lock.

Why it holds up

Patterns read tokens, so nothing on the page needs touching after you apply a kit. If the client changes their mind, Undo steps back one change and Restore brings back the settings you had before your first kit.

Where the 50 kits land

Dark and moody, clean and minimal, warm and editorial, bold and playful. Each kit has its own page in the library with the full board: all ten colours, the type scale, and buttons, fields and alerts drawn in that kit.

Twelve client sites, twelve brands, one habit: kit first, patterns second, polish last.