CXT Dev · Brand identity concept
Tidewell: a brand that feels like arriving somewhere calm.
A complete identity and website for a fictional private counseling practice, created to show how CXT Dev approaches brand work for small, people-first businesses.
Self-initiated concept, not client work. Tidewell, its people, address and details are invented.
01 · The brief
Calm, credible, and unmistakably human.
Maren Ellery (fictional) is opening a small counseling practice with three colleagues in a coastal Pacific Northwest town. She wants a brand that makes reaching out feel less daunting.
Most practice websites fall into one of two traps: clinical and cold, or so soft they feel vague. Tidewell needed to sit in between, trustworthy enough for a first-time client researching late at night, and warm enough that pressing "book" feels like a small, safe step.
- An identity that reads as calm and professional at every size, from favicon to door sign
- A light, bright palette that avoids the clinical blue-and-white cliché
- A website with a booking flow that never feels like paperwork
- Accessible to WCAG AA throughout, and quick on a phone
02 · Brand strategy
A steady place where people can be themselves.
Audience
Adults 25–60, couples and families with teens, often first-time clients. Typically researching on a phone, sometimes late at night, often anxious about the first step.
They need: reassurance, clarity on cost and process, a sense of who they'll talk to.
Positioning
For people who want support but dread a clinical experience, Tidewell is the small local practice that feels like a calm room with a kind person in it, practical, warm and never in a rush.
Personality
Like a good friend who happens to be very well trained: grounded, gentle, quietly confident, with a little warmth and humour.
Warmth first
Feeling safe comes before any technique.
Unhurried
Space and pace in everything, from layout to copy.
Grounded
Practical and honest; no big promises.
Open door
Welcoming to everyone, plainly accessible.
Tone of voice
- Warm, never gushing
- Plain-spoken, never clinical
- Hopeful, never promising outcomes
- Gently direct, never pushy
We write the way a counselor talks in the first five minutes: short sentences, everyday words, the reader's feelings acknowledged without being dramatised. No diagnoses, no guarantees.
Our licensed clinicians provide evidence-based treatment modalities for a range of presenting concerns.
We're a small team of counselors who'll help you work through what's on your mind, at your own pace.
Click here to schedule your intake appointment.
Book a free 15-minute call. No pressure either way.
Late cancellations will be charged in full.
Life happens. We kindly ask for 24 hours’ notice if you need to move a session.
03 · Logo
A doorway, a tide and a rising sun.
The thinking
The arch is a doorway: the threshold you cross into a calm room, and a shape that shelters without enclosing. Its base is left open, so it never feels like a cage.
Inside, two tide lines echo the practice's coastal home and the idea that feelings come and go in waves. The sun sits just above the water, a quiet sign of hope that never shouts.
The wordmark is set lowercase in a soft-cut Fraunces, outlined and tightened by hand. The dot of the i is replaced with the same apricot sun, so the mark and the name share one small, warm detail.
Lockups
Clear space
X = the diameter of the sun in the mark. Keep at least 1X of clear space on every side; 2X is preferred in print and on signage.
Minimum size
Lockup 120 px · 30 mm wide
Wordmark 72 px · 18 mm wide
Mark 20 px · 6 mm tall
Below these sizes the tide lines start to merge. At favicon size use the mark tile, drawn with a heavier 4.2 stroke.
Colour and one-colour versions
Please don't
Stretch or squash it
Recolour the mark
Rotate or tilt it
Place it on busy patterns
04 · Colour
Morning light on the water.
Warm cream instead of clinical white, soft sage and sky instead of hospital blue, and one small apricot sun. Every page stays light; depth comes from tone, never from dark sections or shadows.
Base
Cream
#FBF8F2 · RGB 251 248 242
Base background. The page is always light and warm.
Linen
#F3EDE2 · RGB 243 237 226
Alternate sections, footer, print stock.
Paper
#FFFDF9 · RGB 255 253 249
Cards, forms and raised surfaces.
Sage
Sage Mist
#E4ECDF · RGB 228 236 223
Calm fills, chips, quiet highlights.
Sage
#C5D6BE · RGB 197 214 190
Primary buttons, landscape forms.
Sage Deep
#5B7A67 · RGB 91 122 103
The arch in the mark; icons and rules (graphics only).
Moss
#476553 · RGB 71 101 83
Links, eyebrows, small accent text.
Sky
Sky Mist
#E3EEF4 · RGB 227 238 244
Soft fills, selected states.
Sky
#BCD5E3 · RGB 188 213 227
Secondary buttons, tide lines.
Tide
#5A8AA3 · RGB 90 138 163
Waves in the mark; graphics only.
Harbour
#3F6A80 · RGB 63 106 128
Focus rings, informational text.
Apricot
Apricot Light
#F8E1CF · RGB 248 225 207
Warm notes, reminders, highlights.
Apricot
#E9A97C · RGB 233 169 124
The sun. Used sparingly, never for text.
Clay
#8E5530 · RGB 142 85 48
Text on warm fills, form errors.
Text
Fern
#2F4A3F · RGB 47 74 63
Wordmark and headings.
Ink
#22322D · RGB 34 50 45
Body text. Softer than black.
Proportion
- Cream 55%
- Linen 15%
- Sage Mist 12%
- Sky Mist 10%
- Apricot Light 5%
- Apricot 3%
Contrast pairs (WCAG 2.2)
Ink on Cream
Body text
Fern on Sage
Primary button
Fern on Sky
Secondary button
Moss on Cream
Links & eyebrows
Ink on Sage Mist
Text on calm fill
Harbour on Sky Mist
Info chips
Clay on Apricot Light
Warm notes
Sage Deep on Cream
Icons & the arch (graphics)
Tide on Cream
Waves (graphics)
Sage Deep and Tide are reserved for graphics, icons and large display text (3:1 minimum). Body copy always uses Ink, Fern or Moss.
05 · Typography
A soft serif voice, a clear sans to read.
Display · Fraunces (variable, OFL)
Aa
Gentle, practical, and on your side.
Weights 300–420 for headings. SOFT axis fixed at 50 and WONK off, so curves feel rounded and friendly without becoming quirky. Italic for one emphasised phrase per heading, at most.
Text · Figtree (variable, OFL)
Aa
A relaxed chat with a counselor to see if we're the right fit. No pressure either way.
Weights 400–700 for body, UI and labels. Open apertures and a generous x-height keep long reading easy on small screens.
A quieter place
Support shaped around you
Couples counseling
Warm, unhurried support for the big changes life brings.
Most people feel a little nervous beforehand. That is completely normal.
Getting started
Both families are self-hosted as subset WOFF2 files (Fraunces 55 KB, Figtree 16 KB), preloaded, with metric-matched fallbacks to avoid layout shift. No third-party font requests.
06 · Imagery & illustration
Quiet, real, and full of daylight.
Look for
- Soft daylight, warm white balance
- Negative space for type
- Hands, backs, silhouettes, landscapes
- Calm colour that sits inside the palette
Avoid
- Head-in-hands distress clichés
- Clipboards, couches and "therapist nods"
- Dark, moody or desaturated grading
- Heavy overlays, vignettes or drop shadows
Illustration kit
Flat shapes from the mark's geometry: no outlines on fills, no gradients except the soft sky wash, rounded ends everywhere. Shapes overlap like paper cut-outs and always leave room to breathe.
07 · Iconography
Simple, open, and friendly.
- Grid 24 × 24 px with 2 px padding
- Stroke 1.5 px, round caps and joins
- Form Open shapes, soft corners (3–3.5 px radius)
- Colour Sage Deep on light fills; sits inside a 48 px rounded chip
- Arrows Horizontal only. Forward means "next", never up-and-away.
08 · Applications
The same calm, everywhere you meet it.
Business card
3.5 × 2 in on uncoated cream stock. The stacked logo sits above a soft tide band; the back carries contact details on Sage Mist.
Maren Ellery, LMFT
Founder · Marriage & family therapist
- (555) 014-2290
- maren@tidewell.example
- 218 Larch Street, Suite 3, Alder Cove
Appointment reminder email
Sent the day before. A friendly greeting, the essentials in a Sky Mist panel and a kind note about moving the time. No alarming red, no countdowns.
Hi Sam, see you on Thursday.
This is a friendly reminder of your session with Maren. There's nothing you need to prepare.
Need to move it? Just reply to this email or call (555) 014-2290. We kindly ask for 24 hours' notice.
Take care,
The Tidewell team
Social posts
Square posts with one short, gentle line and the illustration kit. Useful, never preachy; no stock photos of distress.
It's okay not to have the words yet.
@tidewell.counseling
Tiny practice · Evening
Before bed, name one thing that went okay today.
@tidewell.counseling
Intake form
A welcome form, not a questionnaire. Plain language, optional fields clearly marked and lots of space to write.
Welcome form
Page 1 of 2
Thank you for choosing Tidewell. Please share only what you're comfortable with; anything can wait until we meet.
About you
What brings you here?
How would you like us to contact you?
Your information is kept private and secure. · Tidewell Counseling · 218 Larch Street, Alder Cove
Office signage
An arch-shaped entrance plaque in painted birch, with soft-coloured room signs named after the coast instead of numbers alone.
Suite 3 · Please come in
Session in progress.
Thank you for keeping things quiet.
09 · Motion identity
Moves like the tide: slow in, gentle out.
The arch draws first (a door opening), the sun rises into it, then the tides arrive and the name settles in from the left. It plays once per visit, never on loop.
Tide cubic-bezier(.22,.61,.36,1)
Settle cubic-bezier(.33,1,.68,1)
| Token | Duration | Easing | Used for |
|---|---|---|---|
| Micro | 200–250 ms | Tide | Hover, press, chip select |
| Reveal | 800 ms + 90 ms stagger | Tide | Content entering on scroll, 14 px rise |
| Step | 550 ms | Tide | Booking steps slide in 14 px |
| Page | 280 ms out / 420 ms in | Tide | Cross-document fade with 6 px lift |
| Logo | 1.75 s total | Tide + Settle | First visit only, once per session |
| Ambient | 22–32 s loops | Tide (alternate) | Colour washes drift; tides slide |
| Breath | 10 s cycle (4 in, 6 out) | Ease-in-out | Breathing prompt on Home |
Transition
Page to page
Pages cross-fade with a 6 px lift using native view transitions: no JavaScript router, nothing to load.
Try itInteraction
Hover & select
Buttons deepen in tone and the arrow drifts 4 px forward. Chips fill softly. Nothing bounces.
Accessibility
Reduced motion
With "reduce motion" on, washes and tides stop, reveals show instantly and the logo appears fully drawn.
How CXT Dev would run this for your practice
Eight calm weeks, from first call to launch.
- Weeks 1–2
Discovery & strategy
Listening session, audience and competitor review, values and voice.
- Weeks 3–4
Identity
Two logo routes, palette, type and icon set, refined to one.
- Weeks 5–6
Website design
Page designs and copy for Home, About, Services, FAQ and booking.
- Weeks 7–8
Build & handover
Accessible, fast site build, brand guide, logo files and launch support.
10 · Downloads
Take the brand with you.
The one-page guide covers the logo, colour, type, voice and motion at a glance.
