ClarityCollective
Visual Identity v0.1

Clarity Collective

Clear direction. Confident you.

The foundational visual language, color, type, spacing, and motion, that every page is built on. Warm editorial minimalism: calm, premium, emotionally intelligent.

01 · Color Palette

A warm, grounded spectrum

#FBF7F0

Cream

bg-cream

#F4ECDF

Cream Deep

bg-cream-deep

#F2E9DD

Beige

bg-beige

#E8D8C6

Sand

bg-sand

#CBB7A0

Sand Deep

bg-sand-deep

#8D6E63

Latte

bg-latte

#6F5448

Latte Deep

bg-latte-deep

#3F332C

Espresso

bg-espresso

#E6BCAB

Blush

bg-blush

#D2A079

Clay

bg-clay

02 · Typography

Editorial serif meets clean sans

Display · Cormorant

Clarity today.

H1 · Playfair Display

Find clarity in your next chapter.

H2 · Playfair Display

Confident decisions start here.

H3 · Playfair Display

Your future deserves direction.

Body · Inter

Clarity Collective helps you navigate change, gain clarity, and take intentional steps toward a fulfilling career. We combine empathy with structure to guide you forward.

Eyebrow · Inter / uppercase

Clear direction. Confident you.

Accent · Cormorant Italic

Bringing you the rarity of clarity.

03 · Buttons

Guided, never pushy

04 · Pills & Tags

Soft signposting

EmpatheticIntentionalEmpoweringFree Discovery CallLicensed Coach

05 · Cards

Calm, contained structure

Reflect

Career Clarity Session

A 90-minute personalized session to map where you are and where you want to go next.

Strategize

Transition Intensive

Multi-session coaching to move from feeling stuck to a confident, structured plan.

Grow

Leadership Coaching

Develop the confidence and positioning to step into your next chapter of leadership.

06 · Motion

Subtle by design

Every section on this page fades and rises gently into view as you scroll, using a soft cubic-bezier ease. Cards lift on hover. Nothing flashy, motion that reassures rather than demands attention.

Brand loader

The C mark drawing itself on, then releasing, our signature “write-on” loading state. It stands in for any moment the site is thinking: booking availability, form submissions, generated documents.

07 · Downloads

Take the brand with you

Logos in transparent SVG (scalable, for print + design tools) and PNG (for quick use). Dark marks for light backgrounds, the cream mark for dark ones.

C Mark

C Mark in Espresso
EspressoSVGPNG
C Mark in Latte
LatteSVGPNG
C Mark in Cream
CreamSVGPNG

Submark (C + ring)

Submark (C + ring) in Espresso
EspressoSVGPNG
Submark (C + ring) in Latte
LatteSVGPNG
Submark (C + ring) in Cream
CreamSVGPNG

Animated C

The signature “write-on” loop as a self-contained animated SVG, drop it into a site, email signature, or loading screen.

Download animated SVG ↓

Fonts

All three are free (Google Fonts) and already built into Canva and Adobe Fonts, so Sue can use them in templates without installing anything.