Design system
The Sona8 brand, in one place.
Colours, type, logo, components and voice for the website, decks, reports and the product. For people, and for the AI tools they build with.
For AI tools
Point any AI tool at one address.
Paste this into Claude, Lovable or any builder before asking it to design or write for Sona8.
Use the Sona8 design system. Before designing or writing anything, read https://sona8.com/design/brand.md and follow it exactly: colours, type, shapes, logo, imagery and voice. Tokens: https://sona8.com/design/tokens.css and https://sona8.com/design/tokens.json. Logo files: https://sona8.com/assets/logo/. The claim is "Listen & move forward." and is never reworded. Do not use the retired violet brand or the slogan "Good strategy starts with listening."
The system
What each page covers.
- BrandThe Sona8 claim, the approved product sentence, the voice and the words we use and leave out.
- ColoursWhite, Light Grey, Highlight, Dark Purple and Black, with contrast, support colours, chart series and the rules for using them.
- TypographyThe Sona8 type scale in Newsreader and Inter, with sizes, uses and the rules for case and weight.
- LogoThe Sona8 wordmark and 8 in Black, White and Purple as SVG and PNG, with clear space, minimum sizes and what not to do.
- ComponentsThe live components of the Sona8 website: buttons, section labels, numbered lists, findings and quotes.
- Filesbrand.md, tokens.css, tokens.json, the logo files and the design kit, plus a prompt that points any AI tool at them.
Retired
What the brand no longer uses.
- The violet system: #8B3DF5, #B794FF, Orchid #DE71F4, the violet-to-orchid gradient.
- The old site colours: navy #0A0B1C and #15173F, beige #F9F4EB, Near Black #1A2226, Slate #5B6B73.
- The old logo: a hollow ring with satellite rings joined by spokes.
- Public Sans, IBM Plex Mono, Fraunces, Geist and Arial as brand faces.
- The old slogan "Good strategy starts with listening."