⚠️ Design system CSS not found. Check the path in cms/docs.config.js → designSystemPath, then re-run npm run docgen.

Client Template

Brand Book

Logo, colour, typography, and interface elements styled with your brand tokens

A preview of how your brand elements will be applied across collateral we create for you. Everything below is rendered using your brand tokens — colours, typography, buttons, lists, and form controls all stay in sync with the design system.

Logos

Wordmark

Light

Dark

Avatar Logo

Light

Dark

Colours

Backgrounds

Fonts

Aa

ABCDEFGHIJKLM
abcdefghijklm
0123456789

Inter

Aa

ABCDEFGHIJKLM
abcdefghijklm
0123456789

IBM Plex Mono

Field notes

Your Primary Headline, Big, Bold, and Unmissable

This lead paragraph demonstrates how introductory body text will look across your layout — used to set the tone for the body that follows and draw the reader in.

This paragraph demonstrates how body text will look across your layout. Bold text adds emphasis, while italics offer a subtle highlight. You can also use strikethrough to show edits, or inline code for technical terms. For further information, check out this internal link, or visit our external site.

Type with Purpose, Design with Intent

This extended paragraph serves to demonstrate how substantial blocks of body text will behave across your layout, giving you a realistic sense of how readers will experience longer-form content. Strategic use of bold text helps break up visual monotony, while italicised phrases introduce subtle emphasis. As you work through multiple lines, you'll notice how spacing, line height, and text density all contribute to overall readability.

What good typography does

  • Establishes a clear visual hierarchy
  • Improves readability over long passages
  • Carries the brand voice consistently
    • Across digital and print
    • Across light and dark surfaces
  • Communicates without shouting

How we use it

  1. Discovery and brief
  2. Strategy and positioning
  3. Design and prototyping
    1. Visual exploration
    2. Refinement
  4. Build and handover

Words matter, but how those words are presented matters just as much. Typography transforms content from mundane to magical, from ordinary to extraordinary.

Terms and conditions apply. Prices are subject to change without notice. See site for complete details.

Three things worth your time

Catchy article title example

A short preview of the article content, crafted to grab attention and spark curiosity. Just enough to tempt the reader to click.

by Studio

Bold title for a blog post

A few compelling lines that hint at the story within. Use this space to draw the reader in with tone, intrigue, or a bold statement.

by Studio

Short and scroll-stopping

Bold insights, fresh thinking, and a reason to scroll. This placeholder shows how a post excerpt will look in your feed layout.

by Studio

Get in touch

Was this page helpful?

We use this feedback to improve our documentation.

Thanks for your feedback

Send feedback

© 2026 By Default