@syncupsuite/themes 0.3.0 → 0.4.0

package/src/wiener-werkstaette/tokens.json

@@ -0,0 +1,780 @@
+{
+  "$name": "wiener-werkstaette",
+  "$description": "Wiener Werkstätte — Vienna Workshop, founded 1903. Josef Hoffmann and Koloman Moser's Gesamtkunstwerk vocabulary: geometric rigor, Klimt gilding, and Biedermeier warmth.",
+  "$extensions": {
+    "syncupsuite.foundation": {
+      "story": "Josef Hoffmann and Koloman Moser's Vienna Workshop unified fine art and craft under geometric rigor. Their black-and-white checkerboard motifs, Klimt-gilded surfaces, and Biedermeier cream walls created a distinctly Viennese vocabulary that lives between ornament and abstraction.",
+      "philosophy": "Gesamtkunstwerk — the total work of art, where every object from building to teaspoon belongs to the same aesthetic whole",
+      "era": "Early Modernist — 1903–1932",
+      "harmonyMode": "golden-ratio",
+      "radiusTendency": "subtle",
+      "typographyCategory": "geometric-sans"
+    }
+  },
+  "primitive": {
+    "color": {
+      "gold-klimt-gold": {
+        "50": {
+          "$type": "color",
+          "$value": "#FCF4E5",
+          "$description": "Gold (Klimt-Gold) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#F2E5CE",
+          "$description": "Gold (Klimt-Gold) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#E7D6B6",
+          "$description": "Gold (Klimt-Gold) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#DDC79E",
+          "$description": "Gold (Klimt-Gold) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#D2B886",
+          "$description": "Gold (Klimt-Gold) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#C8A96E",
+          "$description": "Gold (Klimt-Gold) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Gold (Klimt-Gold)",
+              "tradition": "Klimt gilding — gold leaf on Secession paintings. The warmth and material opulence of Vienna's artistic golden age.",
+              "source": "Gustav Klimt: Painting, Design and Modern Life, T. Natter & G. Frodl",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#947A46",
+          "$description": "Gold (Klimt-Gold) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#634D21",
+          "$description": "Gold (Klimt-Gold) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#362500",
+          "$description": "Gold (Klimt-Gold) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#0E0300",
+          "$description": "Gold (Klimt-Gold) 900"
+        }
+      },
+      "crimson-werkst-tte-rot": {
+        "50": {
+          "$type": "color",
+          "$value": "#FFEDE7",
+          "$description": "Crimson (Werkstätte Rot) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#FDCBC3",
+          "$description": "Crimson (Werkstätte Rot) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#EDABA0",
+          "$description": "Crimson (Werkstätte Rot) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#DB8A7D",
+          "$description": "Crimson (Werkstätte Rot) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#C9695C",
+          "$description": "Crimson (Werkstätte Rot) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#B5473A",
+          "$description": "Crimson (Werkstätte Rot) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Crimson (Werkstätte Rot)",
+              "tradition": "Werkstätte textile dyes — lacquered tin boxes and woven fabric. The warm red of Viennese craft tradition.",
+              "source": "Wiener Werkstätte: Design in Vienna 1903–1932, C. Brandstätter",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#8C2D23",
+          "$description": "Crimson (Werkstätte Rot) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#65120C",
+          "$description": "Crimson (Werkstätte Rot) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#400000",
+          "$description": "Crimson (Werkstätte Rot) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#1D0000",
+          "$description": "Crimson (Werkstätte Rot) 900"
+        }
+      },
+      "charcoal-schmiedeeisen": {
+        "50": {
+          "$type": "color",
+          "$value": "#F5F5F4",
+          "$description": "Charcoal (Schmiedeeisen) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#C4C4C3",
+          "$description": "Charcoal (Schmiedeeisen) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#969694",
+          "$description": "Charcoal (Schmiedeeisen) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#6A6A68",
+          "$description": "Charcoal (Schmiedeeisen) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#41413F",
+          "$description": "Charcoal (Schmiedeeisen) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#1C1C1A",
+          "$description": "Charcoal (Schmiedeeisen) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Charcoal (Schmiedeeisen)",
+              "tradition": "Secession building wrought iron — Josef Hoffmann's geometric ironwork. The black of structural craft.",
+              "source": "Josef Hoffmann: Interiors 1902–1913, C. Long",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#161614",
+          "$description": "Charcoal (Schmiedeeisen) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#10100F",
+          "$description": "Charcoal (Schmiedeeisen) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#0A0A09",
+          "$description": "Charcoal (Schmiedeeisen) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#060605",
+          "$description": "Charcoal (Schmiedeeisen) 900"
+        }
+      },
+      "cream-wiener-wei": {
+        "50": {
+          "$type": "color",
+          "$value": "#F6F5F3",
+          "$description": "Cream (Wiener Weiß) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#F6F4F1",
+          "$description": "Cream (Wiener Weiß) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#F6F3EE",
+          "$description": "Cream (Wiener Weiß) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#F5F2EC",
+          "$description": "Cream (Wiener Weiß) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#F5F1EA",
+          "$description": "Cream (Wiener Weiß) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#F5F0E8",
+          "$description": "Cream (Wiener Weiß) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Cream (Wiener Weiß)",
+              "tradition": "Viennese plasterwork walls — Biedermeier domestic interiors. The warm white ground of all Werkstätte composition.",
+              "source": "Vienna 1900: Art, Life & Culture, C. Schorske",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#B1ADA6",
+          "$description": "Cream (Wiener Weiß) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#716E68",
+          "$description": "Cream (Wiener Weiß) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#373530",
+          "$description": "Cream (Wiener Weiß) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#070604",
+          "$description": "Cream (Wiener Weiß) 900"
+        }
+      },
+      "neutral": {
+        "50": {
+          "$type": "color",
+          "$value": "#FCF8F1",
+          "$description": "Neutral 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#F2EEE7",
+          "$description": "Neutral 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#E1DDD7",
+          "$description": "Neutral 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#C7C4BD",
+          "$description": "Neutral 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#9B9891",
+          "$description": "Neutral 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#716E68",
+          "$description": "Neutral 500"
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#504D47",
+          "$description": "Neutral 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#35322D",
+          "$description": "Neutral 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#1D1A15",
+          "$description": "Neutral 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#090704",
+          "$description": "Neutral 900"
+        }
+      },
+      "accent": {
+        "50": {
+          "$type": "color",
+          "$value": "#F8F1FF",
+          "$description": "Accent 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#E1D6FD",
+          "$description": "Accent 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#CCBCF0",
+          "$description": "Accent 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#B6A2E3",
+          "$description": "Accent 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#A289D6",
+          "$description": "Accent 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#8E6FC8",
+          "$description": "Accent 500"
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#694E9A",
+          "$description": "Accent 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#472E6E",
+          "$description": "Accent 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#271045",
+          "$description": "Accent 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#0B0020",
+          "$description": "Accent 900"
+        }
+      }
+    },
+    "typography": {
+      "family": {
+        "heading": {
+          "$type": "fontFamily",
+          "$value": "\"Inter\", \"Futura\", system-ui, sans-serif",
+          "$description": "Heading font family"
+        },
+        "body": {
+          "$type": "fontFamily",
+          "$value": "\"Inter\", system-ui, sans-serif",
+          "$description": "Body font family"
+        },
+        "mono": {
+          "$type": "fontFamily",
+          "$value": "\"JetBrains Mono\", \"Fira Code\", monospace",
+          "$description": "Monospace font family"
+        }
+      },
+      "size": {
+        "xs": {
+          "$type": "dimension",
+          "$value": "0.75rem",
+          "$description": "Font size xs"
+        },
+        "sm": {
+          "$type": "dimension",
+          "$value": "0.875rem",
+          "$description": "Font size sm"
+        },
+        "base": {
+          "$type": "dimension",
+          "$value": "1rem",
+          "$description": "Font size base"
+        },
+        "lg": {
+          "$type": "dimension",
+          "$value": "1.125rem",
+          "$description": "Font size lg"
+        },
+        "xl": {
+          "$type": "dimension",
+          "$value": "1.25rem",
+          "$description": "Font size xl"
+        },
+        "2xl": {
+          "$type": "dimension",
+          "$value": "1.5rem",
+          "$description": "Font size 2xl"
+        },
+        "3xl": {
+          "$type": "dimension",
+          "$value": "1.875rem",
+          "$description": "Font size 3xl"
+        },
+        "4xl": {
+          "$type": "dimension",
+          "$value": "2.25rem",
+          "$description": "Font size 4xl"
+        }
+      },
+      "weight": {
+        "normal": {
+          "$type": "fontWeight",
+          "$value": "400",
+          "$description": "Font weight normal"
+        },
+        "medium": {
+          "$type": "fontWeight",
+          "$value": "500",
+          "$description": "Font weight medium"
+        },
+        "semibold": {
+          "$type": "fontWeight",
+          "$value": "600",
+          "$description": "Font weight semibold"
+        },
+        "bold": {
+          "$type": "fontWeight",
+          "$value": "700",
+          "$description": "Font weight bold"
+        }
+      },
+      "lineHeight": {
+        "tight": {
+          "$type": "number",
+          "$value": "1.25",
+          "$description": "Line height tight"
+        },
+        "normal": {
+          "$type": "number",
+          "$value": "1.5",
+          "$description": "Line height normal"
+        },
+        "relaxed": {
+          "$type": "number",
+          "$value": "1.75",
+          "$description": "Line height relaxed"
+        }
+      }
+    },
+    "spacing": {
+      "0": {
+        "$type": "dimension",
+        "$value": "0px",
+        "$description": "Spacing 0 (0px)"
+      },
+      "1": {
+        "$type": "dimension",
+        "$value": "4px",
+        "$description": "Spacing 1 (4px)"
+      },
+      "2": {
+        "$type": "dimension",
+        "$value": "8px",
+        "$description": "Spacing 2 (8px)"
+      },
+      "3": {
+        "$type": "dimension",
+        "$value": "12px",
+        "$description": "Spacing 3 (12px)"
+      },
+      "4": {
+        "$type": "dimension",
+        "$value": "16px",
+        "$description": "Spacing 4 (16px)"
+      },
+      "5": {
+        "$type": "dimension",
+        "$value": "20px",
+        "$description": "Spacing 5 (20px)"
+      },
+      "6": {
+        "$type": "dimension",
+        "$value": "24px",
+        "$description": "Spacing 6 (24px)"
+      },
+      "8": {
+        "$type": "dimension",
+        "$value": "32px",
+        "$description": "Spacing 8 (32px)"
+      },
+      "10": {
+        "$type": "dimension",
+        "$value": "40px",
+        "$description": "Spacing 10 (40px)"
+      },
+      "12": {
+        "$type": "dimension",
+        "$value": "48px",
+        "$description": "Spacing 12 (48px)"
+      },
+      "16": {
+        "$type": "dimension",
+        "$value": "64px",
+        "$description": "Spacing 16 (64px)"
+      },
+      "20": {
+        "$type": "dimension",
+        "$value": "80px",
+        "$description": "Spacing 20 (80px)"
+      },
+      "0.5": {
+        "$type": "dimension",
+        "$value": "2px",
+        "$description": "Spacing 0.5 (2px)"
+      },
+      "1.5": {
+        "$type": "dimension",
+        "$value": "6px",
+        "$description": "Spacing 1.5 (6px)"
+      }
+    },
+    "radius": {
+      "none": {
+        "$type": "dimension",
+        "$value": "0px",
+        "$description": "Border radius none"
+      },
+      "sm": {
+        "$type": "dimension",
+        "$value": "2px",
+        "$description": "Border radius sm"
+      },
+      "md": {
+        "$type": "dimension",
+        "$value": "4px",
+        "$description": "Border radius md"
+      },
+      "lg": {
+        "$type": "dimension",
+        "$value": "6px",
+        "$description": "Border radius lg"
+      },
+      "xl": {
+        "$type": "dimension",
+        "$value": "8px",
+        "$description": "Border radius xl"
+      },
+      "full": {
+        "$type": "dimension",
+        "$value": "9999px",
+        "$description": "Border radius full"
+      }
+    }
+  },
+  "semantic": {
+    "light": {
+      "background": {
+        "canvas": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.50}",
+          "$description": "Page background"
+        },
+        "surface": {
+          "$type": "color",
+          "$value": "#FFFFFF",
+          "$description": "Card/surface background"
+        },
+        "muted": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.100}",
+          "$description": "Muted background"
+        }
+      },
+      "text": {
+        "primary": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.900}",
+          "$description": "Primary text"
+        },
+        "secondary": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.600}",
+          "$description": "Secondary text"
+        },
+        "muted": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.500}",
+          "$description": "Muted/disabled text"
+        },
+        "inverse": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.50}",
+          "$description": "Text on dark backgrounds"
+        }
+      },
+      "interactive": {
+        "primary": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.500}",
+          "$description": "Primary interactive (buttons, links)"
+        },
+        "primary-hover": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.600}",
+          "$description": "Primary interactive hover"
+        },
+        "primary-active": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.700}",
+          "$description": "Primary interactive active"
+        }
+      },
+      "border": {
+        "default": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.200}",
+          "$description": "Default border"
+        },
+        "strong": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.400}",
+          "$description": "Strong border"
+        }
+      },
+      "status": {
+        "error": {
+          "$type": "color",
+          "$value": "#DC2626",
+          "$description": "Error — WCAG-compliant red"
+        },
+        "success": {
+          "$type": "color",
+          "$value": "#16A34A",
+          "$description": "Success — WCAG-compliant green"
+        },
+        "warning": {
+          "$type": "color",
+          "$value": "#A16207",
+          "$description": "Warning — WCAG AA amber (4.5:1+ on white)"
+        },
+        "info": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.500}",
+          "$description": "Info status"
+        }
+      },
+      "focus": {
+        "ring": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.500}",
+          "$description": "Focus ring color"
+        }
+      },
+      "accessibility": {
+        "focus-visible": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.500}",
+          "$description": "Keyboard focus indicator"
+        }
+      }
+    },
+    "dark": {
+      "background": {
+        "canvas": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.900}",
+          "$description": "Page background — dark"
+        },
+        "surface": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.800}",
+          "$description": "Card/surface — dark"
+        },
+        "muted": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.700}",
+          "$description": "Muted background — dark"
+        }
+      },
+      "text": {
+        "primary": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.50}",
+          "$description": "Primary text — dark"
+        },
+        "secondary": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.300}",
+          "$description": "Secondary text — dark"
+        },
+        "muted": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.500}",
+          "$description": "Muted text — dark"
+        },
+        "inverse": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.900}",
+          "$description": "Text on light backgrounds — dark"
+        }
+      },
+      "interactive": {
+        "primary": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.400}",
+          "$description": "Primary interactive — dark"
+        },
+        "primary-hover": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.300}",
+          "$description": "Primary hover — dark"
+        },
+        "primary-active": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.200}",
+          "$description": "Primary active — dark"
+        }
+      },
+      "border": {
+        "default": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.700}",
+          "$description": "Default border — dark"
+        },
+        "strong": {
+          "$type": "color",
+          "$value": "{primitive.color.neutral.500}",
+          "$description": "Strong border — dark"
+        }
+      },
+      "status": {
+        "error": {
+          "$type": "color",
+          "$value": "#EF4444",
+          "$description": "Error — WCAG-compliant red (dark)"
+        },
+        "success": {
+          "$type": "color",
+          "$value": "#22C55E",
+          "$description": "Success — WCAG-compliant green (dark)"
+        },
+        "warning": {
+          "$type": "color",
+          "$value": "#EAB308",
+          "$description": "Warning — WCAG-compliant amber (dark)"
+        },
+        "info": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.400}",
+          "$description": "Info — dark"
+        }
+      },
+      "focus": {
+        "ring": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.400}",
+          "$description": "Focus ring — dark"
+        }
+      },
+      "accessibility": {
+        "focus-visible": {
+          "$type": "color",
+          "$value": "{primitive.color.gold-klimt-gold.400}",
+          "$description": "Keyboard focus — dark"
+        }
+      }
+    }
+  }
+}