Brand Guidelines
The OneBookPlus brand guidelines give you the official logos, colour palette, typography, iconography, and usage rules for representing OneBookPlus correctly. Download the assets here, or grab approved blurbs and stats from the OneBookPlus press kit.
Foundation
Mission & Positioning
Why OneBookPlus exists, who it's for, what it replaces. The anchor for every design and copy decision on this page.
Mission
Give every Australian small business one book to run on, replacing the shelf of separate subscriptions (Xero, ServiceM8, HubSpot, Calendly, Mailchimp) with a single, GST-native platform.
Positioning
All-in-one business platform built for Australian SMBs. GST, ABN, BAS, AUD, and Aus-hosted are the foundation, not an afterthought. Vertical-aware: the platform adapts for trades, hospitality, healthcare, cleaning, fitness, professional services and 40+ specific industries.
Who
Australian SMBs (1 to 50 staff)
What
Replace the SaaS shelf with one book
Where
AU-hosted, AUD, GST-native
Why
Operators want one place to look
Foundation
Voice & Tone
How OneBookPlus sounds across the product, marketing, support, and partner comms. Voice is constant; tone shifts with context.
Voice principles
Plain-spoken
Short sentences. Real words. Skip jargon and SaaS-speak. If a tradie wouldn't say it on-site, we don't write it.
Confident
We know what the product does and we say so. No hedging (avoid "powerful", "intuitive", "world-class").
Australian
Spelt the AU way (organise, colour, centre). GST not VAT, BAS not VAT-return, suburb not zip-code.
Operator-respectful
Talk to owners and operators as peers running a business: never as marks to be persuaded.
Tone shifts
| Context | Tone | Example |
|---|---|---|
| Onboarding | Warm, brisk, momentum | "Two more steps and you're sending your first invoice." |
| Marketing / Landing | Confident, concrete, no fluff | "Invoice the burst pipe before you leave the van." |
| Errors | Calm, specific, action-led | "That ABN didn't match. Check digits or paste it again." |
| Empty states | Helpful, not cute | "No invoices yet. Tap + to send your first." |
| Success / receipts | Quiet acknowledgement | "Sent. Receipt in their inbox." |
| Support / replies | Human, accountable | "That's our bug, fix going out today." |
Vocabulary, say / don't say
Trades, health, professional services use "client". Retail/hospitality use "customer".
We send invoices. Bills are what we pay.
One word for the calendar event across every vertical.
Tradies have jobs. Avoid PM jargon.
Australian-only spelling. Never localise to other tax systems.
Business Activity Statement, use the AU acronym.
Always the Australian acronym.
Verb-led, no marketing throat-clearing.
What an invoice does is get sent, not generated.
Use AU vernacular when talking to AU operators.
Microcopy rules
Identity
Logo
The OneBookPlus logo consists of a logomark (the app icon) and a wordmark. They can be used together or separately depending on context.
Downloads
SVG (scales infinitely, preferred), PNG (transparent, 2400px) and JPG (white background). “Reverse” is the white wordmark for dark backgrounds.
Direct links
- https://onebookplus.com.au/icons/onebookplus-logo.svg
- https://onebookplus.com.au/icons/onebookplus-logo.png
- https://onebookplus.com.au/icons/onebookplus-logo-stacked.svg
- https://onebookplus.com.au/icons/onebookplus-logomark-512.svg
Swap the extension (.svg / .png / .jpg) for the format you need. Social banners & partner creatives live in the media & press kit.
Construction
The logomark sits on a 1024×1024 rounded square (corner radius 224, ~22%). The open-book curves are stroked at 27.4 on the same grid. The "+" badge sits in the top-right with a circle radius of 95 at center (771.87, 263.81).
Clear space
Keep a margin around the logomark equal to 50% of its height (½× the logomark) on all sides. Nothing, text, other logos, edges, should enter this space.
The dashed line marks the boundary, minimum clear space (½× logomark height on all sides).
Minimum sizes
Don't render the logomark smaller than these thresholds, the "+" badge starts to disappear and the open-book curves lose readability.
24px
Web favicon, minimum digital size
40px
Nav bar, app shell, sidebar
60px
Print materials, minimum print size
Misuse
Don't modify, recolour, distort, or decorate the logomark. Each of these will break the brand and trigger a takedown request.
Rotated
Stretched
Recoloured
Outlined / hollow
Drop-shadow added
On low-contrast background
Identity
Color Palette
Our primary brand color is Teal 600 (#0d9488). The full palette runs from 50 to 950. Click any swatch to copy its hex value.
Key Colors
Primary
#0d9488 · brand-600
Dark
#042f2e · brand-950
Accent
#2dd4bf · brand-400
Semantic colors
State colors used across the product. Always paired with an icon so the meaning is not colour-alone (accessibility, colour-blind users).
Success
#059669
Sent, paid, completed
Warning
#f59e0b
Overdue, expiring, attention
Error
#dc2626
Failed, invalid, destructive
Info
#2563eb
Neutral notice, links, help
Accessibility, contrast ratios
WCAG 2.1 minimums: 4.5:1 (AA) for body text, 3:1 (AA Large) for ≥18px or ≥14px bold, 7:1 (AAA) for the highest tier. Pairings below pass at least AA.
| Preview | Pair | Ratio | Pass |
|---|---|---|---|
| Send invoice | brand-700 on white | 5.47:1 | AA · AAA Large |
| Send invoice | white on brand-600 | 3.74:1 | Fails AA · AA Large only |
| Send invoice | white on brand-700 | 5.47:1 | AA · AAA Large |
| Send invoice | brand-700 on brand-50 | 5.25:1 | AA · AAA Large |
| Send invoice | paper-50 on ink-900 | 14.58:1 | AAA · AAA Large |
| Featured | ink-900 on bookmark-500 | 6.95:1 | AA · AAA Large |
Don't use: brand-400 on white (1.86:1, fails AA and AA Large), white on brand-600 for anything under 18px, or any combination under 3:1. Use brand-700 for a filled button and brand-700 for a link on paper. Always verify before shipping a new colour pairing.
Identity
Typography
We use system fonts for performance and platform consistency.
Headings & UI
System Sans-Serif
-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif
Wordmark "Book"
Georgia Serif Italic
Georgia, 'Times New Roman', serif, bold italic for the "Book" in our wordmark
Wordmark Construction
OneBookPlusOne, Bold, system sans-serif, primary text color
Book, Bold italic, Georgia serif, brand-600 / brand-400
Plus, Regular weight, system sans-serif, muted gray
Identity
Iconography
Custom icons drawn for OneBookPlus, not stock. The set is built on a 24×24 grid with a 1.75 stroke, rounded caps and joins, and currentColor so every glyph inherits its context. Where it fits, domain icons borrow from the brand's working-tool vocabulary, carbon-copy invoice books, appointment diaries, ledger spreads, bookmark tabs, not the generic SaaS document/folder/card lexicon.
Hover any tile for Copy import and Download SVG actions.
Grid
24 × 24
Stroke
1.75
Caps / Joins
round
Fill
currentColor
Design philosophy
Convention drives meaning. Brand drives feel. Where an icon is a trust signal or universal affordance, a padlock, a globe, a checkmark, an envelope, we keep the conventional shape so it reads instantly. Where it represents a OneBookPlus-specific surface, an invoice, a booking, a dashboard, a BAS lodgement, we lean into authentic content cues: the double-rule total line tradie invoices actually print, the bookmark-on-the-booked-date diary gesture, the open-ledger spread with charts. Brand identity shows up through stroke, joins, proportion, and content authenticity, not through wholesale reimagining that breaks first-read comprehension.
Industry verticals
10 iconsVertical category marks for the main industries OneBookPlus serves. Used on the dashboard switcher and the /for/<industry> hero sections. These stay convention-led, a hardhat reads as trades, a chef's hat as hospitality, with brand identity coming through consistent stroke and rounded joins across the whole set.
TradesIcon
+9Plumbers, sparkies, HVAC, builders, carpenters
Hardhat, universal trades mark, simple silhouette
Variants
HospitalityIcon
+3Restaurants, cafes, hotels, venues
Chef's hat, unambiguous, more legible than crossed utensils
Variants
CleaningIcon
+7Airbnb, commercial, medical, end-of-lease cleaning
Spray bottle with mist, the unmistakable cleaning artefact
Variants
RealEstateIcon
Agencies, agents, strata, property mgmt
House with door: classic real-estate silhouette
RetailIcon
Shops, boutiques, dispensaries, hardware
Shopping bag: reads as physical-store retail (vs cart = e-commerce)
HealthcareIcon
+4Dentists, physios, nursing, aged care, allied health
Stethoscope, universal medical mark
Variants
FitnessIcon
+4Gyms, personal trainers, yoga, pilates
Dumbbell, two-plate silhouette, immediately reads
Variants
EducationIcon
+2Tutors, music teachers, schools
Graduation cap with tassel, distinct from BookIcon mascot
Variants
ProfessionalIcon
+7Accountants, lawyers, brokers, consultants, agencies
Briefcase with handle and clasp, classic professional services
Variants
AutomotiveIcon
+5Mechanics, panel beaters, smash repair, tyre shops, detailers
Car side profile, cabin + body + wheels
Variants
Industry-specific
42 of ~45 iconsOne-level deeper than the verticals, distinct glyphs for each industry under /for/<industry>. Each picks the most iconic tool, fixture, or artefact of that trade. Currently shipped: 5 Trades industries. Coming: Healthcare (dentist tooth, physio body, nursing cross), Hospitality (restaurant fork, cafe cup), Automotive (mechanic wrench, panel-beater hammer), and the rest.
PlumberIcon
Plumbing trade pages
P-trap pipe: the artefact under every sink
ElectricianIcon
Electrical trade pages
Lightning bolt: universal electrical
CarpenterIcon
Carpentry, joinery, framing
Claw hammer at 45°: the carpenter's primary tool
PainterIcon
Painting, decorating
Paint roller with Y-frame and handle
HvacIcon
HVAC, refrigeration, air-con
Vent grill with horizontal slats
BuilderIcon
Builders, framers, construction
Blueprint floor plan: paper artefact, brand-fit
RooferIcon
Roofers, gutter, slate work
Steep roof with shingles and chimney
TilerIcon
Tilers, paving, mosaic
2×2 tile grid with grout joints
LandscaperIcon
Landscapers, gardeners, arborists
Almond leaf with vein: universal green/garden mark
DentistIcon
Dentists, orthodontists, dental clinics
Tooth with crown and two roots
PhysiotherapistIcon
Physios, exercise physiologists, sports rehab
Stretching figure with motion arcs: disambiguates from generic user
AgedCareIcon
Aged care, disability services, in-home care
Wheelchair: figure + drive wheel + front caster
NursingIcon
Nursing, allied health, in-home medical
Medical cross in a circle: badge form, distinct from Plus
RestaurantIcon
Restaurants, bistros, dining
Fork and knife: universal dining pair
CafeIcon
Cafes, coffee shops, brunch spots
Coffee cup with curling steam
HotelIcon
Hotels, motels, B&Bs, accommodation
Concierge bell: knob, dome, base plate
MechanicIcon
General mechanics, workshops
C-wrench tightening a hex bolt: distinct from generic wrench
PanelBeaterIcon
Panel beaters, smash repair
Hammer above a dented curved panel
TyreShopIcon
Tyre shops, alignment, wheel work
Wheel with rim and 4 spokes
DetailerIcon
Car detailers, wash, polish
Car with shine sparkles above
AutoElectricianIcon
Auto electrical, battery, ECU work
Car battery with terminals + lightning inside
AirbnbCleaningIcon
Short-term rental turnover, Airbnb
House + sparkles: vacation home freshly cleaned
CommercialCleaningIcon
Office, retail, warehouse cleaning
Wide office building with window grid
MedicalCleaningIcon
Hospital, clinic, sterile-grade cleaning
Medical badge + sterile sparkles
EndOfLeaseIcon
Bond / end-of-lease clean
Key + return arrow: keys handed back
StrataCleaningIcon
Strata, body-corp, multi-unit cleaning
Apartment block: 3 floors × 2 units
CarpetCleaningIcon
Carpet steam-clean, rug care
Rectangular carpet with fringe + stripes
WindowCleaningIcon
Window cleaning, glass care
Window pane + diagonal squeegee
GymIcon
Gyms, weight rooms, strength training
Olympic barbell with plates: heavier than dumbbell
PersonalTrainerIcon
PTs, 1-on-1 trainers, online coaching
Stopwatch: the timed-workout artefact
YogaIcon
Yoga studios, meditation, mindfulness
Seated figure in lotus pose
PilatesIcon
Pilates studios, reformer work
Pilates ring with grip pads
TutorIcon
Tutors, exam prep, after-school
Chalkboard on a stand with chalk lines
MusicTeacherIcon
Music teachers, instrument tutors
Quarter note with eighth-note flag
AccountantIcon
Accountants, bookkeepers
Calculator: display + 3×3 button grid
TaxAgentIcon
Tax agents, BAS agents, audit
Magnifying glass over $: review/audit gesture
LawyerIcon
Lawyers, solicitors, legal firms
Scales of justice: central post, crossbeam, V-pans
MortgageBrokerIcon
Mortgage brokers, home-loan advisors
House + $ side by side
ConsultantIcon
Consultants, strategy, advisory
Lightbulb: idea/strategy
MarketingAgencyIcon
Marketing agencies, growth, ads
Megaphone with sound waves
FreelancerIcon
Freelancers, contractors, remote work
Laptop: universal remote-work artefact
SalonIcon
Hairdressers, salons, barbers
Open scissors with twin pivot rings
Brand artefacts
2 iconsThe two signature glyphs. Use Book wherever the product is named or pictured (nav, footer brand link, onboarding). Use Bookmark for "saved", "featured", "kept for later", tinted with text-bookmark-500 for the gold accent.
BookIcon
Brand mascot | OneBookPlus, the product itself
Open-book gesture from the logomark: left page + right page + central spine
BookmarkIcon
Saved, marked, featured, kept for later
Ribbon with V-notch tail: pairs with bookmark-gold for branded contexts
UI primitives
16 iconsArrowRightIcon
CTAs, links, next step
CheckIcon
Confirmation, included feature
XIcon
Close, dismiss, not included
PlusIcon
Add, create, expand
ChevronDownIcon
Disclosure, accordion, menu
ChevronRightIcon
Navigation, drill-in, next
SearchIcon
Search inputs, command palette
MoreHorizontalIcon
Row actions, overflow menus
EditIcon
Edit, rename, modify
SettingsIcon
Settings, preferences, config
TrashIcon
Delete, remove, archive
BellIcon
Notifications, alerts inbox
UsersIcon
Team, staff, multiple contacts
CalendarIcon
Date pickers, due dates, schedules
AlertIcon
Warnings, validation errors
DollarIcon
Money, balance, currency
Domain icons
12 iconsInvoiceIcon
Invoices, quotes, statements
Document with double-rule total: the Subtotal / GST / Total underline tradie invoices actually print
BookingIcon
Online bookings, scheduling
Appointment diary with a bookmark on the booked date
ContactIcon
CRM, contacts, leads
Conventional contact card: universal first read for CRM
PaymentIcon
Payments, cards, checkout
Paper receipt with zigzag tear-off: the register docket gesture
DashboardIcon
Dashboards, overviews
Open ledger spread: bar chart on the left page, stat lines on the right
BasIcon
BAS, GST, tax lodgement
Bookmarked ledger page with a percent mark: the tax-page sister of Invoice
LockIcon
Security, privacy, encryption
Conventional padlock: trust signals stay universal
GlobeIcon
Online presence, websites
Conventional globe: circle + equator + meridian for instant reading
StarIcon
Reviews, ratings, favourites
Chunky stamped star: pressed into the page, pairs with bookmark-gold tint
MailIcon
Email, campaigns, inbox
Conventional envelope: UI affordance, clarity first
JobIcon
Jobs, work orders, task sheets
Clipboard with integrated clip + task lines: the tradie's job docket
ReportIcon
Reports, analytics, printouts
Printed page with title rule + bar chart: the deliverable off the printer
Size scale
How to use
import { ArrowRightIcon, InvoiceIcon } from "@/components/icons";
// Inherits text color, wrap in any text-color class
<ArrowRightIcon size="md" />
<button className="text-brand-600">
<InvoiceIcon size="sm" />
New invoice
</button>
// Sizes: xs (14px) · sm (16px) · md (20px) · lg (24px) · xl (32px)
// Or pass a number: <InvoiceIcon size={28} />System
Design tokens
The Tailwind utilities the product is built on. Spacing follows the standard 4px scale. Shadows are bespoke (paper / page / spine), they evoke the brand's journal aesthetic instead of generic SaaS card lifts.
Spacing scale
| Token | px | Visual | Use |
|---|---|---|---|
| space-1 | 4px | Tight icon-text gap | |
| space-2 | 8px | Compact stack | |
| space-3 | 12px | Default paragraph rhythm | |
| space-4 | 16px | Card / form padding | |
| space-6 | 24px | Section header gap | |
| space-8 | 32px | Module padding | |
| space-12 | 48px | Section break | |
| space-16 | 64px | Hero / page padding | |
| space-24 | 96px | Major section gap |
Border radius
rounded-sm
4px
rounded-md
6px
rounded-lg
8px
rounded-xl
12px
rounded-2xl
16px
rounded-full
9999px
Shadows
Custom "paper" shadow tokens, warmer and softer than default Tailwind shadows. They evoke ink-on-paper lift, not glossy SaaS cards.
shadow-page
Standard card lift
shadow-page-md
Active / hover
shadow-page-lg
Modal / popover
shadow-spine
Open-book left edge
System
Motion & easing
Motion supports comprehension, never decoration. Short, calm, predictable. Always respect prefers-reduced-motion by reducing duration to 0.01ms.
Duration scale
150ms
Hover, focus, micro
200ms
State change (toggle, tab)
300ms
Page-region transition
500ms
Modal / drawer reveal
Easing
ease-out
Default for entries, fast start, soft land
hover the card to preview
ease-in-out
Two-way motion, drawers, modals
hover the card to preview
linear
Loaders only, never for state change
hover the card to preview
System
Component patterns
The visual vocabulary every screen is built from. Examples below render the actual styles used in production, copy directly.
Buttons
Primary, main action per surface (1 max)
Secondary, supporting action
Tertiary, cancel, dismiss
Destructive, confirmed irreversible
Form inputs
That ABN didn't match. Check digits or paste it again.
Badges
Toasts & alerts
Invoice sent
Receipt in their inbox. You'll get paid via Stripe.
Expense saved without a receipt
Attach a photo or PDF and we'll read the GST off it.
Couldn't send invoice
Recipient email bounced. Check the address.
System
Data visualisation
Chart and dashboard palette. Categorical hues are ordered so the first 3 carry the heaviest signal, use them for the primary series before falling through.
Categorical palette
Use in this order. Stops at 7, if you have more series, group them or filter.
1
Teal
#0d9488
2
Indigo
#4f46e5
3
Amber
#f59e0b
4
Rose
#e11d48
5
Violet
#7c3aed
6
Emerald
#059669
7
Sky
#0284c7
Sequential (heatmap)
For ordered intensity, calendar heatmaps, density, magnitude. Use brand teal stops.
Bar chart pattern
Invoiced, last 7 days
Bars: brand-600. Axis labels: ink-400 mono. No gridlines, let the bars carry the comparison.
Rules
· Default chart bar / line: brand-600. Add secondary hues only when a second series exists.
· Never use red or green as a primary series colour, reserved for state.
· Always show empty states for charts ("No data yet"), never a blank rectangle.
· Use thousands separators in axis labels ("1,200" not "1200").
· Currency: always with the AUD prefix ("$1,234", never "1234").
System
Empty, loading, error states
Every list, dashboard, and form needs all three. They're the cheapest place to make the product feel finished, never ship a blank box.
Empty
No invoices yet
Tap + to send your first.
Brand icon, headline tells the truth, next-action button.
Loading
Skeleton placeholders, never a spinner alone. Match the actual content layout.
Error
Can't load invoices
Connection dropped. Try again in a sec.
State icon, plain-spoken cause, retry CTA. Never a stack trace.
System
Email & notifications
Transactional voice is calmer than landing-page voice. Lead with the fact, then the action. No emoji in subject lines.
Email preview
600px width
Hi Steve,
Bondi Plumbing has sent you an invoice for $1,605.00.
Due 19 March 2026.
View invoiceOneBookPlus · 12 345 678 901 · Melbourne, AU
Subject lines
Invoice from Bondi Plumbing · $1,605.00
Booking confirmed · Mon 12 March, 9:00 am
Payment received · $1,605.00 from Steve K.
Fact first. Currency or time second. No emoji.
Push & SMS
"Steve paid Invoice #1042. $1,605 in your account."
"New booking: Mon 9 am, Steve K."
Push: under 70 chars. SMS: under 160. Always include who and what.
Identity
Photography & imagery
Real Australian operators in real workplaces. Warm light, honest framing. The product appears on real devices, phones in vans, tablets at counters.
Use
- · Working tradies, cleaners, hospitality staff, at the job, not posed
- · Phones held by operators with paint, flour, or grease on their hands
- · Australian workplaces (Melbourne lanes, suburban driveways, country towns)
- · Warm afternoon light, real shadows
- · Phone mockups using current iPhone frame, not generic devices
Avoid
- · Stock photography of generic "business people" in suits
- · Clean white-cyc "office" backdrops with no context
- · American workplaces, dollars-symbol overlays, US-style settings
- · Heavy Instagram filters, vignettes, fake-blue gradients
- · Old / generic phone or laptop frames
Illustration
The brand currently doesn't use illustration, the icon set and real photography carry visual identity. If illustration is ever introduced, it must inherit the paper-and-ink quality: warm, hand-drawn feel, never flat vector mascots.
Rules
Usage Rules
Please follow these guidelines when using our brand assets.
Do
Use the logo on a clean white or dark background
Maintain adequate clear space around the logo (minimum 50% of icon size)
Use the provided SVG for crisp rendering at any size
Reference our brand colors using the hex codes provided
Use the wordmark alongside the logomark when space allows
Don't
Alter the logo colors or proportions
Add effects like drop shadows, gradients, or outlines to the logo
Place the logo on busy or low-contrast backgrounds
Rotate, skew, or distort the logo
Use the logo smaller than 24px in height
Native
iOS / SwiftUI
Brand colors available as named Xcode asset catalog colors.
SwiftUI Usage
// Brand colors, available in Asset Catalog
Color("Brand300") // #5eead4, Light accent
Color("Brand400") // #2dd4bf, Accent
Color("Brand500") // #14b8a6, Primary
Color("Brand600") // #0d9488, Primary dark
Color("Brand700") // #0f766e, Deep
Color("Brand800") // #115e59, Darker
Color("Brand950") // #042f2e, Deepest
// Teal shorthand
let teal = Color(red: 13/255, green: 148/255, blue: 136/255)
// Logo usage
AppLogoIcon(size: 64) // Renders the logo at any size
AppLogoText(size: 20) // "OneBookPlus" wordmark
AppLogoText(light: false) // Dark background variantReference
Brand changelog
When parts of the brand evolve. Partners checking they have the latest assets should land here first.
- v2.1May 2026
- Iconography refresh: 127 custom icons across brand artefacts, industry verticals, industry-specific glyphs, UI primitives, and domain icons
- Persona icons ("iconKey" registry) deployed across 40+ /for/<industry>/ pages, emoji retired site-wide
- Hover-expand variants + dark-preview toggle on /brand iconography section
- Added Mission, Voice & Tone, design tokens, motion, components, data-viz, state patterns, email style
- Logo construction, clear-space, minimum-size, and misuse examples
- Press kit page split off at /brand/press
- v2.0Q1 2026
- Brand teal locked at #0d9488 (brand-600) across web, iOS, and email
- Open-book logomark with + badge, adopted as the canonical brand mark
- OneBookPlus wordmark with Georgia italic "Book" centre
- Lucide-react dependency removed, every icon is now bespoke OneBookPlus
- v1.02025
- OneBookPlus launched with founding brand identity
Need something else?
For press inquiries, custom assets, or co-branding requests, reach out to us.
Contact Us