Style guide
How ComplySmart looks and sounds. For our team, our partners and anyone writing about us.
Logo
Use the dark wordmark on light backgrounds and the white wordmark on dark ones. Write the name as ComplySmart: one word, capital C and S. Please don’t recolour, stretch or add effects to the logo.
For light backgrounds
For dark backgrounds
Colour
Every colour has a light and a dark mode version. Text meets the WCAG AA contrast ratio of 4.5:1 in both, so it’s readable for everyone.
Brand colours
pink
#FF46AD · white text 3.1:1
Highlights and glows. Too light for text on light backgrounds.
orange
#FF8F4E · white text 2.3:1
Accents on navy. Too light for text on light backgrounds.
navy-solid
#3C54A2 · white text 7.0:1
Feature sections. The same in both modes.
pink-deep
#CC2A86 · white text 4.9:1
Buttons. Deep enough for white text.
orange-deep
#B8520F · white text 4.9:1
Buttons. Deep enough for white text.
Theme colours
These change with light and dark mode. Contrast ratios for text colours are measured against the page background.
Light mode
- creamPage background#FFF8F2
- surfaceCards#FFFFFF
- sandBorders and dividers#E6DFD9
- inkBody text#35353511.7:1
- navyHeadings, links#3C54A26.7:1
- pink-textPink text, focus rings#CC2A864.7:1
- orange-textOrange text#B8520F4.7:1
Dark mode
- creamPage background#000000
- surfaceCards#141414
- sandBorders and dividers#262626
- inkBody text#E5E5E516.7:1
- navyHeadings, links#9CB5F810.4:1
- pink-textPink text, focus rings#FF46AD6.7:1
- orange-textOrange text#FF8F4E9.3:1
Gradients
Main buttons
Pink to orange, left to right
Gradient text
Highlights the second line of a big heading
Hero glow
Soft pink and blue, behind page headings
Typography
We use Poppins for everything. Headings are semibold and navy. Sentence case for headings, buttons and navigation: “Get started”, not “Get Started”.
- Page heading (h1)Compliance, minus the headache
- Section heading (h2)For a fraction of the cost
- Card heading (h3)Add your assets
- Intro paragraphAI drafts your answers. You review, approve and apply.
- BodyGive people only the access they need, and protect accounts with strong authentication.
- Small printCaptions, labels and the small print.
- Aa400Body text
- Aa500Buttons and navigation
- Aa600Headings
- Aa700Rare emphasis
Buttons
Rounded, with one main button per section. The main call to action is “Get started”.
Icons and imagery
Simple outline icons with rounded ends, drawn on a 24×24 grid. They take the colour of the text around them and always sit next to a text label.
Light mode
- Dark mode
- Light mode
- Menu
- Close
- Tick
- Play
- Bullets
Dark mode
- Dark mode
- Light mode
- Menu
- Close
- Tick
- Play
- Bullets
Step badges
Numbered steps, used on navy.
Standards logos
The standards we support. Shown in white in dark mode.
Photos, video and shapes
- Real people, real offices and real screenshots of the product.
- No stock handshakes, padlocks, hooded hackers or glowing circuit boards.
- Generous rounded corners on cards, and fully round buttons.
Voice and tone
Sharp, British, human
We sound like a friendly British practitioner who has been through compliance the hard way and built something simpler. Talking to a busy business owner over a coffee, not presenting to a board.
Professional
Accurate, specific and trustworthy. We get the facts right and never overclaim.
Not: Stiff, corporate or full of jargon
British
British spelling and understatement. Dry wit over exclamation marks.
Not: American spellings, hype, “awesome”
Friendly
Plain words, “we” and “you”, short sentences. Relaxed, like a person.
Not: Matey, slangy or patronising
A challenger
Compliance has been too slow, too costly and too full of jargon. We think it can be simpler, and we show it.
Not: Rude about anyone, or edgy for the sake of it
Say this
Challenge how things have always been done, never the people doing them, including the consultants and MSPs who partner with us.
- “Nobody started a business to write an access control policy.”
- “Your policies in hours, not weeks.”
- “We couldn’t save that. Check your connection and try again.”
Not this
Generic, full of jargon, or selling with fear.
- “In today’s fast-paced digital landscape, robust compliance is more important than ever.”
- “Leverage our end-to-end solution to unlock seamless compliance.”
- “Don’t wait until it’s too late!”
Writing rules
- British English: organisation, prioritise, licence (noun).
- Lead with the answer. Detail comes after.
- Short sentences, plain words, “you” and “we”.
- Be specific: “from £50 a month”, not “affordable”.
- Spaced hyphen for asides. No em dashes.
- Be clear about our role: we get you ready. IASME and its certification bodies certify Cyber Essentials. A UKAS-accredited certification body certifies ISO 27001 after an external audit.
- Read it aloud. If it doesn’t sound like a person, rewrite it.
Words
| Use | Avoid |
|---|---|
| simple, straightforward | seamless, robust, cutting-edge |
| get certified, get ready | empower, unlock, leverage, elevate |
| hours, not weeks | revolutionary, game-changing |
| practical, sensible | holistic, synergy, end-to-end solution |
| we’ve been there | in today’s digital landscape, delve |
| ISO 27001, ISO 42001 | ISO/IEC 27001, ISO/IEC 42001 |