Material & depth · 2008–2013
Leather & Stitch
Dark pebbled leather, contrast stitching along every edge, and the luxury vocabulary of a premium hand-bound notebook.
Live preview base style — press Wear
$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(24% 0.04 45) - --fg
oklch(88% 0.025 70) - --muted
oklch(62% 0.03 65) - --surface
oklch(30% 0.045 46) - --surface-2
oklch(35% 0.04 48) - --border
oklch(42% 0.04 48) - --accent
oklch(76% 0.14 82) - --accent-fg
oklch(20% 0.04 45) - --focus
oklch(76% 0.14 82)
| Token | Value |
|---|---|
| --font-body | 'Lora', Georgia, serif |
| --font-display | 'Lora', Georgia, serif |
| --font-mono | ui-monospace, monospace |
| --radius | 8px |
| --radius-sm | 6px |
| --shadow | 0 2px 8px oklch(10% 0.02 40 / 0.6), 0 1px 0 oklch(50% 0.04 55 / 0.3) inset |
| --shadow-lg | 0 16px 48px oklch(10% 0.02 40 / 0.75) |
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@500;600;700&display=swap');
:root {
--bg: oklch(24% 0.04 45);
--fg: oklch(88% 0.025 70);
--muted: oklch(62% 0.03 65);
--surface: oklch(30% 0.045 46);
--surface-2: oklch(35% 0.04 48);
--border: oklch(42% 0.04 48);
--accent: oklch(76% 0.14 82);
--accent-fg: oklch(20% 0.04 45);
--focus: oklch(76% 0.14 82);
--font-body: 'Lora', Georgia, serif;
--font-display: 'Lora', Georgia, serif;
--font-mono: ui-monospace, monospace;
--radius: 8px;
--radius-sm: 6px;
--shadow: 0 2px 8px oklch(10% 0.02 40 / 0.6), 0 1px 0 oklch(50% 0.04 55 / 0.3) inset;
--shadow-lg: 0 16px 48px oklch(10% 0.02 40 / 0.75);
}Where it came from
Origin: Apple iOS and OS X apps c. 2010–2012 — iCal/Calendar, Contacts, Find My Friends
Apple popularised stitched leather in its early-2010s apps — iCal and Calendar with a stitched leather header and torn-off page edges, Find My Friends with sewn leather throughout. The look drew from premium stationery and luxury goods. Scott Forstall was its best-known champion; after his departure was announced in late 2012, Jony Ive's iOS 7 (2013) removed it in a flat redesign. It remains one of the most clearly dated and most recognisable touchstones of the skeuomorphic peak.
How to spot it
- Dark pebbled or grained leather texture via layered radial CSS gradients
- Contrast-colour stitching along edges — dashed border at offset from the edge
- Embossed or debossed labels on leather surfaces
- Warm brown/tan palette with gold, cream, or contrasting thread colour
Trade-offs
| Strengths | Weaknesses |
|---|---|
| Strong premium, luxury association — nothing else looks quite like it | Very narrow applicability — reads as wrong outside its context |
| Highly distinctive and instantly recognisable | Immediately reads as pre-2013 |
| Right for premium notebook, planner, and journal products | Dark leather background makes text contrast difficult to manage |
In the wild
- Mac OS X Lion iCal stitched-leather header
- Find My Friends sewn-leather interface
- Leather-bound note-taking apps from 2010–2013
Use it when
Premium analogue-digital tools — notebooks, planners, journals — where the leather-binding metaphor has direct product relevance.