@syncupsuite/themes 0.2.2 → 0.3.1

package/src/art-deco/tokens.json

@@ -0,0 +1,840 @@
+{
+  "$name": "art-deco",
+  "$description": "Art Deco — machine-age luxury and geometric glamour from the Jazz Age, where skyscrapers met Cubism",
+  "$extensions": {
+    "syncupsuite.foundation": {
+      "story": "Art Deco crystallized at the 1925 Exposition Internationale des Arts Décoratifs in Paris, then conquered New York in the Chrysler Building, Radio City Music Hall, and the Empire State Building. It fused Cubist geometry, Egyptian motifs, and machine-age optimism into a style of unapologetic luxury. Its palette of deep teal, champagne gold, and onyx black evokes speakeasy interiors, ocean liner salons, and the gleaming facades of Miami Beach.",
+      "philosophy": "Machine-age luxury — celebrating technological progress through geometric ornament and bold material contrasts",
+      "era": "1920s–1940s",
+      "harmonyMode": "complementary",
+      "radiusTendency": "none",
+      "typographyCategory": "geometric-sans"
+    }
+  },
+  "primitive": {
+    "color": {
+      "petrolio-petroleum-teal": {
+        "50": {
+          "$type": "color",
+          "$value": "#E9F8FC",
+          "$description": "Petrolio (Petroleum Teal) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#BFD8DD",
+          "$description": "Petrolio (Petroleum Teal) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#97B8C0",
+          "$description": "Petrolio (Petroleum Teal) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#6F99A3",
+          "$description": "Petrolio (Petroleum Teal) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#487B86",
+          "$description": "Petrolio (Petroleum Teal) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#1B5E6B",
+          "$description": "Petrolio (Petroleum Teal) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Petrolio (Petroleum Teal)",
+              "tradition": "The deep teal-blue of Art Deco swimming pools, Tiffany glass, and the Egyptian-revival interiors of Grauman's theatres. The signature color of the era.",
+              "source": "Art Deco Complete: The Definitive Guide, Alastair Duncan",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#074752",
+          "$description": "Petrolio (Petroleum Teal) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#00303A",
+          "$description": "Petrolio (Petroleum Teal) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#001B23",
+          "$description": "Petrolio (Petroleum Teal) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#00080F",
+          "$description": "Petrolio (Petroleum Teal) 900"
+        }
+      },
+      "champagne-dor-champagne-gold": {
+        "50": {
+          "$type": "color",
+          "$value": "#FCF5E0",
+          "$description": "Champagne Doré (Champagne Gold) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#F2E6C5",
+          "$description": "Champagne Doré (Champagne Gold) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#E7D6A9",
+          "$description": "Champagne Doré (Champagne Gold) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#DDC78D",
+          "$description": "Champagne Doré (Champagne Gold) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#D2B870",
+          "$description": "Champagne Doré (Champagne Gold) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#C8A951",
+          "$description": "Champagne Doré (Champagne Gold) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Champagne Doré (Champagne Gold)",
+              "tradition": "The metallic gold of elevator doors, lobby ceilings, and cocktail shakers. Art Deco democratized gilding through anodized metals and gold-tone lacquer.",
+              "source": "Deco Deluxe: The Art and Design of the Twenties and Thirties, Patricia Bayer",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#947A2A",
+          "$description": "Champagne Doré (Champagne Gold) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#644D00",
+          "$description": "Champagne Doré (Champagne Gold) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#372500",
+          "$description": "Champagne Doré (Champagne Gold) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#0F0300",
+          "$description": "Champagne Doré (Champagne Gold) 900"
+        }
+      },
+      "onice-onyx-black": {
+        "50": {
+          "$type": "color",
+          "$value": "#F5F5F5",
+          "$description": "Onice (Onyx Black) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#C4C4C4",
+          "$description": "Onice (Onyx Black) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#969696",
+          "$description": "Onice (Onyx Black) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#6A6A6A",
+          "$description": "Onice (Onyx Black) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#414141",
+          "$description": "Onice (Onyx Black) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#1C1C1C",
+          "$description": "Onice (Onyx Black) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Onice (Onyx Black)",
+              "tradition": "Polished black onyx and marble — used in lobby floors, bar tops, and geometric inlays. The darkness that makes gold and teal sing.",
+              "source": "American Art Deco: Architecture and Regionalism, Carla Breeze",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#161616",
+          "$description": "Onice (Onyx Black) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#101010",
+          "$description": "Onice (Onyx Black) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#0A0A0A",
+          "$description": "Onice (Onyx Black) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#060606",
+          "$description": "Onice (Onyx Black) 900"
+        }
+      },
+      "avorio-ivory": {
+        "50": {
+          "$type": "color",
+          "$value": "#F6F5F1",
+          "$description": "Avorio (Ivory) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#F6F4EE",
+          "$description": "Avorio (Ivory) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#F6F3EA",
+          "$description": "Avorio (Ivory) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#F5F2E7",
+          "$description": "Avorio (Ivory) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#F5F1E3",
+          "$description": "Avorio (Ivory) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#F5F0E0",
+          "$description": "Avorio (Ivory) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Avorio (Ivory)",
+              "tradition": "Carved elephant ivory and Bakelite cream — used for piano keys, cigarette holders, and inlay details. The warm light against dark surfaces.",
+              "source": "Art Deco: The Golden Age of Graphic Art and Illustration, Michael Robinson",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#B1AD9F",
+          "$description": "Avorio (Ivory) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#716E63",
+          "$description": "Avorio (Ivory) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#38352C",
+          "$description": "Avorio (Ivory) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#070602",
+          "$description": "Avorio (Ivory) 900"
+        }
+      },
+      "smeraldo-emerald": {
+        "50": {
+          "$type": "color",
+          "$value": "#EAFAF0",
+          "$description": "Smeraldo (Emerald) 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#C3DCCD",
+          "$description": "Smeraldo (Emerald) 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#9EBFAB",
+          "$description": "Smeraldo (Emerald) 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#78A28A",
+          "$description": "Smeraldo (Emerald) 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#54866A",
+          "$description": "Smeraldo (Emerald) 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#2D6B4C",
+          "$description": "Smeraldo (Emerald) 500",
+          "$extensions": {
+            "syncupsuite.provenance": {
+              "name": "Smeraldo (Emerald)",
+              "tradition": "Emerald green — from Colombian stones set in platinum Cartier bracelets to the green glass of Lalique vases. Nature's geometry, perfected.",
+              "source": "Cartier: Innovation Through the 20th Century, François Chaille",
+              "isSeed": true
+            }
+          }
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#195036",
+          "$description": "Smeraldo (Emerald) 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#043721",
+          "$description": "Smeraldo (Emerald) 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#00200E",
+          "$description": "Smeraldo (Emerald) 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#000A01",
+          "$description": "Smeraldo (Emerald) 900"
+        }
+      },
+      "neutral": {
+        "50": {
+          "$type": "color",
+          "$value": "#F1FAFC",
+          "$description": "Neutral 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#E7F0F2",
+          "$description": "Neutral 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#D7E0E2",
+          "$description": "Neutral 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#BDC6C8",
+          "$description": "Neutral 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#929A9C",
+          "$description": "Neutral 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#687072",
+          "$description": "Neutral 500"
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#474F50",
+          "$description": "Neutral 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#2D3436",
+          "$description": "Neutral 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#151C1D",
+          "$description": "Neutral 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#040809",
+          "$description": "Neutral 900"
+        }
+      },
+      "accent": {
+        "50": {
+          "$type": "color",
+          "$value": "#FFF0EB",
+          "$description": "Accent 50"
+        },
+        "100": {
+          "$type": "color",
+          "$value": "#E6C5BE",
+          "$description": "Accent 100"
+        },
+        "200": {
+          "$type": "color",
+          "$value": "#C79C92",
+          "$description": "Accent 200"
+        },
+        "300": {
+          "$type": "color",
+          "$value": "#A87469",
+          "$description": "Accent 300"
+        },
+        "400": {
+          "$type": "color",
+          "$value": "#894E41",
+          "$description": "Accent 400"
+        },
+        "500": {
+          "$type": "color",
+          "$value": "#6A281B",
+          "$description": "Accent 500"
+        },
+        "600": {
+          "$type": "color",
+          "$value": "#541A0F",
+          "$description": "Accent 600"
+        },
+        "700": {
+          "$type": "color",
+          "$value": "#3E0D05",
+          "$description": "Accent 700"
+        },
+        "800": {
+          "$type": "color",
+          "$value": "#2A0200",
+          "$description": "Accent 800"
+        },
+        "900": {
+          "$type": "color",
+          "$value": "#160000",
+          "$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": "0px",
+        "$description": "Border radius sm"
+      },
+      "md": {
+        "$type": "dimension",
+        "$value": "0px",
+        "$description": "Border radius md"
+      },
+      "lg": {
+        "$type": "dimension",
+        "$value": "0px",
+        "$description": "Border radius lg"
+      },
+      "xl": {
+        "$type": "dimension",
+        "$value": "0px",
+        "$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.petrolio-petroleum-teal.500}",
+          "$description": "Primary interactive (buttons, links)"
+        },
+        "primary-hover": {
+          "$type": "color",
+          "$value": "{primitive.color.petrolio-petroleum-teal.600}",
+          "$description": "Primary interactive hover"
+        },
+        "primary-active": {
+          "$type": "color",
+          "$value": "{primitive.color.petrolio-petroleum-teal.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.petrolio-petroleum-teal.500}",
+          "$description": "Info status"
+        }
+      },
+      "focus": {
+        "ring": {
+          "$type": "color",
+          "$value": "{primitive.color.petrolio-petroleum-teal.500}",
+          "$description": "Focus ring color"
+        }
+      },
+      "accessibility": {
+        "focus-visible": {
+          "$type": "color",
+          "$value": "{primitive.color.petrolio-petroleum-teal.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.petrolio-petroleum-teal.400}",
+          "$description": "Primary interactive — dark"
+        },
+        "primary-hover": {
+          "$type": "color",
+          "$value": "{primitive.color.petrolio-petroleum-teal.300}",
+          "$description": "Primary hover — dark"
+        },
+        "primary-active": {
+          "$type": "color",
+          "$value": "{primitive.color.petrolio-petroleum-teal.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.petrolio-petroleum-teal.400}",
+          "$description": "Info — dark"
+        }
+      },
+      "focus": {
+        "ring": {
+          "$type": "color",
+          "$value": "{primitive.color.petrolio-petroleum-teal.400}",
+          "$description": "Focus ring — dark"
+        }
+      },
+      "accessibility": {
+        "focus-visible": {
+          "$type": "color",
+          "$value": "{primitive.color.petrolio-petroleum-teal.400}",
+          "$description": "Keyboard focus — dark"
+        }
+      }
+    }
+  }
+}