STYLE GUIDE

01. Colors

Energetic orange meets clean, versatile neutrals. Onde’s color palette keeps every page bold, focused, and easy to navigate. These swatches use Onde’s existing color variables.

Primary
#F05624
Energy orange · primary actions
Heading Black
#333333
Deep charcoal · headings
Body Text
#666666
Balanced gray · supporting copy
White
#FFFFFF
Clean white · light surfaces
Border Gray
#DDDDDD
Soft gray · borders and dividers
Surface Light
#F7F7F7
Light neutral · section backgrounds

02. Typography

Blinker gives Onde’s headings a confident, energetic feel and keeps supporting text clear and comfortable to read.

Heading 1 · Blinker
Unlock your potential
Heading 2 · Blinker

Build strength. Find balance.

Heading 3 · Blinker

Train with purpose

Heading 4 · Blinker

Progress starts with you

Heading 5 · Blinker
Make every session count
Heading 6 · Blinker
Stronger every day
Body text · Blinker

At Onde, your fitness journey starts with you. Discover personalized training, experienced instructors, and a supportive community that helps you move with confidence and work toward your goals.

03. Buttons & Links

Use clear, action-led labels. These examples show Onde’s filled and outlined button styles alongside a simple text link.