Brand Guidelines Generator — Build a Living Style Guide

Brand & style guidelines — edit anything below.

Logo

Keep clear space around the logo equal to the height of its mark. Never stretch, recolor outside the palette, or place it on low-contrast backgrounds.

Color

Additional colors

Neutral scale

Typography

Heading font

Body font

Scale ratio

Base size · 16px

Custom type styles

Spacing & Radius

Spacing scale

Corner radius

Components

Buttons

Inputs, badge & card

Badge

Card title

Cards use the medium radius and a soft shadow to sit above the page.

Toggle & selection

Enabled

Checkbox

Radio

Tabs

A short summary lives in this tab.

Alert & progress

Your changes were saved.

Avatar

Jamie Diaz

Product Designer

Frequently asked questions

Logo usage, a color palette with accessible role assignments, a type scale with heading/body font pairing, and spacing tokens — the core references a team needs to keep a brand consistent across a website, app, and marketing materials.

Yes — export your generated tokens as CSS custom properties or a JSON file, ready to drop into a real codebase or share with a design team.

No — pick a color palette and a font pairing, adjust the type scale ratio, and a complete, coherent style guide assembles itself. It's built to produce a sensible result even with the defaults.