Visual Identity & Design System
Heralia Legal
Family Law for Southern New Mexico
Advocacy · Wisdom · Strength · Justice
Foundations
A restrained palette of emerald, ivory, and gold.
Deep Emerald
Dark sections · footer#0D2B24
hsl(166 54% 11%) · --emerald
Emerald Green
Buttons · hover#134236
hsl(165 55% 17%) · --emerald-green
Heralia Gold
Icons · accents#C9A66B
hsl(38 47% 60%) · --gold
Warm Champagne
Borders · dividers#E8D9B6
hsl(42 52% 81%) · --champagne
Soft Ivory
Background#F7F5F0
hsl(44 31% 96%) · --ivory
Soft Charcoal
Body copy#242724
hsl(120 2% 15%) · --charcoal
Type System
Typography carries the identity — airy, high-contrast serif over a quiet sans.
Display
Cinzel · 60 / 64
Protecting what matters most.
Heading 1
Cinzel · 48 / 56
A calm strategy for transition.
Heading 2
Cinzel · 36 / 44
Family law, reimagined.
Heading 3
Cinzel · 24 / 32
How we help families.
Body Large
Lato 300 · 18 / 30
Every interaction should evoke trust, calm, and quiet confidence.
Body
Lato 300 · 16 / 28
We believe family law deserves a different experience.
Eyebrow
Lato 400 · 11 · 0.22em
Our Philosophy
Caption
Lato 400 · 11 · 0.20em
Advocacy · Wisdom · Strength · Justice
Components
Buttons — primary emerald, secondary ivory with a thin emerald border.
Iconography
Thin line icons in brushed gold, consistent 1.25 stroke.
Forms
Quiet inputs with a soft gold focus ring.
Surfaces
Cards breathe — generous padding, soft shadow, minimal border.
Card · interactive
Generous padding
Soft shadow, minimal border, lift on hover.
Card · static
Content surface
No hover lift — for reading surfaces.
Elevation
shadow-soft
Token-driven, never harsh.
Motion
Subtle fades, elegant scroll, premium micro-interactions.
Motion
Fade in
Opacity 0 → 1 over 0.8s ease.
Motion
Slide up
24px rise, cubic-bezier(0.22, 1, 0.36, 1).
Motion
Staggered
Sequential 0.08s delays per element.
Logo System
The wordmark for light surfaces, the full mark for dark.
Wordmark · light
Wordmark · dark
Full lockup
Layout
Spacing, radii, and elevation reference.
Radius
Soft, never sharp.
Section spacing
Every section breathes.
Reading width
Comfortable, never crowded.
Brand Voice
Professional. Empathetic. Confident. Warm. Clear. Intelligent.
Never dramatic. Never overly formal. Never salesy. Never cold.