69 lines
3.9 KiB
JSON
69 lines
3.9 KiB
JSON
|
{
|
||
|
|
"sumi": {
|
||
|
|
"_comment": "Semantic tokens — light theme ([data-theme=\"light\"]). Washi paper aesthetic.",
|
||
|
|
"bg": {
|
||
|
|
"void": { "$value": "{color.washi.shiro}", "$type": "color" },
|
||
|
|
"base": { "$value": "{color.washi.shiro}", "$type": "color" },
|
||
|
|
"raised": { "$value": "{color.washi.shiro}", "$type": "color" },
|
||
|
|
"overlay": { "$value": "{color.washi.kinari}", "$type": "color" },
|
||
|
|
"hover": { "$value": "{color.washi.kinari}", "$type": "color" },
|
||
|
|
"active": { "$value": "{color.washi.kinu}", "$type": "color" },
|
||
|
|
"wash": { "$value": "{color.washi.kinari}", "$type": "color" }
|
||
|
|
},
|
||
|
|
"surface": {
|
||
|
|
"inset": { "$value": "{color.washi.kinari}", "$type": "color" },
|
||
|
|
"subtle": { "$value": "{color.washi.shiro}", "$type": "color" },
|
||
|
|
"card": { "$value": "{color.washi.shiro}", "$type": "color" },
|
||
|
|
"elevated": { "$value": "{color.washi.shiro}", "$type": "color" }
|
||
|
|
},
|
||
|
|
"border": {
|
||
|
|
"faint": { "$value": "{color.alpha.ink-04}", "$type": "color" },
|
||
|
|
"default": { "$value": "{color.alpha.ink-06}", "$type": "color" },
|
||
|
|
"strong": { "$value": "{color.alpha.ink-12}", "$type": "color" },
|
||
|
|
"focus": { "$value": "{color.mizu.focus}", "$type": "color" },
|
||
|
|
"accent": { "$value": "{color.mizu.border}", "$type": "color" }
|
||
|
|
},
|
||
|
|
"text": {
|
||
|
|
"primary": { "$value": "{color.ink.sumi}", "$type": "color" },
|
||
|
|
"secondary": { "$value": "{color.ink.gin}", "$type": "color" },
|
||
|
|
"tertiary": { "$value": "{color.ink.hai}", "$type": "color" },
|
||
|
|
"disabled": { "$value": "{color.ink.kasumi}", "$type": "color" },
|
||
|
|
"inverse": { "$value": "{color.washi.kinari}", "$type": "color" },
|
||
|
|
"link": { "$value": "{color.mizu.deep}", "$type": "color", "$description": "Cyan profond pour AA en mode jour" }
|
||
|
|
},
|
||
|
|
"accent": {
|
||
|
|
"default": { "$value": "{color.mizu.base}", "$type": "color" },
|
||
|
|
"hover": { "$value": "{color.mizu.active}", "$type": "color" },
|
||
|
|
"active": { "$value": "{color.mizu.deep}", "$type": "color" },
|
||
|
|
"muted": { "$value": "{color.mizu.muted}", "$type": "color" },
|
||
|
|
"subtle": { "$value": "{color.mizu.subtle}", "$type": "color" },
|
||
|
|
"emphasis": { "$value": "{color.mizu.deep}", "$type": "color" }
|
||
|
|
},
|
||
|
|
"viz": {
|
||
|
|
"indigo": { "$value": "{color.viz.indigo}", "$type": "color" },
|
||
|
|
"vermillion": { "$value": "{color.viz.vermillion}", "$type": "color" },
|
||
|
|
"sage": { "$value": "{color.viz.sage}", "$type": "color" },
|
||
|
|
"gold": { "$value": "{color.viz.gold}", "$type": "color" },
|
||
|
|
"neutral": { "$value": "{color.viz.neutral}", "$type": "color" }
|
||
|
|
},
|
||
|
|
"feedback": {
|
||
|
|
"success": { "$value": "{color.functional.sage-diluted}", "$type": "color" },
|
||
|
|
"success-hover": { "$value": "{color.functional.sage-hover}", "$type": "color" },
|
||
|
|
"success-subtle": { "$value": "{color.functional.sage-subtle}", "$type": "color" },
|
||
|
|
"error": { "$value": "{color.functional.brick-diluted}", "$type": "color" },
|
||
|
|
"error-hover": { "$value": "{color.functional.brick-hover}", "$type": "color" },
|
||
|
|
"error-subtle": { "$value": "{color.functional.brick-subtle}", "$type": "color" },
|
||
|
|
"warning": { "$value": "{color.functional.amber-diluted}", "$type": "color" },
|
||
|
|
"warning-hover": { "$value": "{color.functional.amber-hover}", "$type": "color" },
|
||
|
|
"warning-subtle": { "$value": "{color.functional.amber-subtle}", "$type": "color" },
|
||
|
|
"info": { "$value": "{color.mizu.base}", "$type": "color" }
|
||
|
|
},
|
||
|
|
"kin": {
|
||
|
|
"base": { "$value": "{color.kin.base}", "$type": "color" },
|
||
|
|
"hover": { "$value": "{color.kin.hover}", "$type": "color" },
|
||
|
|
"subtle": { "$value": "{color.kin.subtle}", "$type": "color" },
|
||
|
|
"glow": { "$value": "{shadow.kin}", "$type": "shadow" }
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|