Wood & Felt

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(42% 0.1 72)
--fg oklch(95% 0.015 78)
--muted oklch(72% 0.022 74)
--surface oklch(46% 0.1 74)
--surface-2 oklch(50% 0.09 76)
--border oklch(32% 0.08 62)
--accent oklch(42% 0.11 150)
--accent-fg oklch(98% 0 0)
--focus oklch(46% 0.12 150)

Token	Value
--font-body	`'Merriweather', Georgia, serif`
--font-display	`'Merriweather', Georgia, serif`
--font-mono	`ui-monospace, monospace`
--radius	`10px`
--radius-sm	`6px`
--shadow	`0 3px 10px oklch(15% 0.04 45 / 0.7), 0 1px 0 oklch(55% 0.05 60 / 0.35) inset`
--shadow-lg	`0 20px 60px oklch(15% 0.04 45 / 0.8)`

@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700;900&display=swap');

:root {
	--bg: oklch(42% 0.1 72);
	--fg: oklch(95% 0.015 78);
	--muted: oklch(72% 0.022 74);
	--surface: oklch(46% 0.1 74);
	--surface-2: oklch(50% 0.09 76);
	--border: oklch(32% 0.08 62);
	--accent: oklch(42% 0.11 150);
	--accent-fg: oklch(98% 0 0);
	--focus: oklch(46% 0.12 150);
	--font-body: 'Merriweather', Georgia, serif;
	--font-display: 'Merriweather', Georgia, serif;
	--font-mono: ui-monospace, monospace;
	--radius: 10px;
	--radius-sm: 6px;
	--shadow: 0 3px 10px oklch(15% 0.04 45 / 0.7), 0 1px 0 oklch(55% 0.05 60 / 0.35) inset;
	--shadow-lg: 0 20px 60px oklch(15% 0.04 45 / 0.8);
}

Where it came from

Origin: Apple iOS Game Center felt table and iBooks wooden bookshelf

iOS 6 Game Center placed a felt-topped wooden table as its entire background, and iBooks displayed books on a glowing wooden shelf. These were among the most elaborate skeuomorphic scenes Apple ever shipped. They borrowed from the library and games-room visual vocabulary — mahogany, green baize, recessed lighting — to make the digital feel leisurely and premium. Gone in iOS 7, fondly remembered.

How to spot it

Wood-grain texture via layered fine linear gradients in brown-tan tones
Green, burgundy, or tan felt surface with inset shadow and subtle fibre hint
Rich warm palette: mahogany, walnut, aged oak
Recessed shelf- or table-like containers with strong inner shadow

Trade-offs

Strengths	Weaknesses
Exceptionally warm and distinctive — nothing else reads quite like this	Extremely narrow applicability — very wrong in any other context
Works perfectly for leisure, games, and reading contexts	Dark wood grain can fail body-text contrast
High crafted personality that matches the premium product	Reads as heavy and dense on modern high-resolution displays

In the wild

iOS 6 Game Center wooden table view
iBooks bookshelf view
Board-game and card-game companion apps

Use it when

Game, book, or leisure apps where the cosy library or game-table atmosphere is the right emotional register.