GO Analog
GOIAN Design System

A precision instrument you can feel.

The shared foundation for every GOIAN product — warm ink & paper, one fixed burnt-orange accent, tactile controls, and an instrument’s calm. This page is the foundation you review and comment on; the hyper-creative art direction gets built on top of it in /design-build.

Tailwind v4shadcn/uiNext.js 16Burnt-orange accent
One fixed foundation
No theme switcher — a single burnt-orange accent, with the After-Sunset quartet as supporting color for charts & data.
Toggle light / dark
Both modes are WCAG-AA verified. The accent takes ink text by rule.
Comment anywhere
Point me at any section → component (e.g. “Forms → Select”) and we’ll shore it up.
Foundations

Color

Foundation neutrals — shared across every app
Background
--background
Foreground
--foreground
Card
--card
Muted
--muted
Muted FG
--muted-foreground
Border
--border
Primary
--primary
Secondary
--secondary
Accent
--accent
Destructive
--destructive
Ring
--ring
Brand
--brand
Supporting palette — chart-1…5 (After-Sunset, alongside the burnt-orange brand)
Chart 1
--chart-1
Chart 2
--chart-2
Chart 3
--chart-3
Chart 4
--chart-4
Chart 5
--chart-5
Foundations

Typography — three voices

Instrument Serif · the statement

Build like you mean it.

Serif, ≤ ~10 words. One weight — stress rides on the italic.

DM Sans · the read

When there’s something to actually read — a couple of sentences, a paragraph, an idea worth sitting with — the sans carries it. Soft, even, quiet, so the words do the work.

JetBrains Mono · the machine reports
RISE 6:28A · SET 8:50P
TEMP 86° · UV 2 · HUM 55%
WIND 17 NE · 30.1 INHG

GO•ANALOG ▘▝▖▗

Emphasis — one weight, so stress is the italic (+ optional accent)

How it’s built

Built for clarity, systems & scale.

Accent italic — hero lines

The rhythm should feel inevitable.

Plain italic — everywhere else

Say the hard thing, in love.

No bold cut exists — emphasis rides entirely on the italic. Lift a word or two; reserve the accent color for hero lines. It’s a scalpel, not a highlighter.

Subtitle — JetBrains Mono, uppercase, tracked

How I think

Chapter one

Field notes

Larger · text-sm

Type scale

Subtitle 12 · mono caps

Display 48

Heading 30

Subheading 20

Body 16 — the default reading size for DM Sans.

Caption 14 — secondary & supporting text.

MONO 12 — DATA / LABELS / METADATA

Header ladder — Instrument Serif at every step (give sizing feedback per row)
Display · text-6xl · 60px

A precision instrument you can feel

H1 · text-5xl · 48px

The instrument you can feel

H2 · text-4xl · 36px

Warm ink, paper, and one quiet accent

H3 · text-3xl · 30px

One accent per app

H4 · text-2xl · 24px

Tactile controls, an instrument’s calm

H5 · text-xl · 20px

Headings that hold the page

H6 · text-lg · 18px

Small titles, same voice

In context — the hierarchy in a real read

Field notes · 03

A precision instrument you can feel

Warm ink, quiet calm, and controls that push back — the case for a design language you operate rather than merely look at.

Every GOIAN product shares one foundation: warm ink on paper, a single accent chosen per app, and tactile controls that respond under the thumb. The serif carries the statements; the sans carries the read; the mono carries the machine.

Why one accent per app

Foundation stays fixed so the system feels like one family. The burnt-orange accent is the constant — and the After-Sunset quartet rides alongside it as supporting color for charts and data.

“A powerful engine under quiet, tactile controls.”

Small headings, same voice

Down at subsection scale the serif keeps its character without shouting. Sizing is the lever — the voice is constant. Tune the steps until the rhythm from headline to caption feels inevitable.

Foundations

Shape & Elevation

Corners are uniformly sharp (radius 0) across the system — so the language is elevation & grain, not rounding.

Tactile cap
Glow — follows your cursor (hover)
Hover across me
Grain surface
Matte, paper-like
Foundations

Pixel iconography

The 80s-pixel icon track the brand system reserved — recolored to currentColor so every glyph inherits the ink and takes the brand accent. Browse the full set + dot-matrix form controls →

A sampling — inherits ink, takes the accent
Inherited color
Crisp at any size
Components

Actions

Button — variants
Sizes · with icon · states
Toggle · Toggle group
Components

Forms

58
Components

Data Display

Net volume from sales
This month
+12%
$32,234.22
UPDATED 18:42 · OTTAWA
IS
Ian Schneider
ian@goian.co
ActiveOwner
BUILD
62%
AppAccentStatus
ChronicleBurnt orangeLive
GoBasecampBurnt orangeLive
go-brain—TBD
Skeleton (loading)
Components

Feedback

Components

Overlays

Base

More primitives — the complete set

The full shadcn base, themed by GO Analog tokens. The bespoke tactile signature components (dials, embossed readouts) get built on top in /design-build.

Chart — uses the supporting palette
Calendar
September 2026
Input OTP
Resizable panels
Drag the handle
Panel B
Collapsible · Context menu · Drawer
Right-click me
Aspect ratio
16 / 9
Also in the base (installed · demoed in /design-build)
carouselcommandmenubarnavigation-menusidebar