design system token v0.1

2026-04-13 15:33:00 -05:00
parent 52b4156653
commit c3215945f2
63 changed files with 11562 additions and 181 deletions
--- a/tokens/typography.json
+++ b/tokens/typography.json
@@ -0,0 +1,155 @@
+{
+  "typography": {
+    "$description": "Greyhaven Design System — Typography Tokens",
+    "fontFamily": {
+      "sans": {
+        "$type": "fontFamily",
+        "$value": ["Aspekta", "Inter", "ui-sans-serif", "system-ui", "sans-serif"],
+        "$description": "UI labels, buttons, nav, forms — Aspekta primary, Inter fallback"
+      },
+      "serif": {
+        "$type": "fontFamily",
+        "$value": ["Source Serif 4", "Source Serif Pro", "Georgia", "serif"],
+        "$description": "Headings, body content, reading — Source Serif primary"
+      },
+      "mono": {
+        "$type": "fontFamily",
+        "$value": ["ui-monospace", "SFMono-Regular", "Menlo", "Monaco", "Consolas", "monospace"],
+        "$description": "Code blocks and monospaced content"
+      }
+    },
+    "fontSize": {
+      "xs": {
+        "$type": "dimension",
+        "$value": "0.75rem",
+        "$description": "12px — metadata, fine print"
+      },
+      "sm": {
+        "$type": "dimension",
+        "$value": "0.875rem",
+        "$description": "14px — captions, nav, labels, buttons"
+      },
+      "base": {
+        "$type": "dimension",
+        "$value": "1rem",
+        "$description": "16px — body text"
+      },
+      "lg": {
+        "$type": "dimension",
+        "$value": "1.125rem",
+        "$description": "18px — large body, subtitles"
+      },
+      "xl": {
+        "$type": "dimension",
+        "$value": "1.25rem",
+        "$description": "20px — H3"
+      },
+      "2xl": {
+        "$type": "dimension",
+        "$value": "1.5rem",
+        "$description": "24px — H2"
+      },
+      "3xl": {
+        "$type": "dimension",
+        "$value": "1.875rem",
+        "$description": "30px — large H2"
+      },
+      "4xl": {
+        "$type": "dimension",
+        "$value": "2.25rem",
+        "$description": "36px — H1"
+      },
+      "5xl": {
+        "$type": "dimension",
+        "$value": "3rem",
+        "$description": "48px — hero heading"
+      }
+    },
+    "fontWeight": {
+      "normal": {
+        "$type": "fontWeight",
+        "$value": 400,
+        "$description": "Regular body text"
+      },
+      "medium": {
+        "$type": "fontWeight",
+        "$value": 500,
+        "$description": "H3, labels, nav items"
+      },
+      "semibold": {
+        "$type": "fontWeight",
+        "$value": 600,
+        "$description": "H1, H2, buttons"
+      },
+      "bold": {
+        "$type": "fontWeight",
+        "$value": 700,
+        "$description": "Strong emphasis"
+      }
+    },
+    "lineHeight": {
+      "tight": {
+        "$type": "dimension",
+        "$value": "1.25",
+        "$description": "Headings"
+      },
+      "normal": {
+        "$type": "dimension",
+        "$value": "1.5",
+        "$description": "Default"
+      },
+      "relaxed": {
+        "$type": "dimension",
+        "$value": "1.625",
+        "$description": "Body content for readability"
+      }
+    },
+    "letterSpacing": {
+      "tight": {
+        "$type": "dimension",
+        "$value": "-0.025em",
+        "$description": "Headings — tracking-tight"
+      },
+      "normal": {
+        "$type": "dimension",
+        "$value": "0em",
+        "$description": "Body text"
+      },
+      "wide": {
+        "$type": "dimension",
+        "$value": "0.05em",
+        "$description": "Uppercase labels"
+      }
+    },
+    "composite": {
+      "$description": "Pre-composed typography styles for common use cases",
+      "h1": {
+        "$description": "Page heading — serif, text-4xl, font-semibold, tracking-tight"
+      },
+      "h2": {
+        "$description": "Section heading — serif, text-2xl, font-semibold, tracking-tight"
+      },
+      "h3": {
+        "$description": "Subsection heading — serif, text-xl, font-medium"
+      },
+      "body": {
+        "$description": "Body text — serif, text-base, leading-relaxed"
+      },
+      "caption": {
+        "$description": "Caption text — sans, text-sm"
+      },
+      "nav": {
+        "$description": "Navigation — sans, text-sm, font-medium"
+      },
+      "button": {
+        "$description": "Button label — sans, text-sm, font-semibold"
+      },
+      "label": {
+        "$description": "Form label — sans, text-sm, font-medium"
+      },
+      "metadata": {
+        "$description": "Metadata — sans, text-xs, font-medium"
+      }
+    }
+  }
+}