Already knows
Surface the answer before the user has to chase it.
wheelbase
Brand book · 2026
The system already knows.
A practical identity and interface standard for the used-car operation that moves faster when nobody has to ask for a status.
Contents
A field manual for people who ship the brand.
This book turns Wheelbase’s operating principles into repeatable decisions: what to use, why it works, and what must remain true as the product grows.
The specification is designed to work equally well in a browser or as a landscape print guide. Treat the named rules as the source of truth when visual preference and operational clarity compete.
Brand foundation
Relief and control, before anyone asks.
Wheelbase turns the expensive uncertainty of a used-car lot into a clear operating picture: every car, every vendor, every dollar.
The emotional outcome is not novelty. It is the moment a dealership veteran sits down, sees what is stuck, and trusts that the system already has the answer.
Our voice is blue-collar confidence: concise, specific, dollar-grounded. We do not dramatize the workflow. We make the work legible.
Recon is where your margin disappears.
Money is visible
Costs, days, and aging are first-class information.
Calm under density
Use hierarchy and rhythm to make operational detail feel effortless.
Personality
Refined. Fast. Operationally certain.
Wheelbase is built with the quality bar of Linear or Raycast, not a legacy dealership DMS. Familiar where work needs speed. Precise where the details carry money.
- Should feelA tireless professional who already knows where the car is.
- Should say“2 days stuck in body” instead of “Your workflow may need attention.”
- Never becomeA tab maze, a badge soup, or a glossy dashboard with no operational point.
- Physical sceneA manager checks a dark console under fluorescent shop light and knows what to fix next.
Logo system
The mark carries movement; the wordmark carries confidence.
Use the complete lockup whenever the name must be read. Use the mark when the Wheelbase context is already established or the available space is truly small.
- Primary useYellow lockup on the dark console field.
- Light useNear-black lockup on true off-white.
- Mark onlyApp icon, avatar, favicon, and tightly constrained UI.
wheelbase
Primary lockup · Racing yellow on the dark console surface
Approved formats
Four formats. One source.
Choose the format that fits the available space and level of recognition. The wheel and wordmark always remain the approved source artwork.
w
wheelbase
wheelbase
Apple products
One tile. Every Apple context.
The app icon carries the movement and the W when a product surface has no room for the complete name.
- MasterDefault is the primary App Store and home-screen icon.
- AppearanceDark and Clear exports preserve recognition across system presentation.
- TintTinted exports respond to the user’s selected iOS tint without redrawing the mark.
Approved treatments
One form, three legitimate settings.
Treatments change with contrast, not taste. Do not introduce decorative colors, effects, or alternative typesetting.
Clear space
wheelbase
1 × mark radius on all sides
Keep the protected zone clear of type, edges, controls, and competing marks.
Minimums and misuse
Use the source mark. Do not reinterpret it.
- Digital lockup100 px wide minimum
- Mark only20 px minimum; 16 px favicon
- Print lockup20 mm wide minimum
wheelbase
Do not distortwheelbase
Do not recolorwheelbase
Do not add effectswheelbase
Do not rebuild spacingwheelbase
Do not outlinewheelbase
Do not change typeColor system
Racing yellow is a signal flag, not a coating.
Most of Wheelbase is cool, quiet, and nearly greyscale. Yellow identifies the single most important thing: the current action, selection, or live figure.
The Signal-Flag Rule. Racing yellow appears on no more than 10% of a screen. If two yellow elements compete for attention, one is wrong.
- Dark defaultCool blue-tinted near-black reads clearly in a shop, office, or auction lane.
- Light counterpartTrue off-white, never a warm paper tint.
- Status colorReserved for status with a label or icon; never decoration.
oklch(0.185 0.006 250)Console fieldoklch(0.168 0.006 250)Wells and guttersoklch(0.240 0.008 250)Elevated surfacesoklch(0.82 0.18 88)Racing yellowoklch(0.74 0.11 195)Quiet secondaryoklch(0.985 0 0)Light field / primary textSemantic status
Meaning always survives without color.
The Hue-Plus-Label Rule: every colored dot, pill, bar, or number has a word or icon alongside it. This protects clarity in poor lot light and for color-vision differences.
In progressSignal blue
ReadySignal green
WaitingSignal amber
BlockedDestructive red
- NeverUse multiple saturated status colors as an ornamental palette.
- AlwaysPair status hue with plain language such as “Ready,” “Waiting,” or “Blocked.”
Typography
A clear hierarchy for work that cannot wait.
Use the wordmark font only for the wordmark. Let Sora establish page moments, Lexend carry the interface, and JetBrains Mono make every number align.
wheelbase
See what is stuck.
Move every car to the frontline faster.
$3,420.00 · VIN 7FARW2H8 · 12 DAYS
The Tabular-Money Rule. Every dollar figure, count, vehicle ID, and day count uses tabular numerals. The numbers should line up before the user reads them.
Interface language
Operational density without operational noise.
The core product is a composed workspace, not a collection of dashboards. Tonal layers establish depth; yellow directs action; figures make money and time immediately visible.
- DepthUse sunken → base → card → raised tonal layers before shadows.
- ActionOne yellow primary action per decision surface.
- DetailKeep context in a split pane or contained panel, not a window-wide modal.
Recon watchlist
Cars that need a decision
Needs attention
2022 Ford F-150STK 4491 · Body
$1,8602021 Honda CR-VSTK 4486 · Detail
$7802023 Lexus RX 350STK 4472 · Ready
ReadyTabular money
Mono figures make spend legible.
Signal action
Yellow is reserved for the next action.
Tonal-first depth
Structure, not decorative shadow.
Components
Standard affordances, executed impeccably.
Familiarity is a feature. Every component must make its purpose obvious before styling makes it distinctive.
- ButtonsSoft 8 px corners. Yellow only for the primary action. All other actions use a quiet surface or ghost treatment.
- Inputs36 px recessed wells with a yellow focus ring. Do not substitute light grey placeholders for readable labels.
- Cards12 px maximum corner treatment, hairline border, tonal lift on hover only.
- Motion150–250 ms, only to communicate a state change. Content is visible before animation begins.
Voice principles
Say the work out loud.
Wheelbase speaks like a capable teammate: terse, clear, and grounded in the actual cost of waiting. It never hides a problem behind a vague notification.
“3 cars have been in body for 2+ days. Estimated holding cost: $315.”
Specific car count, clear condition, dollar consequence, and no theatrics.
“Your workflow may need attention. Explore opportunities now.”
Abstract language delays action and leaves the user to find the real problem.
Lead with the fact
“Inspection is overdue” before explaining why it matters.
Name the owner
People, vendors, and locations are more useful than generic queues.
Show the number
Use days, dollars, and counts when they change a decision.
Keep the next step plain
“Assign to detail” beats motivational or clever CTAs.
Accessibility and trust
If it is not legible in the lot, it is not finished.
WCAG 2.1 AA is the floor. Wheelbase must remain clear for a technician with one hand free, a manager in a bright office, and every user who cannot rely on color alone.
Contrast first
Body text clears 4.5:1. Yellow always receives near-black ink.
Color plus language
Status never depends on hue without a label, dot, or icon.
Reduced motion
Respect system preference. Motion never gates content or task completion.
Touch and focus
Visible focus, readable targets, and clear semantics across desktop and mobile.
Live information
Use helpful live regions for changing costs, counts, and workflow state.
Prose remains human
Labels and error states state what happened and what the user can do next.
Implementation handoff
Make the rules reusable.
The brand works when every engineer, designer, and partner can make the next correct decision without reinterpreting the system.
- Logo sourceUse the approved wordmark and mark. Never rebuild the lockup from type or shapes.
- FontsSufrimeda for the wordmark; Sora for page display; Lexend for interface; JetBrains Mono for figures.
- Token truthUse the shared design token values, especially the cool-neutral surface ramp and racing-yellow accent.
- Final checkTest contrast, keyboard focus, reduced motion, and every responsive breakpoint before release.
:root {
--wb-yellow: oklch(0.82 0.18 88);
--wb-base: oklch(0.185 0.006 250);
--wb-sunken: oklch(0.168 0.006 250);
--wb-card: oklch(0.215 0.007 250);
--wb-raised: oklch(0.240 0.008 250);
--wb-border: oklch(0.295 0.006 250);
--wb-ink: oklch(0.985 0 0);
}