Style
Classic corporate
Trust through order: a calm blue, a clear hierarchy, a conventional layout and nothing that surprises.
See it live
Example: insurance company home page for Harbourline Assurance, a fictional brand made up for this explorer. Switch the width to see the style on a phone, a tablet and a desktop screen.
Home, car and travel insurance
Cover you can count on, explained in plain words.
For more than sixty years Harbourline has helped families and drivers recover when things go wrong. Clear policies, fair prices and people who answer the phone.
Get a quote in three minutes
Choose the cover you need. You can change your answers at any time.
Insurance for the things that matter
Three kinds of cover, each with the same promise: no small print surprises.
Home insurance
Buildings and contents cover, with accidental damage and a 24-hour emergency line included.
From £14 a month
Get a home insurance quoteCar insurance
Comprehensive cover with a courtesy car while yours is repaired at an approved garage.
From £27 a month
Get a car insurance quoteTravel insurance
Single-trip or annual cover for medical costs, cancellations and lost luggage worldwide.
From £4 a trip
Get a travel insurance quote
Making a claim in three steps
We keep it simple, and we keep you informed at every step.
Tell us what happened
Call us or fill in a short online form. It takes about ten minutes and you can save it as you go.
We assess your claim
A named claims handler reviews it and tells you our decision within two working days.
We pay or repair
Money goes straight to your account, or our approved trades put things right for you.
Trusted for over sixty years
The numbers behind our promise, published every year.
- of claims accepted last year
- 97%
- average time to a decision
- 2 days
- households and drivers insured
- 640,000
- the year we opened our first office
- 1958
“When the kitchen flooded, one person handled everything from the first call to the last repair. I never had to explain it twice.”
Speak to a person, not a menu
Our advisers are in the office Monday to Friday, 8 am to 8 pm, and Saturday, 9 am to 1 pm.
Copy the idea
Take the style with you as a brief for a person, as instructions for an AI assistant, or as design tokens. It describes the idea and the rules — never the example's code.
The recipe
Classic corporate — style recipe: the same text the brief copies.
The idea
- Trust through order: a calm blue, a clear hierarchy, a conventional layout and nothing that surprises.
Use it when
- Insurance, banking, legal and public services
- B2B companies that sell reliability
- Audiences that value clarity over flair
Avoid it when
- The brand needs to feel young or rebellious
- The goal is to be memorable above all
Principles
- A trustworthy blue as the only strong colour
- A clear heading hierarchy and short paragraphs
- Conventional layout: nav, hero, three-step explanation, proof, contact
- Plenty of white and light-grey sections
- Plain icons and simple diagrams
- Calls to action are clear and repeated
Colour
- White (background): #ffffff
- Ice (surface): #f4f7fb
- Navy ink (text): #1d2733
- Steel (muted): #4f5d6e
- Trust blue (accent): #1f5aa6
- Line grey (border): #d5dde8
- Text on background contrast: 15.11:1
Type
- Headings: Source Sans 3, weights 600, 700 — Solid and neutral
- Body: Source Sans 3, weights 400 — Plain and very readable
- Scale: 14px, 16px, 18px, 24px, 34px, 48px
- One neutral sans in a moderate scale; nothing decorative.
Spacing and shape
- Base unit: 8px
- Spacing steps: 8px, 16px, 24px, 40px, 64px
- Regular, predictable section spacing.
- Corner radii: 4px, 8px
- Borders: Light grey lines around cards and forms
- Shadows: Small and subtle
Imagery and motion
- Imagery: Simple line icons and clean diagrams; no abstract art.
- Motion: Minimal; short fades only.
Do
- Keep one clear call to action per section
- Explain in three simple steps
- Show proof: numbers and short quotes
Don't
- No playful fonts
- No more than one strong colour
- No surprising layouts
Palette
- Whitebackground
#ffffff - Icesurface
#f4f7fb - Navy inktext
#1d2733 - Steelmuted
#4f5d6e - Trust blueaccent
#1f5aa6 - Line greyborder
#d5dde8
Text on background: 15.11:1 — passes AA
Type
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
Solid and neutral
The quick brown fox jumps over the lazy dog
Plain and very readable
- 48pxThe quick brown fox jumps over the lazy dog
- 34pxThe quick brown fox jumps over the lazy dog
- 24pxThe quick brown fox jumps over the lazy dog
- 18pxThe quick brown fox jumps over the lazy dog
- 16pxThe quick brown fox jumps over the lazy dog
- 14pxThe quick brown fox jumps over the lazy dog
Spacing and shape
- 8px
- 16px
- 24px
- 40px
- 64px
Regular, predictable section spacing.
- 4px
- 8px
- Borders
- Light grey lines around cards and forms
- Shadows
- Small and subtle
Do and don't
Do
- Keep one clear call to action per section
- Explain in three simple steps
- Show proof: numbers and short quotes
Don't
- No playful fonts
- No more than one strong colour
- No surprising layouts
Similar styles
The styles closest to this one in mood, density, era, warmth and accent colour.
- Editorial magazineReads like a well-set magazine: confident serif headlines, generous columns, pull quotes and fine rules.See the style
- Swiss gridA strict grid, big sans-serif type and asymmetric layout do all the work; nothing is there for decoration.See the style
- Dark luxuryQuiet expense: a deep dark ground, a refined serif, thin gold lines, slow fades and very little on screen.See the style