onwards

Brand
Guidelines

Onwards is a shared operating system for life — turning dreams into plans, plans into habits, and habits into meaningful progress, together.

Design the life you love ✨ The little app for big plans you share.
v1.1 · playfulJuly 2026onwards.app
01

Essence

Rooting for each other's dreams — and doing something about them.

Warm, not soft Encouraging and human, but always moving. Onwards celebrates progress, not perfection.
Playful, not childish Clean white space, but with warmth — sunny gradients, soft shadows, cheerful color. Delight without the noise.
Together, always Every surface assumes two or more people. Language says "we", cheers beat streaks.
02

Logo

onwards
onwards
CONSTRUCTION Lowercase wordmark, ExtraBold, −3% tracking. The Journey mark — two growing dots resolving into an arrow (dream → plan → progress) — may stand alone as the app icon.
CLEAR SPACE Keep clear space equal to the height of the "o" on all sides. Minimum wordmark height: 24px.
DON'T No gradients, no outlines, no rotation, never set the wordmark in the accent color on white.
Onwards favicon 48px Onwards favicon 32px Onwards favicon 16px
FAVICON & APP ICON Journey mark, white on Ember, rounded square. Files: favicon.svg · favicon-32.png · favicon-192.png · apple-touch-icon.png
03

Color

Ember leads — primary buttons, active icons, cheers. On a crisp white canvas, warmth comes from a sunny gradient in hero moments and a cheerful accent trio for categories and celebrations. Color earns its place; chrome stays clean.

Ember #E0293D
Ink #221E1C
Canvas #FCFBFA
Stone #6E6660
Ember Deep #D93A26
Ember Tint #FEE7E2
Border #ECE7E3
Card #FFFFFF
CHEERFUL ACCENTS — HERO GRADIENTS, CATEGORIES & CELEBRATIONS (NOT PRIMARY UI)
Sunbeam#F5A524
Meadow#34B39A
Lilac#7C74E8
Sunny gradhero
CATEGORY CHIPS — SOFT TINT + EMOJI, DREAMBOARD ONLY
🌏 Travel 🌱 Health 💡 Learning 💛 Family 🎉 Fun
04

Typography

One family: Plus Jakarta Sans. Friendly geometry, generous x-height, works from 12px labels to display headlines. Weight carries hierarchy — never color, never italics.

Dream it together Display / 44 / 800 / −3%
Our dreams, big and small Title / 28 / 700 / −2%
Japan trip · Planning Heading / 17 / 600
Everything the two of us are dreaming up — big, small, and in-between. Tap a card to open a dream. Body / 15 / 400 / 1.6
In Progress Label / 12 / 600 / +6%
05

Iconography

Outline icons, 1.75px stroke, rounded caps and joins, on a 24px grid (use Lucide or Phosphor Regular). Ink at rest — Ember only when active or celebrating. Never filled, never two-tone.

rest
active
24px grid
rounded
1.75 stroke
no fills
06

Voice & tone

A supportive partner, not a productivity coach. First-person plural, plain words, small celebrations. Never guilt, never streak-pressure, never corporate.

SAY "Japan trip just moved to Planning — nice." "Beena cheered you on 🎉" "One small step this week?"
DON'T SAY "You haven't logged progress in 5 days!" "Unlock premium to achieve more." "Optimize your goal pipeline."
07

UI expression

White cards on white canvas, soft red-tinted shadows for lift, 20–28px radius, pill buttons. Hero moments wear the sunny gradient; everyday cards stay clean. Ember is the single primary action per view.

BUTTONS + CONTROLS
All Dreaming Planning Achieved
dream cover photo
Japan trip 🌏 Travel
Together · Planning 2 cheers
08

Naming

DreamsThe shared dreamboard. Never "goals", never "tasks".
Little JoysRituals and small habits. Warm, not clinical ("habit tracker").
CheersOne-tap encouragement. Never "likes" or "reactions".
SavesMap saves and social saves — inspiration pulled in from the world.
MemoriesThe record of what you achieved together. The payoff surface.