@dataimago/tokens 0.1.0-alpha.3 → 0.1.0-alpha.30

package/dist/tokens.studio.json

@@ -0,0 +1,751 @@
+{
+  "global": {
+    "color": {
+      "surface": {
+        "page": {
+          "value": "#ededeb",
+          "type": "color"
+        },
+        "page-scrolled": {
+          "value": "#ededeb",
+          "type": "color"
+        },
+        "elevated": {
+          "value": "#f7f7f6",
+          "type": "color"
+        },
+        "figure-plate": {
+          "value": "#f7f7f6",
+          "type": "color"
+        },
+        "sunken": {
+          "value": "#f7f7f6",
+          "type": "color"
+        },
+        "navbar": {
+          "value": "#ededeb",
+          "type": "color"
+        },
+        "navbar-scrolled": {
+          "value": "#ededeb",
+          "type": "color"
+        },
+        "code": {
+          "value": "#f7f7f6",
+          "type": "color"
+        }
+      },
+      "border": {
+        "subtle": {
+          "value": "rgba(12, 10, 9, 0.45)",
+          "type": "color"
+        },
+        "moderate": {
+          "value": "rgba(12, 10, 9, 0.60)",
+          "type": "color"
+        },
+        "strong": {
+          "value": "rgba(12, 10, 9, 0.75)",
+          "type": "color"
+        },
+        "card": {
+          "value": "rgba(12, 10, 9, 0.60)",
+          "type": "color"
+        },
+        "figure-frame": {
+          "value": "#6a6a6a",
+          "type": "color"
+        },
+        "code": {
+          "value": "#d6d3d1",
+          "type": "color"
+        }
+      },
+      "content": {
+        "primary": {
+          "value": "#14140f",
+          "type": "color"
+        },
+        "secondary": {
+          "value": "#6a6a6a",
+          "type": "color"
+        },
+        "muted": {
+          "value": "#706964",
+          "type": "color"
+        },
+        "inverse": {
+          "value": "#fdf9f2",
+          "type": "color"
+        }
+      },
+      "interactive": {
+        "primary": {
+          "value": "#434739",
+          "type": "color"
+        },
+        "hover": {
+          "value": "#363a2e",
+          "type": "color"
+        },
+        "accent": {
+          "value": "#1f618d",
+          "type": "color"
+        },
+        "focus": {
+          "value": "#434739",
+          "type": "color"
+        }
+      },
+      "state": {
+        "success": {
+          "value": "#007a58",
+          "type": "color"
+        },
+        "warning": {
+          "value": "#906306",
+          "type": "color"
+        },
+        "error": {
+          "value": "#a4262c",
+          "type": "color"
+        },
+        "info": {
+          "value": "#1f618d",
+          "type": "color"
+        }
+      },
+      "presentation": {
+        "accent": {
+          "value": "#3498DB",
+          "type": "color"
+        },
+        "accent-hover": {
+          "value": "#2980B9",
+          "type": "color"
+        }
+      },
+      "vertical-accent": {
+        "$comment": {
+          "value": "Per-vertical brand accents — each Level-2 property's identity color, distinct from the house interactive.accent (the L1 sky-blue hub color). Mode-aware (light/dark stops) like interactive.accent. Used for app icons, navbar-logo emphasis, and per-vertical theming. Contrast vs surface.page verified WCAG: light values are the on-light marks, dark values the on-dark marks. dataimago (L1 hub) intentionally has no vertical accent — it uses interactive.accent + ink.",
+          "type": "other"
+        },
+        "dissertation": {
+          "value": "#B87333",
+          "type": "color"
+        },
+        "rpkg": {
+          "value": "#3B82F6",
+          "type": "color"
+        },
+        "SGPc": {
+          "value": "#5A6310",
+          "type": "color"
+        }
+      },
+      "brand-mark": {
+        "$comment": {
+          "value": "Brand-MARK colors (the dataimago monogram / wordmark logo treatment) — distinct from the interactive.accent role. The signature monogram red is a wide-gamut PILOT (see wiki/decisions/p3-oklch-color.md). It is mode-aware for AA-normal headroom: a single red cannot clear 4.5:1 on BOTH the light page (#ededeb) and ink-900 — light needs a deep red, dark needs a bright one. LIGHT uses the deepened #cc0000 (faithful P3, contrast-first); DARK keeps the vivid display-P3 primary red (#ff0000 fallback → color(display-p3 1 0 0)), where #ff0000 already passes AA-normal. Vivid override authored in tools/color-converter.mjs (dark-only for the red), emitted as a `#hex → color(display-p3 …)` cascade in the -p3 build.",
+          "type": "other"
+        },
+        "red": {
+          "value": "#cc0000",
+          "type": "color"
+        }
+      },
+      "dataviz": {
+        "okabe-ito": {
+          "orange": {
+            "value": "#E69F00",
+            "type": "color"
+          },
+          "sky-blue": {
+            "value": "#56B4E9",
+            "type": "color"
+          },
+          "bluish-green": {
+            "value": "#009E73",
+            "type": "color"
+          },
+          "yellow": {
+            "value": "#F0E442",
+            "type": "color"
+          },
+          "blue": {
+            "value": "#0072B2",
+            "type": "color"
+          },
+          "vermillion": {
+            "value": "#D55E00",
+            "type": "color"
+          },
+          "reddish-purple": {
+            "value": "#CC79A7",
+            "type": "color"
+          },
+          "black": {
+            "value": "#000000",
+            "type": "color"
+          }
+        },
+        "categorical": {
+          "1": {
+            "value": "#E69F00",
+            "type": "color"
+          },
+          "2": {
+            "value": "#56B4E9",
+            "type": "color"
+          },
+          "3": {
+            "value": "#009E73",
+            "type": "color"
+          },
+          "4": {
+            "value": "#F0E442",
+            "type": "color"
+          },
+          "5": {
+            "value": "#0072B2",
+            "type": "color"
+          },
+          "6": {
+            "value": "#D55E00",
+            "type": "color"
+          },
+          "7": {
+            "value": "#CC79A7",
+            "type": "color"
+          },
+          "8": {
+            "value": "#000000",
+            "type": "color"
+          }
+        },
+        "uncertainty": {
+          "outer": {
+            "value": "#D6D6D6",
+            "type": "color"
+          },
+          "union": {
+            "value": "#9E9E9E",
+            "type": "color"
+          },
+          "inner": {
+            "value": "#333333",
+            "type": "color"
+          }
+        },
+        "sgpc-bucket": {
+          "very-low": {
+            "value": "#D55E00",
+            "type": "color"
+          },
+          "low": {
+            "value": "#E69F00",
+            "type": "color"
+          },
+          "typical": {
+            "value": "#56B4E9",
+            "type": "color"
+          },
+          "high": {
+            "value": "#009E73",
+            "type": "color"
+          },
+          "very-high": {
+            "value": "#0072B2",
+            "type": "color"
+          }
+        }
+      }
+    },
+    "shadow": {
+      "sm": {
+        "value": "0 1px 2px 0 rgb(0 0 0 / 0.05)",
+        "type": "other"
+      },
+      "md": {
+        "value": "0 4px 6px -1px rgb(0 0 0 / 0.1)",
+        "type": "other"
+      },
+      "lg": {
+        "value": "0 10px 15px -3px rgb(0 0 0 / 0.1)",
+        "type": "other"
+      },
+      "xl": {
+        "value": "0 20px 25px -5px rgb(0 0 0 / 0.1)",
+        "type": "other"
+      }
+    },
+    "border": {
+      "subtle": {
+        "value": "rgba(20, 20, 16, 0.47)",
+        "type": "color"
+      },
+      "moderate": {
+        "value": "rgba(20, 20, 16, 0.63)",
+        "type": "color"
+      },
+      "focus": {
+        "value": "#3498DB",
+        "type": "color"
+      }
+    },
+    "transition": {
+      "quick": {
+        "value": "0.15s ease",
+        "type": "duration"
+      },
+      "standard": {
+        "value": "0.25s ease-in-out",
+        "type": "duration"
+      },
+      "smooth": {
+        "value": "0.35s ease",
+        "type": "duration"
+      },
+      "logo": {
+        "value": "0.3s",
+        "type": "duration"
+      }
+    },
+    "font": {
+      "family": {
+        "sans": {
+          "value": "Noto Sans, Noto Sans Math, system-ui, sans-serif",
+          "type": "other"
+        },
+        "mono": {
+          "value": "Noto Sans Mono, SF Mono, Monaco, Inconsolata, monospace",
+          "type": "other"
+        },
+        "display": {
+          "value": "var(--font-family-display-editorial)",
+          "type": "other"
+        },
+        "display-editorial": {
+          "value": "Josefin Sans, Noto Sans, Noto Sans Math, system-ui, sans-serif",
+          "type": "other"
+        },
+        "display-documentation": {
+          "value": "Noto Sans, Noto Sans Math, system-ui, sans-serif",
+          "type": "other"
+        },
+        "brand": {
+          "value": "Futura, system-ui, sans-serif",
+          "type": "other"
+        },
+        "math": {
+          "value": "Noto Sans Math, math",
+          "type": "other"
+        }
+      },
+      "size": {
+        "micro": {
+          "value": "0.75rem",
+          "type": "dimension"
+        },
+        "small": {
+          "value": "0.875rem",
+          "type": "dimension"
+        },
+        "base": {
+          "value": "1rem",
+          "type": "dimension"
+        },
+        "readable": {
+          "value": "1.125rem",
+          "type": "dimension"
+        },
+        "emphasis": {
+          "value": "1.25rem",
+          "type": "dimension"
+        },
+        "heading-small": {
+          "value": "1.5rem",
+          "type": "dimension"
+        },
+        "heading-medium": {
+          "value": "1.875rem",
+          "type": "dimension"
+        },
+        "heading-large": {
+          "value": "2.25rem",
+          "type": "dimension"
+        },
+        "heading-xl": {
+          "value": "3rem",
+          "type": "dimension"
+        }
+      },
+      "weight": {
+        "extralight": {
+          "value": "200",
+          "type": "number"
+        },
+        "light": {
+          "value": "300",
+          "type": "number"
+        },
+        "normal": {
+          "value": "400",
+          "type": "number"
+        },
+        "medium": {
+          "value": "500",
+          "type": "number"
+        },
+        "semibold": {
+          "value": "600",
+          "type": "number"
+        },
+        "bold": {
+          "value": "700",
+          "type": "number"
+        },
+        "heading": {
+          "_invariant": {
+            "value": "Heading-weight cluster — 400 floor for all Josefin Sans headings (see wiki/decisions/josefin-weight-floor.md). Sub-400 weights (200, 300) are bound to the opt-in .di-numeric-display utility class, never the default for prose-tier headings. Per wiki/decisions/h1-weight-medium.md the prose-correct band for editorial headings is 400–500.",
+            "type": "other"
+          },
+          "h1": {
+            "value": "var(--font-weight-medium)",
+            "type": "other"
+          },
+          "h2": {
+            "value": "var(--font-weight-medium)",
+            "type": "other"
+          },
+          "h3": {
+            "value": "var(--font-weight-normal)",
+            "type": "other"
+          },
+          "h4": {
+            "value": "var(--font-weight-light)",
+            "type": "other"
+          },
+          "h5": {
+            "value": "var(--font-weight-light)",
+            "type": "other"
+          },
+          "h6": {
+            "value": "var(--font-weight-light)",
+            "type": "other"
+          },
+          "subtitle": {
+            "value": "var(--font-weight-semibold)",
+            "type": "other"
+          }
+        }
+      },
+      "style": {
+        "normal": {
+          "value": "normal",
+          "type": "other"
+        },
+        "italic": {
+          "value": "italic",
+          "type": "other"
+        },
+        "oblique": {
+          "value": "oblique",
+          "type": "other"
+        }
+      },
+      "lineHeight": {
+        "tight": {
+          "value": "1.25",
+          "type": "number"
+        },
+        "normal": {
+          "value": "1.5",
+          "type": "number"
+        },
+        "relaxed": {
+          "value": "1.625",
+          "type": "number"
+        }
+      },
+      "feature-settings": {
+        "_invariant": {
+          "value": "OpenType feature settings cluster — display rules apply lining figures (lnum) so numerals render uniform-baseline at heading scale; body rules retain old-style figures where they belong (in-line numerical mentions in prose). See wiki/decisions/display-lining-figures.md.",
+          "type": "other"
+        },
+        "display": {
+          "value": "\"lnum\"",
+          "type": "other"
+        },
+        "body": {
+          "value": "\"normal\"",
+          "type": "other"
+        }
+      }
+    },
+    "spacing": {
+      "xs": {
+        "value": "0.25rem",
+        "type": "dimension"
+      },
+      "sm": {
+        "value": "0.5rem",
+        "type": "dimension"
+      },
+      "md": {
+        "value": "1rem",
+        "type": "dimension"
+      },
+      "lg": {
+        "value": "1.5rem",
+        "type": "dimension"
+      },
+      "xl": {
+        "value": "2rem",
+        "type": "dimension"
+      },
+      "2xl": {
+        "value": "3rem",
+        "type": "dimension"
+      },
+      "3xl": {
+        "value": "4rem",
+        "type": "dimension"
+      }
+    },
+    "radius": {
+      "sm": {
+        "value": "0.25rem",
+        "type": "dimension"
+      },
+      "md": {
+        "value": "0.5rem",
+        "type": "dimension"
+      },
+      "lg": {
+        "value": "0.75rem",
+        "type": "dimension"
+      },
+      "xl": {
+        "value": "1rem",
+        "type": "dimension"
+      },
+      "full": {
+        "value": "9999px",
+        "type": "dimension"
+      }
+    }
+  },
+  "dark": {
+    "color": {
+      "surface": {
+        "page": {
+          "value": "#141410",
+          "type": "color"
+        },
+        "page-scrolled": {
+          "value": "#141410",
+          "type": "color"
+        },
+        "elevated": {
+          "value": "#1c1917",
+          "type": "color"
+        },
+        "figure-plate": {
+          "value": "#dcdcda",
+          "type": "color"
+        },
+        "sunken": {
+          "value": "#0c0a09",
+          "type": "color"
+        },
+        "navbar": {
+          "value": "#141410",
+          "type": "color"
+        },
+        "navbar-scrolled": {
+          "value": "#141410",
+          "type": "color"
+        },
+        "code": {
+          "value": "#1c1917",
+          "type": "color"
+        }
+      },
+      "border": {
+        "subtle": {
+          "value": "rgba(253, 249, 242, 0.45)",
+          "type": "color"
+        },
+        "moderate": {
+          "value": "rgba(253, 249, 242, 0.60)",
+          "type": "color"
+        },
+        "strong": {
+          "value": "rgba(253, 249, 242, 0.75)",
+          "type": "color"
+        },
+        "card": {
+          "value": "rgba(253, 249, 242, 0.60)",
+          "type": "color"
+        },
+        "figure-frame": {
+          "value": "#6a6a6a",
+          "type": "color"
+        },
+        "code": {
+          "value": "#292524",
+          "type": "color"
+        }
+      },
+      "content": {
+        "primary": {
+          "value": "#fdf9f2",
+          "type": "color"
+        },
+        "secondary": {
+          "value": "#a8a29e",
+          "type": "color"
+        },
+        "muted": {
+          "value": "#89827d",
+          "type": "color"
+        },
+        "inverse": {
+          "value": "#0c0a09",
+          "type": "color"
+        }
+      },
+      "interactive": {
+        "primary": {
+          "value": "#98a384",
+          "type": "color"
+        },
+        "hover": {
+          "value": "#7e8a6b",
+          "type": "color"
+        },
+        "accent": {
+          "value": "#3498DB",
+          "type": "color"
+        },
+        "focus": {
+          "value": "#98a384",
+          "type": "color"
+        }
+      },
+      "state": {
+        "success": {
+          "value": "#009E73",
+          "type": "color"
+        },
+        "warning": {
+          "value": "#E69F00",
+          "type": "color"
+        },
+        "error": {
+          "value": "#ef5350",
+          "type": "color"
+        },
+        "info": {
+          "value": "#3498DB",
+          "type": "color"
+        }
+      },
+      "presentation": {
+        "accent": {
+          "value": "#3498DB",
+          "type": "color"
+        },
+        "accent-hover": {
+          "value": "#2980B9",
+          "type": "color"
+        }
+      },
+      "vertical-accent": {
+        "dissertation": {
+          "value": "#CE8E5C",
+          "type": "color"
+        },
+        "rpkg": {
+          "value": "#60A5FA",
+          "type": "color"
+        },
+        "SGPc": {
+          "value": "#B2BF22",
+          "type": "color"
+        }
+      },
+      "brand-mark": {
+        "red": {
+          "value": "#ff0000",
+          "type": "color"
+        }
+      },
+      "dataviz": {
+        "okabe-ito": {
+          "black": {
+            "value": "#FDF9F2",
+            "type": "color"
+          }
+        },
+        "categorical": {
+          "8": {
+            "value": "#FDF9F2",
+            "type": "color"
+          }
+        },
+        "uncertainty": {
+          "outer": {
+            "value": "#333333",
+            "type": "color"
+          },
+          "union": {
+            "value": "#6B6B6B",
+            "type": "color"
+          },
+          "inner": {
+            "value": "#D6D6D6",
+            "type": "color"
+          }
+        }
+      }
+    },
+    "border": {
+      "subtle": {
+        "value": "rgba(237, 237, 235, 0.47)",
+        "type": "color"
+      },
+      "moderate": {
+        "value": "rgba(237, 237, 235, 0.63)",
+        "type": "color"
+      },
+      "focus": {
+        "value": "#4FC3F7",
+        "type": "color"
+      }
+    }
+  },
+  "$themes": [
+    {
+      "id": "light",
+      "name": "Light",
+      "selectedTokenSets": {
+        "global": "enabled"
+      }
+    },
+    {
+      "id": "dark",
+      "name": "Dark",
+      "selectedTokenSets": {
+        "global": "enabled",
+        "dark": "enabled"
+      }
+    }
+  ],
+  "$metadata": {
+    "tokenSetOrder": [
+      "global",
+      "dark"
+    ]
+  }
+}