Draft for review
Brand Style Guide
Ruhi Zandra
Version 2Visual Direction
Ruhi Zandra is quiet, spacious, and grounded. Earth tones now sit alongside the greens, sage blends into warm clay and tan rather than staying purely cool, and generous white space still does most of the work. Nothing here is bright or saturated, muted and soft throughout. Playfair Display gives headings a slightly poetic, timeless feel without turning ornate, and Inter keeps everything else calm and legible. Nothing here should read as a wellness brand chasing trends. It should feel like a held breath.
“Art is the doorway. Remembering yourself is the destination.”
01 · Color
Color Palette
Sage and Clay work together as co-primaries, green and earth tone blended rather than one or the other. Fog is a cooler, quieter secondary for subtle variation. Graphite anchors dark sections and text. Bone is the base, never pure white.
Sage, primary
Fog, secondary
Clay, earth tone (co-primary with Sage)
Graphite & Bone, neutrals
Surfaces: Bone white (#F8F6F3) is the default background, never pure white. Cards and form fields sit on true white for a subtle lift. Sage ultra light and Clay ultra light both work for gentle alternating sections and pullquote backgrounds, alternate between them so the site doesn't read as all-green.
Gradient & blending, shown in context
A soft diagonal blend from sage into clay is the site's one signature gradient move, used sparingly for hero backgrounds or section dividers where a flat color would feel static. Keep it subtle, this is a wash, not a spotlight. Shown here with real content on top since a bare gradient swatch doesn't tell you much on its own.
A quiet space to return to yourself.
Guided creative sessions for reflection, grounding, and presence.
Sage to Clay light: hero or section background, dark text sits fine on top
“Art is the doorway. Remembering yourself is the destination.”
Ultra light pair: subtle wash behind a pullquote, barely-there instead of a flat sage or clay block
Each session begins with a conversation.
I’ll respond personally to help you find the right space for your creative practice.
Get in touchDark pair: an alternative to a flat graphite CTA band, light text and a white button only
02 · Type
Typography
Playfair Display carries headings with a little poetry, without tipping into ornate. Inter handles everything readable. Cormorant italic is reserved for pullquotes and affirmations, the brand's most distinctive typographic move.
H1Playfair Display · 52px · 3.25rem · 600
A quiet space to return to yourself.
H2Playfair Display · 36px · 2.25rem · 600
Rooted in authenticity
H3Playfair Display · 24px · 1.5rem · 600
Navigating a transition
BodyInter · 17px · 1.0625rem · 400
Guided creative sessions for reflection, grounding, and presence. No art experience is needed. The focus is on process, not outcome.
SmallInter · 14px · 0.875rem · 400
Each session begins with a conversation. I'll respond personally to help you find the right space.
CaptionInter · 12px · 0.75rem · 400
Photo caption or metadata text, always muted.
AccentCormorant Italic · 26px · 1.625rem · 400
“Come as you are. Leave a little more connected to yourself.”
03 · UI
Components
The core interface elements, matching what's already on the wireframes. More can be added as the build takes shape.
Motion: hover states are quiet on purpose, a soft lift and shadow on cards and swatches, a gentle 4% zoom on photos, buttons ease up by a pixel. Nothing snaps or bounces. Transitions run 0.2–0.6s, slower for photo zooms so they read as a drift rather than a jump. Try hovering the color swatches above, the photos below, and the reference cards further down the page.
Buttons
Links
Questions about a session? Get in touch and I'll respond personally.
Form Fields
Checkboxes & Radios
Pullquote / Affirmation
“Art is the doorway. Remembering yourself is the destination.”
04 · Imagery
Imagery Direction
AI-generated reference imagery showing the direction: natural light, muted sage and warm-neutral tones, candid and unposed, slight film grain rather than polished stock-photo gloss. Useful as placeholder and mockup imagery, not final assets.
Process shots
Hands mid-motion, materials in use. No staged "finished art" shots, the focus stays on process.
Group / circle sessions
Candid mid-conversation, nobody posing for the camera. Warm, quiet, unstaged.
Ruhi
Her real portrait, natural outdoor light, relaxed and unposed. Use as-is for About and the homepage teaser.
Note: the process and group shots are AI-generated reference imagery, placeholder and mockup use only. Ruhi's portrait is a real photo and can be used as final.
05 · Layout
Layout Preview
A quick look at the palette and type working together. Rough preview of the feel, not a final design.
A quiet space to return to yourself.
Guided creative sessions for reflection, grounding, and presence. No art experience needed.
“Art is the doorway. Remembering yourself is the destination.”
Bone-white hero with a graphite pullquote band, sage accents throughout.
06 · Accessibility
Contrast Check
Key color pairings checked against WCAG 2.1 guidelines. AA is the standard target for body text.
Aa
Headings on bone white
14.19 : 1
Aa
Body text on bone white
6.88 : 1
Aa
White on graphite section
10.80 : 1
Aa
Button text on sage
5.12 : 1
Aa
Link on bone white
5.34 : 1
Aa
White on sage-ultra-dark button
5.76 : 1
Aa
Clay-ultra-dark link on bone white
5.78 : 1
Aa
White on clay-ultra-dark button
6.23 : 1
Note: the lighter sage-dark, sage-base, and clay-dark tones fail AA for small text on white and should stay decorative (swatches, borders, gradients, large display type) rather than carry body copy or links. Use sage-ultra-dark or clay-ultra-dark for any text/links on light backgrounds.
07 · References
Reference Sites
Three sites Ruhi pointed to. This guide is not a copy of any of them, each one informed a specific piece of the direction above.
Thirsty for Art
thirstyforart.com
Warm clay, terracotta, and cream. The clearest reference for the earth-tone side of the palette above, blush and rust rather than green.
Foundation for Art & Healing
artandhealing.org
Called out for the gradient and blending treatment, not the colors (their blues and teals don't fit here). The sage-to-clay gradient above is the same idea, translated into this palette.
Institute for Sensorimotor Art Therapy
sensorimotorarttherapy.com
Muted ochre and tan, nothing bright or vivid. Confirms the direction: soft and gentle throughout, the accents stay quiet even where they lean warm.