171 lines
4.5 KiB
JSON
171 lines
4.5 KiB
JSON
{
|
|
"schemaVersion": "1.0.0",
|
|
"id": "moku-default",
|
|
"name": "Moku Default",
|
|
"description": "Baseline Moku shell tokens for built-in light and dark modes.",
|
|
"tokens": {
|
|
"shared": {
|
|
"palette": {
|
|
"gray": {
|
|
"0": "hsl(210 20% 99%)",
|
|
"50": "hsl(220 20% 97%)",
|
|
"100": "hsl(220 16% 93%)",
|
|
"200": "hsl(220 13% 87%)",
|
|
"300": "hsl(220 11% 75%)",
|
|
"400": "hsl(220 9% 58%)",
|
|
"500": "hsl(220 10% 45%)",
|
|
"600": "hsl(220 14% 34%)",
|
|
"700": "hsl(220 18% 24%)",
|
|
"800": "hsl(220 22% 16%)",
|
|
"900": "hsl(220 28% 10%)"
|
|
},
|
|
"blue": {
|
|
"400": "hsl(218 88% 61%)",
|
|
"500": "hsl(221 83% 53%)",
|
|
"600": "hsl(224 76% 48%)"
|
|
},
|
|
"green": {
|
|
"500": "hsl(154 60% 40%)"
|
|
},
|
|
"red": {
|
|
"500": "hsl(0 72% 54%)"
|
|
},
|
|
"amber": {
|
|
"500": "hsl(36 100% 50%)"
|
|
}
|
|
},
|
|
"space": {
|
|
"1": "0.25rem",
|
|
"2": "0.5rem",
|
|
"3": "0.75rem",
|
|
"4": "1rem",
|
|
"5": "1.25rem",
|
|
"6": "1.5rem",
|
|
"8": "2rem",
|
|
"10": "2.5rem",
|
|
"12": "3rem"
|
|
},
|
|
"radius": {
|
|
"sm": "0.375rem",
|
|
"md": "0.625rem",
|
|
"lg": "0.875rem",
|
|
"xl": "1.25rem",
|
|
"pill": "999px"
|
|
},
|
|
"size": {
|
|
"controlMd": "2.25rem",
|
|
"controlLg": "2.5rem",
|
|
"contentWidthWide": "72rem",
|
|
"blurOverlay": "18px"
|
|
},
|
|
"shadow": {
|
|
"soft": "0 12px 32px hsl(220 30% 10% / 0.08)",
|
|
"strong": "0 20px 48px hsl(220 30% 10% / 0.16)"
|
|
},
|
|
"zIndex": {
|
|
"base": "1",
|
|
"dropdown": "100",
|
|
"sticky": "200",
|
|
"overlay": "400",
|
|
"modal": "500",
|
|
"toast": "600"
|
|
},
|
|
"motion": {
|
|
"durationFast": "140ms",
|
|
"durationBase": "220ms",
|
|
"durationSlow": "320ms",
|
|
"easeStandard": "cubic-bezier(0.2, 0.8, 0.2, 1)"
|
|
},
|
|
"typography": {
|
|
"fontFamily": {
|
|
"sans": "ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
|
|
"heading": "\"Avenir Next\", \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
|
|
"display": "\"Avenir Next\", \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif",
|
|
"serif": "ui-serif, Georgia, Cambria, \"Times New Roman\", Times, serif",
|
|
"mono": "ui-monospace, \"SF Mono\", \"SFMono-Regular\", Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace"
|
|
},
|
|
"fontSize": {
|
|
"caption": "0.75rem",
|
|
"label": "0.875rem",
|
|
"body": "1rem",
|
|
"title": "clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem)",
|
|
"heading": "clamp(1.5rem, 1.2rem + 1vw, 2.125rem)",
|
|
"display": "clamp(2.25rem, 1.7rem + 2.2vw, 3.75rem)"
|
|
},
|
|
"lineHeight": {
|
|
"caption": "1.4",
|
|
"label": "1.35",
|
|
"body": "1.55",
|
|
"title": "1.3",
|
|
"heading": "1.15",
|
|
"display": "1.05"
|
|
},
|
|
"fontWeight": {
|
|
"caption": "500",
|
|
"label": "600",
|
|
"body": "400",
|
|
"title": "600",
|
|
"heading": "600",
|
|
"display": "700"
|
|
},
|
|
"letterSpacing": {
|
|
"caption": "0.01em",
|
|
"label": "0.005em",
|
|
"body": "0",
|
|
"title": "-0.01em",
|
|
"heading": "-0.02em",
|
|
"display": "-0.03em"
|
|
}
|
|
}
|
|
},
|
|
"modes": {
|
|
"light": {
|
|
"colorScheme": "light",
|
|
"colors": {
|
|
"canvas": "var(--gray-50)",
|
|
"surface": "hsl(0 0% 100% / 0.9)",
|
|
"surfaceMuted": "var(--gray-0)",
|
|
"surfaceHover": "var(--gray-100)",
|
|
"border": "hsl(220 15% 85% / 0.9)",
|
|
"borderStrong": "hsl(220 12% 70% / 0.9)",
|
|
"text": "var(--gray-800)",
|
|
"textMuted": "var(--gray-500)",
|
|
"accent": "var(--blue-500)",
|
|
"accentStrong": "var(--blue-600)",
|
|
"accentSoft": "hsl(218 88% 61% / 0.12)",
|
|
"accentContrast": "hsl(0 0% 100%)",
|
|
"success": "var(--green-500)",
|
|
"danger": "var(--red-500)",
|
|
"warning": "var(--amber-500)",
|
|
"focusRing": "hsl(221 83% 53% / 0.55)"
|
|
}
|
|
},
|
|
"dark": {
|
|
"colorScheme": "dark",
|
|
"colors": {
|
|
"canvas": "var(--gray-900)",
|
|
"surface": "hsl(220 23% 14% / 0.92)",
|
|
"surfaceMuted": "hsl(220 22% 12% / 0.96)",
|
|
"surfaceHover": "hsl(220 18% 20% / 0.96)",
|
|
"border": "hsl(220 12% 26% / 0.9)",
|
|
"borderStrong": "hsl(220 12% 38% / 0.9)",
|
|
"text": "hsl(210 20% 96%)",
|
|
"textMuted": "hsl(220 12% 70%)",
|
|
"accent": "hsl(217 91% 67%)",
|
|
"accentStrong": "hsl(218 88% 61%)",
|
|
"accentSoft": "hsl(217 91% 67% / 0.18)",
|
|
"accentContrast": "hsl(220 28% 10%)",
|
|
"success": "hsl(154 55% 48%)",
|
|
"danger": "hsl(0 72% 62%)",
|
|
"warning": "hsl(36 100% 60%)",
|
|
"focusRing": "hsl(217 91% 67% / 0.65)"
|
|
},
|
|
"shadow": {
|
|
"soft": "0 16px 40px hsl(220 40% 3% / 0.45)",
|
|
"strong": "0 24px 60px hsl(220 40% 3% / 0.55)"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|