Source code
Revision control
Copy as Markdown
Other Tools
{
"background/color/box": {
"light": "{Colors$color/white}",
"dark": "{Colors$color/neutral/70}",
"forcedColors": "{Theme$background/color/canvas}"
},
"background/color/box/info": {
"light": "{Colors$color/neutral/20}",
"dark": "{Colors$color/neutral/80}",
"forcedColors": "{Theme$background/color/canvas}"
},
"background/color/canvas": {
"light": "{Colors$color/violet-desaturated/0}",
"dark": "{Colors$color/neutral/90}",
"forcedColors": "{HCM Theme$Canvas}"
},
"background/color/critical": {
"light": "{Colors$color/red/0}",
"dark": "{Colors$color/red/80}",
"forcedColors": "{Theme$background/color/canvas}"
},
"background/color/information": {
"light": "{Colors$color/blue/0}",
"dark": "{Colors$color/blue/80}",
"forcedColors": "{Theme$background/color/canvas}"
},
"background/color/success": {
"light": "{Colors$color/green/0}",
"dark": "{Colors$color/green/80}",
"forcedColors": "{Theme$background/color/canvas}"
},
"background/color/warning": {
"light": "{Colors$color/yellow/0}",
"dark": "{Colors$color/yellow/80}",
"forcedColors": "{Theme$background/color/canvas}"
},
"border/color": {
"light": "{Colors$color/neutral/20}",
"dark": "{Colors$color/neutral/50}",
"forcedColors": "{HCM Theme$CanvasText}"
},
"border/color/transparent": {
"light": "transparent",
"dark": "transparent",
"forcedColors": "{HCM Theme$CanvasText}"
},
"border/color/deemphasized": {
"light": "{Colors$color/neutral/30}",
"dark": "{Colors$color/neutral/70}",
"forcedColors": "{HCM Theme$ButtonText}"
},
"border/color/interactive": {
"light": "{Colors$color/neutral/30}",
"dark": "{Colors$color/neutral/50}",
"forcedColors": "{HCM Theme$ButtonText}"
},
"color/accent/primary": {
"light": "{Colors$color/violet/50}",
"dark": "{Colors$color/violet/30}",
"forcedColors": "{HCM Theme$AccentColor}"
},
"color/accent/primary/hover": {
"light": "{Colors$color/violet/60}",
"dark": "{Colors$color/violet/40}",
"forcedColors": "{HCM Theme$SelectedItem}"
},
"color/accent/primary/active": {
"light": "{Colors$color/violet/70}",
"dark": "{Colors$color/violet/50}",
"forcedColors": "{Theme$color/accent/primary/hover}"
},
"color/accent/primary/selected": {
"light": "{Colors$color/violet/50}",
"dark": "{Colors$color/violet/30}",
"forcedColors": "{HCM Theme$SelectedItem}"
},
"color/accent/attention": {
"light": "{Colors$color/green/40}",
"dark": "{Colors$color/green/30}",
"forcedColors": "{HCM Theme$AccentColor}"
},
"text/color": {
"light": "{Colors$color/violet-desaturated/90}",
"dark": "{Colors$color/violet-desaturated/0}",
"forcedColors": "{HCM Theme$CanvasText}"
},
"text/color/deemphasized": {
"light": "rgba(20, 9, 43, 0.7)",
"dark": "rgba(242, 240, 248, 0.7)",
"forcedColors": "{HCM Theme$CanvasText}"
},
"text/color/disabled": {
"light": "rgba(21, 20, 26, 0.4)",
"dark": "rgba(251, 251, 254, 0.4)",
"forcedColors": "{HCM Theme$GrayText}"
},
"text/color/error": {
"light": "{Colors$color/red/50}",
"dark": "{Colors$color/red/20}",
"forcedColors": "{HCM Theme$CanvasText}"
},
"text/color/accent/primary/selected": {
"light": "{Colors$color/white}",
"dark": "{Colors$color/neutral/90}",
"forcedColors": "{HCM Theme$SelectedItemText}"
},
"badge/border/color": {
"light": "rgba(21, 20, 26, 0.4)",
"dark": "rgba(251, 251, 254, 0.4)",
"forcedColors": "{HCM Theme$CanvasText}"
},
"button/background/color": {
"light": "transparent",
"dark": "transparent",
"forcedColors": "{HCM Theme$ButtonFace}"
},
"button/background/color/hover": {
"light": "{Colors$color/purple-desaturated/10}",
"dark": "{Colors$color/purple-desaturated/60}",
"forcedColors": "{HCM Theme$SelectedItemText}"
},
"button/background/color/active": {
"light": "{Colors$color/purple-desaturated/20}",
"dark": "{Colors$color/purple-desaturated/50}",
"forcedColors": "{HCM Theme$SelectedItemText}"
},
"button/background/color/primary/hover": {
"light": "{Colors$color/violet/70}",
"dark": "{Colors$color/violet/20}",
"forcedColors": "{Theme$color/accent/primary/hover}"
},
"button/background/color/primary/active": {
"light": "{Colors$color/violet/80}",
"dark": "{Colors$color/violet/10}",
"forcedColors": "{Theme$color/accent/primary/active}"
},
"button/background/color/ghost": {
"light": "{Theme$button/background/color}",
"dark": "{Theme$button/background/color}",
"forcedColors": "transparent"
},
"button/background/color/ghost/disabled": {
"light": "{Theme$button/background/color/ghost}",
"dark": "{Theme$button/background/color/ghost}",
"forcedColors": "{Theme$button/background/color/ghost}"
},
"button/border/color": {
"light": "{Theme$color/accent/primary}",
"dark": "{Theme$color/accent/primary}",
"forcedColors": "{Theme$border/color/interactive}"
},
"button/border/color/destructive": {
"light": "{Theme$button/border/color/ghost}",
"dark": "{Theme$button/border/color/ghost}",
"forcedColors": "{Theme$button/border/color/primary}"
},
"button/border/color/destructive/selected": {
"light": "{Theme$button/border/color/destructive}",
"dark": "{Theme$button/border/color/destructive}",
"forcedColors": "{Theme$button/border/color/destructive/active}"
},
"button/border/color/ghost": {
"light": "transparent",
"dark": "transparent",
"forcedColors": "{Theme$button/border/color}"
},
"button/border/color/ghost/active": {
"light": "{Theme$button/border/color/ghost}",
"dark": "{Theme$button/border/color/ghost}",
"forcedColors": "{Theme$button/border/color/active}"
},
"button/border/color/ghost/disabled": {
"light": "{Theme$button/border/color/ghost}",
"dark": "{Theme$button/border/color/ghost}",
"forcedColors": "{Theme$button/border/color/disabled}"
},
"button/border/color/ghost/hover": {
"light": "{Theme$button/border/color/ghost}",
"dark": "{Theme$button/border/color/ghost}",
"forcedColors": "{Theme$button/border/color/hover}"
},
"button/border/color/ghost/selected": {
"light": "{Theme$button/border/color/ghost}",
"dark": "{Theme$button/border/color/ghost}",
"forcedColors": "{Theme$button/border/color/ghost/active}"
},
"button/border/color/primary": {
"light": "{Theme$button/border/color/ghost}",
"dark": "{Theme$button/border/color/ghost}",
"forcedColors": "{HCM Theme$ButtonFace}"
},
"button/border/color/primary/selected": {
"light": "{Theme$button/border/color/primary}",
"dark": "{Theme$button/border/color/primary}",
"forcedColors": "{Theme$button/border/color/primary/active}"
},
"button/border/color/selected": {
"light": "{Theme$button/border/color}",
"dark": "{Theme$button/border/color}",
"forcedColors": "{Theme$button/border/color/active}"
},
"button/text/color": {
"light": "{Colors$color/violet/90}",
"dark": "{Colors$color/neutral/0}",
"forcedColors": "{HCM Theme$ButtonText}"
},
"button/text/color/destructive": {
"light": "{Colors$color/white}",
"dark": "{Colors$color/neutral/90}",
"forcedColors": "{Theme$button/text/color/primary}"
},
"button/text/color/destructive/selected": {
"light": "{Theme$button/text/color/destructive}",
"dark": "{Theme$button/text/color/destructive/active}",
"forcedColors": "{Theme$button/text/color/destructive/active}"
},
"button/text/color/ghost": {
"light": "{Theme$button/text/color}",
"dark": "{Theme$button/text/color}",
"forcedColors": "{HCM Theme$ButtonText}"
},
"button/text/color/ghost/active": {
"light": "{Theme$button/text/color/ghost}",
"dark": "{Theme$button/text/color/ghost}",
"forcedColors": "{Theme$button/text/color/active}"
},
"button/text/color/ghost/disabled": {
"light": "{Theme$button/text/color/ghost}",
"dark": "{Theme$button/text/color/ghost}",
"forcedColors": "{HCM Theme$GrayText}"
},
"button/text/color/ghost/hover": {
"light": "{Theme$button/text/color/ghost}",
"dark": "{Theme$button/text/color/ghost}",
"forcedColors": "{Theme$button/text/color/ghost/active}"
},
"button/text/color/menu/disabled": {
"light": "{Theme$button/text/color/ghost/disabled}",
"dark": "{Theme$button/text/color/ghost/disabled}",
"forcedColors": "{Theme$button/text/color/primary}"
},
"button/text/color/primary": {
"light": "{Colors$color/white}",
"dark": "{Colors$color/neutral/90}",
"forcedColors": "{HCM Theme$ButtonFace}"
},
"button/text/color/primary/active": {
"light": "{Theme$button/text/color/primary}",
"dark": "{Theme$button/text/color/primary}",
"forcedColors": "{Theme$button/text/color/primary/hover}"
},
"button/text/color/selected": {
"light": "{Theme$button/text/color}",
"dark": "{Theme$button/text/color}",
"forcedColors": "{Theme$button/text/color/active}"
},
"icon/color": {
"light": "{Colors$color/neutral/70}",
"dark": "{Colors$color/neutral/0}",
"forcedColors": "{Theme$text/color}"
},
"icon/color/information": {
"light": "{Colors$color/blue/40}",
"dark": "{Colors$color/blue/20}",
"forcedColors": "{Theme$icon/color}"
},
"icon/color/success": {
"light": "{Colors$color/green/40}",
"dark": "{Colors$color/green/20}",
"forcedColors": "{Theme$icon/color}"
},
"icon/color/warning": {
"light": "{Colors$color/yellow/40}",
"dark": "{Colors$color/yellow/20}",
"forcedColors": "{Theme$icon/color}"
},
"icon/color/critical": {
"light": "{Colors$color/red/40}",
"dark": "{Colors$color/red/20}",
"forcedColors": "{Theme$icon/color}"
},
"link/color": {
"light": "{Theme$color/accent/primary}",
"dark": "{Theme$color/accent/primary}",
"forcedColors": "{HCM Theme$LinkText}"
},
"link/color/hover": {
"light": "{Theme$color/accent/primary/hover}",
"dark": "{Theme$color/accent/primary/hover}",
"forcedColors": "{HCM Theme$LinkText}"
},
"link/color/active": {
"light": "{Theme$color/accent/primary/active}",
"dark": "{Theme$color/accent/primary/active}",
"forcedColors": "{HCM Theme$ActiveText}"
},
"link/color/visited": {
"light": "{Theme$link/color}",
"dark": "{Theme$link/color}",
"forcedColors": "{Theme$link/color}"
},
"table/row/background/color": {
"light": "{Theme$background/color/canvas}",
"dark": "{Theme$background/color/canvas}",
"forcedColors": "{Theme$background/color/canvas}"
},
"table/row/background/color/alternate": {
"light": "#F0F0F4",
"dark": "{Colors$color/neutral/80}",
"forcedColors": "{Theme$background/color/canvas}"
}
}