Skip to content
Brand Guidelines

Sprout.

The visual and tonal identity that shapes how Sprout feels in the world — warm, alive, and grounded in nature.

The Mark

The Sprout wordmark is set in Bricolage Grotesque at weight 700. The name carries the brand — no icon required. Always maintain clear space equal to the cap-height of the "S" on all sides.

Sprout
Primary — Light backgrounds
Sprout
Reversed — Dark backgrounds
Sprout
On brand green
Sprout
On brand rose

Don'ts

  • Don't stretch or distort the wordmark
  • Don't use on busy or low-contrast backgrounds
  • Don't change the typeface or letter-spacing
  • Don't use colors outside the brand palette

Palette

Two primary hues — Forest Green and Blush Rose — anchor Sprout's identity. Neutral Sage provides structural balance. Each has a full tonal scale for UI depth.

Semantic tokens

Primary #28af60
Secondary #e88fa0
Background #fafaf7
Foreground #283a33
Card #ffffff
Border #dedad0

Green scale

50
100
200
300
400
500
600
700
800
900
950

Rose scale

50
100
200
300
400
500
600
700
800
900
950

Neutral Sage scale

50
100
200
300
400
500
600
700
800
900
950

Feedback colors

Success #28af60
Error #ef4444
Warning #f59e0b

Type System

A single variable font carries all typographic needs. Bricolage Grotesque's organic irregularity echoes Sprout's natural ethos while staying sharp and legible at small sizes.

Display / 900 weight
Grow together.
Heading / 700 weight
Find your person.
Subheading / 500 weight
Connections rooted in what matters to you.
Body / 400 weight
Sprout matches people who care about the same things — the planet, community, and a life lived with intention. Every conversation starts from common ground.
Caption / 400 weight
Section label — small caps treatment
Font family
Bricolage Grotesque
Weight range
100 – 900 (variable)
Width range
75 – 100 (variable)
Format
woff2 variable

How We Sound

Sprout's voice is warm without being saccharine, direct without being cold. We speak like a friend who actually gives a damn about the world.

We are
  • Warm and grounded
  • Honest and direct
  • Optimistic, not naive
  • Inclusive and calm
  • Playful when appropriate
We're not
  • Preachy or moralistic
  • Corporate or stiff
  • Overly casual or slang-heavy
  • Alarmist or guilt-driven
  • Trend-chasing

Copy examples

Avoid"Find your eco-conscious soulmate today! 🌱💚"
Use"Meet people who share your values — not just your zip code."
Avoid"Join thousands of environmentalists fighting for a better future!"
Use"Connections that start with common ground."

Layout Principles

Sprout uses generous spacing and soft radii to feel approachable and airy. Tighter density is reserved for data-heavy UI contexts only.

sm — 0.25rem Inline tags, chips
md — 0.5rem Input fields, buttons
lg — 1rem Cards, modals
xl — 1.5rem Hero sections, panels
full — 9999px Pills, avatars