Line Art

Live preview base style — press Wear

This month

$2,100

Revenue, up 12% from last month.

Customer	Plan	Status	MRR
Northwind	Studio	Active	$1,240
Acme Labs	Team	Trial	$0
Kaldi Coffee	Studio	Active	$860

Use this style 16 tokens

--bg oklch(98.5% 0.008 78)
--fg oklch(8% 0 0)
--muted oklch(50% 0 0)
--surface oklch(98.5% 0.008 78)
--surface-2 oklch(95% 0.006 76)
--border oklch(72% 0 0)
--accent oklch(8% 0 0)
--accent-fg oklch(98.5% 0.008 78)
--focus oklch(30% 0 0)

Token	Value
--font-body	`'Cormorant Garamond', Georgia, serif`
--font-display	`'Cormorant Garamond', Georgia, serif`
--font-mono	`ui-monospace, monospace`
--radius	`0px`
--radius-sm	`0px`
--shadow	`none`
--shadow-lg	`none`

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&display=swap');

:root {
	--bg: oklch(98.5% 0.008 78);
	--fg: oklch(8% 0 0);
	--muted: oklch(50% 0 0);
	--surface: oklch(98.5% 0.008 78);
	--surface-2: oklch(95% 0.006 76);
	--border: oklch(72% 0 0);
	--accent: oklch(8% 0 0);
	--accent-fg: oklch(98.5% 0.008 78);
	--focus: oklch(30% 0 0);
	--font-body: 'Cormorant Garamond', Georgia, serif;
	--font-display: 'Cormorant Garamond', Georgia, serif;
	--font-mono: ui-monospace, monospace;
	--radius: 0px;
	--radius-sm: 0px;
	--shadow: none;
	--shadow-lg: none;
}

Where it came from

Origin: Engraving, woodcut printing, technical illustration, architectural drawing

Line art predates printing: engravers and woodcut artists worked entirely in mark-making. Technical illustration inherited the discipline — mechanical drawings and circuit diagrams are pure line art. In digital design it became a counterpoint to the fill-heavy flat and gradient styles, valued for its precision and the craft implied by a clean, confident line.

How to spot it

Single-colour or dual-colour line work with no fills or flat fills only
Variable stroke weight or consistent hairline weight throughout
Form defined by contour, not by colour or shadow
Clean white or off-white background that lets the line breathe

Trade-offs

Strengths	Weaknesses
Scales infinitely at any resolution	Requires skilled illustration — bad line art looks cheap
Communicates precision and intentionality	Low visual weight can disappear at small sizes
Combines cleanly with any typography	Limited ability to convey depth or atmosphere

In the wild

Technical product documentation and instruction manuals
Premium brand identity illustration systems
Editorial spots and section headers in quality publications

Use it when

Precision, craft, and restraint are the brand values — and the illustration budget supports skilled execution.