prototype: design tokens

2026-07-16 16:18:41 +00:00
parent 7e1475e48e
commit b3fc4b3eaa
1 changed files with 51 additions and 0 deletions
@@ -0,0 +1,51 @@
+/* Hallmark · macrostructure: Split Studio · genre: editorial · theme: custom
+ * vibe: warm studio / Cameron Park / treatment-room honesty
+ * paper oklch(96.5% 0.012 75) · ink oklch(18% 0.014 55) · accent oklch(38% 0.055 185)
+ * display: Cormorant Garamond · body: IBM Plex Sans · outlier: Source Serif 4 (quotes)
+ * nav: N9 edge-aligned · footer: Ft5 statement
+ * enrichment: none (live photography) · honest: pass · chrome: pass
+ * pre-emit critique: P5 H4 E4 S5 R4 V5
+ * axes: light paper · classical-serif display · cool-teal accent
+ */
+:root {
+  --color-paper: oklch(96.5% 0.012 75);
+  --color-paper-2: oklch(93.5% 0.016 72);
+  --color-paper-3: oklch(90% 0.018 70);
+  --color-rule: oklch(82% 0.014 70);
+  --color-muted: oklch(42% 0.02 60);
+  --color-ink: oklch(18% 0.014 55);
+  --color-accent: oklch(38% 0.055 185);
+  --color-accent-ink: oklch(97% 0.01 90);
+  --color-focus: oklch(45% 0.08 185);
+  --color-band: oklch(94% 0.02 70);
+
+  --font-display: "Cormorant Garamond", "Times New Roman", serif;
+  --font-body: "IBM Plex Sans", system-ui, sans-serif;
+  --font-outlier: "Source Serif 4", Georgia, serif;
+
+  --text-sm: 0.875rem;
+  --text-base: 1.0625rem;
+  --text-md: 1.2rem;
+  --text-lg: 1.45rem;
+  --text-xl: 1.85rem;
+  --text-2xl: clamp(2rem, 3.5vw + 0.5rem, 2.75rem);
+  --text-display: clamp(2.5rem, 4.5vw + 0.75rem, 4.25rem);
+
+  --space-2xs: 0.25rem;
+  --space-xs: 0.5rem;
+  --space-sm: 0.75rem;
+  --space-md: 1rem;
+  --space-lg: 1.5rem;
+  --space-xl: 2rem;
+  --space-2xl: 3rem;
+  --space-3xl: 4.5rem;
+  --space-4xl: 6rem;
+  --space-5xl: 8rem;
+
+  --measure: 62ch;
+  --page: min(1120px, calc(100% - 2.5rem));
+  --radius: 2px;
+  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
+  --dur-short: 140ms;
+  --banner-height: 4.25rem;
+}