HiClinic
Book a Demo Available now Login
Brand guide

The HiClinic identity, in one place.

Everything you need to build on-brand: logo, colour, type, components, layout, motion, and voice. Derived from the HiClinic brand — no new hues, no off-system type.

Version 1.02026AudienceCanadian clinic owners & managersReading levelGrade 8 · plain English
Colour

Palette

One system: a blue-to-teal signal gradient that encodes the pitch — blue is an incoming signal (call, text, DM); green is captured and booked. Ink frames the page; mist tints the sections. Add tints/shades of these only — no new hues.

SIGNAL GRADIENT#0067FF → #00B894 · oklab
Brand blue
Signal Blue
#0067FF
Primary brand blue. Buttons, links, gradient start.
Blue · Press
#0057E0
Darker shade of brand blue for hover/pressed states.
Signal Mid
#0093C9
Gradient midpoint (derived, not a base colour).
Brand green
Captured Green
#00B894
Success — answered, captured, booked. Gradient end, checks & live dots.
Ink
#0A1330
Headlines, dark header/footer, high-contrast panels.
Slate
#33406B
Strong body text on light.
Muted
#5A6B8C
Secondary text, captions.
Mist
#F4F8FF
Tinted section wash.
Line
#E5EBF5
Hairlines & borders.
White
#FFFFFF
Base background & cards.
Typography

Type system

A characterful serif for headlines, a clean grotesque for reading, and a mono for data. The italic serif is the signature — reserved for the accent phrase in a headline.

Display
Aa
Source Serif 4
Headlines & the italic accent. Confident, editorial, trustworthy.
ABCDEFG abcdefg italic 1234
Body
Aa
Switzer
All reading text, labels, buttons. Clear at grade-8, modern, calm.
ABCDEFG abcdefg 1234567
Utility
Aa
IBM Plex Mono
Eyebrows, captured data, timers, tags — makes data look captured.
ABC abc 01:24 +1 604
H172 / 700
Your Clinic Never
H235 / 700
A missed call is a lost patient
H318 / 600
It answers every call
Lead20 / Switzer
Every call answered, every detail captured, every appointment booked.
Body16 / Switzer
HiClinic answers every call, text and message in seconds, then books the patient in — nights, weekends and holidays.
Label12 / Mono
The AI receptionist for clinics
Components

Buttons & elements

Spend motion in one place. Buttons get a subtle lift; the primary carries a single light sheen on hover. Everything else stays quiet.

Primary · gradient + sheenBook a demo
Secondary · ghostSee how it works
Demo · avatar pillBook a Demo Available now
On ink · glass & white
Eyebrow pill The AI receptionist for clinics
Status & checks
Booked
Layout

Grid, radius & depth

One shared container aligns the header and every section. Corners are soft; shadows are low and diffuse.

–maxw
1200px
Content column, centred. Header + sections share it.
–gutter
clamp(18px, 3vw, 40px)
Space from the viewport edge.
Base type
16px · 1.6
Body baseline; headings fixed on desktop, fluid under 1024px.
Breakpoints
1024 · 900 · 600
Heading step-down · nav→hamburger · phone.
11px
14px
18px
26px
pill
Motion

Movement, with restraint

Spend it once

The hero animation is the one orchestrated moment. Everything else stays still or uses a small, quick lift.

Micro-interactions

Hover: 2px lift + soft shadow. Primary adds a single sheen sweep. Transitions ~.18s, eased.

Accessibility

Respect prefers-reduced-motion — the hero holds a still frame; effects don’t loop.

Voice & tone

How HiClinic talks

Write for a non-technical clinic owner losing revenue to missed calls. Pain first, plain English, no AI jargon. Active voice, sentence case, buttons say exactly what happens.

“A missed call is a patient who called someone else.”

Do

  • “Never miss another patient call.”
  • “Books the appointment into one inbox.”
  • Buttons: “Book a demo”, “Start free trial”.
  • Name real calls: Botox pricing, direct billing.

Don’t

  • “Leverage AI-powered omnichannel synergy.”
  • “Get started” / “Learn more” (vague).
  • ALL-CAPS shouting or exclamation spam.
  • Jargon that a busy front desk wouldn’t say.