@salesforce-ux/design-tokens
Version:
Salesforce Design System Tokens & Styling Hooks
16,229 lines • 518 kB
JSON
{
"slds": {
"is": {
"v2": {
"enabled": {
"$type": "string",
"$value": "true",
"$description": "Enable the use of the slds2 design system.",
"name": "enabled",
"originalValue": "true",
"type": "string",
"category": "",
"scope": "",
"namespace": "enabled",
"themeOwned": false
}
}
},
"g": {
"duration": {
"immediately": {
"$type": "duration",
"$value": {
"value": 0.05,
"unit": "s"
},
"$description": "0.05 seconds, 3 frames",
"name": "immediately",
"originalValue": "0.05s",
"type": "duration",
"syntax": "<time>",
"category": "",
"scope": "",
"namespace": "immediately",
"themeOwned": false,
"cssProperties": [
"animation*",
"transition*"
]
},
"instantly": {
"$type": "duration",
"$value": {
"value": 0,
"unit": "s"
},
"$description": "0 seconds, 0 frames",
"name": "instantly",
"originalValue": "0s",
"type": "duration",
"syntax": "<time>",
"category": "",
"scope": "",
"namespace": "instantly",
"themeOwned": false,
"cssProperties": [
"animation*",
"transition*"
]
},
"paused": {
"$type": "duration",
"$value": {
"value": 3.2,
"unit": "s"
},
"$description": "3.2 seconds, 192 frames",
"name": "paused",
"originalValue": "3.2s",
"type": "duration",
"syntax": "<time>",
"category": "",
"scope": "",
"namespace": "paused",
"themeOwned": false,
"cssProperties": [
"animation*",
"transition*"
]
},
"promptly": {
"$type": "duration",
"$value": {
"value": 0.2,
"unit": "s"
},
"$description": "0.2 seconds, 12 frames",
"name": "promptly",
"originalValue": "0.2s",
"type": "duration",
"syntax": "<time>",
"category": "",
"scope": "",
"namespace": "promptly",
"themeOwned": false,
"cssProperties": [
"animation*",
"transition*"
]
},
"quickly": {
"$type": "duration",
"$value": {
"value": 0.1,
"unit": "s"
},
"$description": "0.1 seconds, 6 frames",
"name": "quickly",
"originalValue": "0.1s",
"type": "duration",
"syntax": "<time>",
"category": "",
"scope": "",
"namespace": "quickly",
"themeOwned": false,
"cssProperties": [
"animation*",
"transition*"
]
},
"slowly": {
"$type": "duration",
"$value": {
"value": 0.4,
"unit": "s"
},
"$description": "0.4 seconds, 24 frames",
"name": "slowly",
"originalValue": "0.4s",
"type": "duration",
"syntax": "<time>",
"category": "",
"scope": "",
"namespace": "slowly",
"themeOwned": false,
"cssProperties": [
"animation*",
"transition*"
]
},
"toastMedium": {
"$type": "duration",
"$value": {
"value": 9.6,
"unit": "s"
},
"$description": "9.6 seconds",
"name": "toastMedium",
"originalValue": "9.6s",
"type": "duration",
"syntax": "<time>",
"category": "",
"scope": "",
"namespace": "toastMedium",
"themeOwned": false,
"cssProperties": [
"animation*",
"transition*"
]
},
"toastShort": {
"$type": "duration",
"$value": {
"value": 4.8,
"unit": "s"
},
"$description": "4.8 seconds",
"name": "toastShort",
"originalValue": "4.8s",
"type": "duration",
"syntax": "<time>",
"category": "",
"scope": "",
"namespace": "toastShort",
"themeOwned": false,
"cssProperties": [
"animation*",
"transition*"
]
}
},
"ratio": {
"square": {
"$type": "number",
"$value": "1",
"$description": "Ratio Square.",
"name": "square",
"originalValue": "1",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "square",
"themeOwned": false,
"cssProperties": [
"aspect-ratio"
]
},
"landscape": {
"$type": "number",
"$value": "4/3",
"$description": "Ratio Landscape.",
"name": "landscape",
"originalValue": "4/3",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "landscape",
"themeOwned": false,
"cssProperties": [
"aspect-ratio"
]
},
"portrait": {
"$type": "number",
"$value": "3/4",
"$description": "Ratio Portrait.",
"name": "portrait",
"originalValue": "3/4",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "portrait",
"themeOwned": false,
"cssProperties": [
"aspect-ratio"
]
},
"wide": {
"$type": "number",
"$value": "16/9",
"$description": "Ratio Wide.",
"name": "wide",
"originalValue": "16/9",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "wide",
"themeOwned": false,
"cssProperties": [
"aspect-ratio"
]
},
"ultrawide": {
"$type": "number",
"$value": "18/5",
"$description": "Ratio Ultrawide.",
"name": "ultrawide",
"originalValue": "18/5",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "ultrawide",
"themeOwned": false,
"cssProperties": [
"aspect-ratio"
]
}
},
"sizing": {
"1": {
"$type": "dimension",
"$value": {
"value": 0.125,
"unit": "rem"
},
"$description": "Sizing 1 | 2px.",
"name": "1",
"originalValue": "0.125rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"2": {
"$type": "dimension",
"$value": {
"value": 0.25,
"unit": "rem"
},
"$description": "Sizing 2 | 4px.",
"name": "2",
"originalValue": "0.25rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"3": {
"$type": "dimension",
"$value": {
"value": 0.5,
"unit": "rem"
},
"$description": "Sizing 3 | 8px.",
"name": "3",
"originalValue": "0.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"4": {
"$type": "dimension",
"$value": {
"value": 0.75,
"unit": "rem"
},
"$description": "Sizing 4 | 12px.",
"name": "4",
"originalValue": "0.75rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"5": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "rem"
},
"$description": "Sizing 5 | 16px.",
"name": "5",
"originalValue": "1rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "5",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"6": {
"$type": "dimension",
"$value": {
"value": 1.25,
"unit": "rem"
},
"$description": "Sizing 6 | 20px.",
"name": "6",
"originalValue": "1.25rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "6",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"7": {
"$type": "dimension",
"$value": {
"value": 1.5,
"unit": "rem"
},
"$description": "Sizing 7 | 24px.",
"name": "7",
"originalValue": "1.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "7",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"8": {
"$type": "dimension",
"$value": {
"value": 1.75,
"unit": "rem"
},
"$description": "Sizing 8 | 28px.",
"name": "8",
"originalValue": "1.75rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "8",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"9": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "rem"
},
"$description": "Sizing 9.",
"name": "9",
"originalValue": "2rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "9",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"10": {
"$type": "dimension",
"$value": {
"value": 3,
"unit": "rem"
},
"$description": "Sizing 10 | 48px.",
"name": "10",
"originalValue": "3rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "10",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"11": {
"$type": "dimension",
"$value": {
"value": 4,
"unit": "rem"
},
"$description": "Sizing 11 | 64px.",
"name": "11",
"originalValue": "4rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "11",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"12": {
"$type": "dimension",
"$value": {
"value": 5,
"unit": "rem"
},
"$description": "Sizing 12 | 80px.",
"name": "12",
"originalValue": "5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "12",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"13": {
"$type": "dimension",
"$value": {
"value": 10,
"unit": "rem"
},
"$description": "Sizing 13 | 160px.",
"name": "13",
"originalValue": "10rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "13",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"14": {
"$type": "dimension",
"$value": {
"value": 15,
"unit": "rem"
},
"$description": "Sizing 14 | 240px.",
"name": "14",
"originalValue": "15rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "14",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"15": {
"$type": "dimension",
"$value": {
"value": 20,
"unit": "rem"
},
"$description": "Sizing 15 | 320px.",
"name": "15",
"originalValue": "20rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "15",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"16": {
"$type": "dimension",
"$value": {
"value": 30,
"unit": "rem"
},
"$description": "Sizing 16 | 480px.",
"name": "16",
"originalValue": "30rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "16",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"base": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "rem"
},
"$description": "Base size multiplier.",
"name": "base",
"originalValue": "1rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "base",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"border": {
"1": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "px"
},
"$description": "Border Width 1 | 1px.",
"name": "1",
"originalValue": "1px",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"2": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "px"
},
"$description": "Border Width 2 | 2px.",
"name": "2",
"originalValue": "2px",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"3": {
"$type": "dimension",
"$value": {
"value": 3,
"unit": "px"
},
"$description": "Border Width 3 | 3px.",
"name": "3",
"originalValue": "3px",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"4": {
"$type": "dimension",
"$value": {
"value": 4,
"unit": "px"
},
"$description": "Border Width 4 | 4px.",
"name": "4",
"originalValue": "4px",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
}
},
"content": {
"1": {
"$type": "dimension",
"$value": {
"value": 20,
"unit": "ch"
},
"$deprecated": true,
"$description": "Sizing Content 1.",
"name": "1",
"originalValue": "20ch",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"2": {
"$type": "dimension",
"$value": {
"value": 45,
"unit": "ch"
},
"$deprecated": true,
"$description": "Sizing Content 2.",
"name": "2",
"originalValue": "45ch",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"3": {
"$type": "dimension",
"$value": {
"value": 60,
"unit": "ch"
},
"$deprecated": true,
"$description": "Sizing Content 3.",
"name": "3",
"originalValue": "60ch",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
}
},
"heading": {
"1": {
"$type": "dimension",
"$value": {
"value": 20,
"unit": "ch"
},
"$deprecated": true,
"$description": "Sizing Heading 1.",
"name": "1",
"originalValue": "20ch",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"2": {
"$type": "dimension",
"$value": {
"value": 25,
"unit": "ch"
},
"$deprecated": true,
"$description": "Sizing Heading 2.",
"name": "2",
"originalValue": "25ch",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
},
"3": {
"$type": "dimension",
"$value": {
"value": 35,
"unit": "ch"
},
"$deprecated": true,
"$description": "Sizing Heading 3.",
"name": "3",
"originalValue": "35ch",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": false,
"cssProperties": [
"border-width",
"width"
]
}
}
},
"spacing": {
"1": {
"$type": "dimension",
"$value": {
"value": 0.25,
"unit": "rem"
},
"$description": "Spacing 1 | 4px.",
"name": "1",
"originalValue": "0.25rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"2": {
"$type": "dimension",
"$value": {
"value": 0.5,
"unit": "rem"
},
"$description": "Spacing 2 | 8px.",
"name": "2",
"originalValue": "0.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"3": {
"$type": "dimension",
"$value": {
"value": 0.75,
"unit": "rem"
},
"$description": "Spacing 3 | 12px.",
"name": "3",
"originalValue": "0.75rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"4": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "rem"
},
"$description": "Spacing 4 | 16px.",
"name": "4",
"originalValue": "1rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"5": {
"$type": "dimension",
"$value": {
"value": 1.5,
"unit": "rem"
},
"$description": "Spacing 5 | 24px.",
"name": "5",
"originalValue": "1.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "5",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"6": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "rem"
},
"$description": "Spacing 6 | 32px.",
"name": "6",
"originalValue": "2rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "6",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"7": {
"$type": "dimension",
"$value": {
"value": 2.5,
"unit": "rem"
},
"$description": "Spacing 7 | 40px.",
"name": "7",
"originalValue": "2.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "7",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"8": {
"$type": "dimension",
"$value": {
"value": 3,
"unit": "rem"
},
"$description": "Spacing 8 | 48px.",
"name": "8",
"originalValue": "3rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "8",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"9": {
"$type": "dimension",
"$value": {
"value": 3.5,
"unit": "rem"
},
"$description": "Spacing 9 | 56px.",
"name": "9",
"originalValue": "3.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "9",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"10": {
"$type": "dimension",
"$value": {
"value": 4,
"unit": "rem"
},
"$description": "Spacing 10 | 64px.",
"name": "10",
"originalValue": "4rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "10",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"11": {
"$type": "dimension",
"$value": {
"value": 4.5,
"unit": "rem"
},
"$description": "Spacing 11 | 72px.",
"name": "11",
"originalValue": "4.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "11",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"12": {
"$type": "dimension",
"$value": {
"value": 5,
"unit": "rem"
},
"$description": "Spacing 12 | 80px.",
"name": "12",
"originalValue": "5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "12",
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"var": {
"1": {
"$type": "dimension",
"$value": "{slds.g.spacing.1}",
"$description": "Comfy (default) = 0.25rem | Compact = 0.125rem.",
"name": "1",
"originalValue": "{slds.g.spacing.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"2": {
"$type": "dimension",
"$value": "{slds.g.spacing.2}",
"$description": "Comfy (default) = 0.5rem | Compact = 0.125rem.",
"name": "2",
"originalValue": "{slds.g.spacing.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"3": {
"$type": "dimension",
"$value": "{slds.g.spacing.3}",
"$description": "Comfy (default) = 0.75rem | Compact = 0.25rem.",
"name": "3",
"originalValue": "{slds.g.spacing.3}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"4": {
"$type": "dimension",
"$value": "{slds.g.spacing.4}",
"$description": "Comfy (default) = 1rem | Compact = 0.5rem.",
"name": "4",
"originalValue": "{slds.g.spacing.4}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"5": {
"$type": "dimension",
"$value": "{slds.g.spacing.5}",
"$description": "Comfy (default) = 1.5rem | Compact = 0.75rem.",
"name": "5",
"originalValue": "{slds.g.spacing.5}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"6": {
"$type": "dimension",
"$value": "{slds.g.spacing.6}",
"$description": "Comfy (default) = 2rem | Compact = 1rem.",
"name": "6",
"originalValue": "{slds.g.spacing.6}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "6",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"7": {
"$type": "dimension",
"$value": "{slds.g.spacing.7}",
"$description": "Comfy (default) = 2.5rem | Compact = 1.5rem.",
"name": "7",
"originalValue": "{slds.g.spacing.7}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "7",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"8": {
"$type": "dimension",
"$value": "{slds.g.spacing.8}",
"$description": "Comfy (default) = 3rem | Compact = 2rem.",
"name": "8",
"originalValue": "{slds.g.spacing.8}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "8",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"9": {
"$type": "dimension",
"$value": "{slds.g.spacing.9}",
"$description": "Comfy (default) = 3.5rem | Compact = 2.5rem.",
"name": "9",
"originalValue": "{slds.g.spacing.9}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "9",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"10": {
"$type": "dimension",
"$value": "{slds.g.spacing.10}",
"$description": "Comfy (default) = 4rem | Compact = 3rem.",
"name": "10",
"originalValue": "{slds.g.spacing.10}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"11": {
"$type": "dimension",
"$value": "{slds.g.spacing.11}",
"$description": "Comfy (default) = 4.5rem | Compact = 3.5rem.",
"name": "11",
"originalValue": "{slds.g.spacing.11}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "11",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"12": {
"$type": "dimension",
"$value": "{slds.g.spacing.12}",
"$description": "Comfy (default) = 5rem | Compact = 4rem.",
"name": "12",
"originalValue": "{slds.g.spacing.12}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "12",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"block": {
"1": {
"$type": "dimension",
"$value": "{slds.g.spacing.1}",
"$description": "Comfy (default) = 0.25rem | Compact = 0.125rem.",
"name": "1",
"originalValue": "{slds.g.spacing.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"2": {
"$type": "dimension",
"$value": "{slds.g.spacing.2}",
"$description": "Comfy (default) = 0.5rem | Compact = 0.25rem.",
"name": "2",
"originalValue": "{slds.g.spacing.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"3": {
"$type": "dimension",
"$value": "{slds.g.spacing.3}",
"$description": "Comfy (default) = 0.75rem | Compact = 0.5rem.",
"name": "3",
"originalValue": "{slds.g.spacing.3}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"4": {
"$type": "dimension",
"$value": "{slds.g.spacing.4}",
"$description": "Comfy (default) = 1rem | Compact = 0.5rem.",
"name": "4",
"originalValue": "{slds.g.spacing.4}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"5": {
"$type": "dimension",
"$value": "{slds.g.spacing.5}",
"$description": "Comfy (default) = 1.5rem | Compact = 0.75rem.",
"name": "5",
"originalValue": "{slds.g.spacing.5}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"6": {
"$type": "dimension",
"$value": "{slds.g.spacing.6}",
"$description": "Comfy (default) = 2rem | Compact = 1rem.",
"name": "6",
"originalValue": "{slds.g.spacing.6}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "6",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"7": {
"$type": "dimension",
"$value": "{slds.g.spacing.7}",
"$description": "Comfy (default) = 2.5rem | Compact = 1.5rem.",
"name": "7",
"originalValue": "{slds.g.spacing.7}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "7",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"8": {
"$type": "dimension",
"$value": "{slds.g.spacing.8}",
"$description": "Comfy (default) = 3rem | Compact = 2rem.",
"name": "8",
"originalValue": "{slds.g.spacing.8}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "8",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"9": {
"$type": "dimension",
"$value": "{slds.g.spacing.9}",
"$description": "Comfy (default) = 3.5rem | Compact = 2.5rem.",
"name": "9",
"originalValue": "{slds.g.spacing.9}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "9",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"10": {
"$type": "dimension",
"$value": "{slds.g.spacing.10}",
"$description": "Comfy (default) = 4rem | Compact = 3rem.",
"name": "10",
"originalValue": "{slds.g.spacing.10}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"11": {
"$type": "dimension",
"$value": "{slds.g.spacing.11}",
"$description": "Comfy (default) = 4.5rem | Compact = 3.5rem.",
"name": "11",
"originalValue": "{slds.g.spacing.11}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "11",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"12": {
"$type": "dimension",
"$value": "{slds.g.spacing.12}",
"$description": "Comfy (default) = 5rem | Compact = 4rem.",
"name": "12",
"originalValue": "{slds.g.spacing.12}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "12",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
}
},
"inline": {
"1": {
"$type": "dimension",
"$value": "{slds.g.spacing.1}",
"$description": "Comfy (default) = 0.25rem | Compact = 0.125rem.",
"name": "1",
"originalValue": "{slds.g.spacing.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"2": {
"$type": "dimension",
"$value": "{slds.g.spacing.2}",
"$description": "Comfy (default) = 0.5rem | Compact = 0.25rem.",
"name": "2",
"originalValue": "{slds.g.spacing.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"3": {
"$type": "dimension",
"$value": "{slds.g.spacing.3}",
"$description": "Comfy (default) = 0.75rem | Compact = 0.5rem.",
"name": "3",
"originalValue": "{slds.g.spacing.3}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"4": {
"$type": "dimension",
"$value": "{slds.g.spacing.4}",
"$description": "Comfy (default) = 1rem | Compact = 0.75rem.",
"name": "4",
"originalValue": "{slds.g.spacing.4}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"5": {
"$type": "dimension",
"$value": "{slds.g.spacing.5}",
"$description": "Comfy (default) = 1.5rem | Compact = 0.75rem.",
"name": "5",
"originalValue": "{slds.g.spacing.5}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"6": {
"$type": "dimension",
"$value": "{slds.g.spacing.6}",
"$description": "Comfy (default) = 2rem | Compact = 1rem.",
"name": "6",
"originalValue": "{slds.g.spacing.6}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "6",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"7": {
"$type": "dimension",
"$value": "{slds.g.spacing.7}",
"$description": "Comfy (default) = 2.5rem | Compact = 1.5rem.",
"name": "7",
"originalValue": "{slds.g.spacing.7}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "7",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"8": {
"$type": "dimension",
"$value": "{slds.g.spacing.8}",
"$description": "Comfy (default) = 3rem | Compact = 2rem.",
"name": "8",
"originalValue": "{slds.g.spacing.8}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "8",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"9": {
"$type": "dimension",
"$value": "{slds.g.spacing.9}",
"$description": "Comfy (default) = 3.5rem | Compact = 2.5rem.",
"name": "9",
"originalValue": "{slds.g.spacing.9}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "9",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"10": {
"$type": "dimension",
"$value": "{slds.g.spacing.10}",
"$description": "Comfy (default) = 4rem | Compact = 3rem.",
"name": "10",
"originalValue": "{slds.g.spacing.10}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"11": {
"$type": "dimension",
"$value": "{slds.g.spacing.11}",
"$description": "Comfy (default) = 4.5rem | Compact = 3.5rem.",
"name": "11",
"originalValue": "{slds.g.spacing.11}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "11",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"12": {
"$type": "dimension",
"$value": "{slds.g.spacing.12}",
"$description": "Comfy (default) = 5rem | Compact = 4rem.",
"name": "12",
"originalValue": "{slds.g.spacing.12}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "12",
"inherits": true,
"themeOwned": false,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
}
}
}
},
"radius": {
"border": {
"1": {
"$type": "dimension",
"$value": {
"value": 0.25,
"unit": "rem"
},
"$description": "Radius Border 1 | 4px.",
"name": "1",
"originalValue": "0.25rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"border-radius"
]
},
"2": {
"$type": "dimension",
"$value": {
"value": 0.5,
"unit": "rem"
},
"$description": "Radius Border 2 | 8px.",
"name": "2",
"originalValue": "0.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"border-radius"
]
},
"3": {
"$type": "dimension",
"$value": {
"value": 0.75,
"unit": "rem"
},
"$description": "Radius Border 3 | 12px.",
"name": "3",
"originalValue": "0.75rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": true,
"cssProperties": [
"border-radius"
]
},
"4": {
"$type": "dimension",
"$value": {
"value": 1.25,
"unit": "rem"
},
"$description": "Radius Border 4 | 20px.",
"name": "4",
"originalValue": "1.25rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": true,
"cssProperties": [
"border-radius"
]
},
"pill": {
"$type": "dimension",
"$value": {
"value": 15,
"unit": "rem"
},
"$description": "Radius Border Pill.",
"name": "pill",
"originalValue": "15rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "pill",
"themeOwned": true,
"cssProperties": [
"border-radius"
]
},
"circle": {
"$type": "dimension",
"$value": {
"value": 100,
"unit": "%"
},
"$description": "Radius Border Circle | 100% 100px.",
"name": "circle",
"originalValue": "100%",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "circle",
"themeOwned": true,
"cssProperties": [
"border-radius"
]
}
}
},
"font": {
"family": {
"$type": "fontFamily",
"$value": "{slds.g.font.family-base}",
"$deprecated": true,
"$description": "System font stack for your application.",
"name": "family",
"originalValue": "{slds.g.font.family-base}",
"type": "fontFamily",
"category": "",
"scope": "",
"namespace": "family",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-family"
]
},
"family-base": {
"$type": "fontFamily",
"$value": "system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
"$description": "Font Family Base.",
"name": "family-base",
"originalValue": "system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
"type": "fontFamily",
"category": "",
"scope": "base",
"namespace": "family",
"themeOwned": true,
"cssProperties": [
"font-family"
]
},
"family-monospace": {
"$type": "fontFamily",
"$value": "Consolas, Menlo, Monaco, Courier, monospace",
"$description": "Font Family Monospace.",
"name": "family-monospace",
"originalValue": "Consolas, Menlo, Monaco, Courier, monospace",
"type": "fontFamily",
"category": "",
"scope": "monospace",
"namespace": "family",
"themeOwned": true,
"cssProperties": [
"font-family"
]
},
"weight": {
"1": {
"$type": "fontWeight",
"$value": "100",
"$description": "Font Weight 1 | 100.",
"name": "1",
"originalValue": "100",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"2": {
"$type": "fontWeight",
"$value": "200",
"$description": "Font Weight 2 | 200.",
"name": "2",
"originalValue": "200",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"3": {
"$type": "fontWeight",
"$value": "300",
"$description": "Light | 300.",
"name": "3",
"originalValue": "300",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"4": {
"$type": "fontWeight",
"$value": "400",
"$description": "Regular | 400.",
"name": "4",
"originalValue": "400",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"5": {
"$type": "fontWeight",
"$value": "500",
"$description": "Font Weight 5 | 500.",
"name": "5",
"originalValue": "500",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "5",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"6": {
"$type": "fontWeight",
"$value": "600",
"$description": "SemiBold | 600.",
"name": "6",
"originalValue": "600",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "6",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"7": {
"$type": "fontWeight",
"$value": "700",
"$description": "Bold | 700.",
"name": "7",
"originalValue": "700",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "7",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"bold": {
"$type": "fontWeight",
"$value": "bold",
"$deprecated": true,
"$description": "Bold font-weight, use to increase emphasis.",
"name": "bold",
"originalValue": "bold",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "bold",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
}
},
"line": {
"height": {
"1": {
"$type": "number",
"$value": "1",
"$description": "Line-height 1.",
"name": "1",
"originalValue": "1",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"2": {
"$type": "number",
"$value": "1.25",
"$description": "Line-height 2.",
"name": "2",
"originalValue": "1.25",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"3": {
"$type": "number",
"$value": "1.375",
"$description": "Line-height 3.",
"name": "3",
"originalValue": "1.375",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"4": {
"$type": "number",
"$value": "1.5",
"$description": "Line-height 4.",
"name": "4",
"originalValue": "1.5",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"5": {
"$type": "number",
"$value": "1.75",
"$description": "Line-height 5.",
"name": "5",
"originalValue": "1.75",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "5",
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"6": {
"$type": "number",
"$value": "2",
"$description": "Line-height 6.",
"name": "6",
"originalValue": "2",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "6",
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"base": {
"$type": "number",
"$value": "1.5",
"$description": "Default line-height for your application.",
"name": "base",
"originalValue": "1.5",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "base",
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"var": {
"base": {
"$type": "number",
"$value": "{slds.g.font.line.height.base}",
"$description": "Default variable line-height for your application.",
"name": "base",
"originalValue": "{slds.g.font.line.height.base}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "base",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
}
}
}
},
"lineheight": {
"1": {
"$type": "number",
"$value": "{slds.g.font.line.height.1}",
"$deprecated": true,
"$description": "Font Lineheight 1 | 16px.",
"name": "1",
"originalValue": "{slds.g.font.line.height.1}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"2": {
"$type": "number",
"$value": "{slds.g.font.line.height.2}",
"$deprecated": true,
"$description": "Font Lineheight 2 | 20px.",
"name": "2",
"originalValue": "{slds.g.font.line.height.2}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"3": {
"$type": "number",
"$value": "{slds.g.font.line.height.3}",
"$deprecated": true,
"$description": "Font Lineheight 3 | 22px.",
"name": "3",
"originalValue": "{slds.g.font.line.height.3}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"4": {
"$type": "number",
"$value": "{slds.g.font.line.height.4}",
"$deprecated": true,
"$description": "Font Lineheight 4 | 24px.",
"name": "4",
"originalValue": "{slds.g.font.line.height.4}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"5": {
"$type": "number",
"$value": "{slds.g.font.line.height.5}",
"$deprecated": true,
"$description": "Font Lineheight 5 | 28px.",
"name": "5",
"originalValue": "{slds.g.font.line.height.5}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"6": {
"$type": "number",
"$value": "{slds.g.font.line.height.6}",
"$deprecated": true,
"$description": "Font Lineheight 6 | 32px.",
"name": "6",
"originalValue": "{slds.g.font.line.height.6}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "6",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"base": {
"$type": "number",
"$value": "{slds.g.font.line.height.base}",
"$deprecated": true,
"$description": "Font Lineheight Base | 1.5.",
"name": "base",
"originalValue": "{slds.g.font.line.height.base}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "base",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
},
"var": {
"base": {
"$type": "number",
"$value": "{slds.g.font.line.height.var.base}",
"$deprecated": true,
"name": "base",
"originalValue": "{slds.g.font.line.height.var.base}",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "base",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"line-height"
]
}
}
},
"scale": {
"1": {
"$type": "dimension",
"$value": {
"value": 0.875,
"unit": "rem"
},
"$description": "Font Scale 1 | 14px.",
"name": "1",
"originalValue": "0.875rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"2": {
"$type": "dimension",
"$value": {
"value": 1,
"unit": "rem"
},
"$description": "Font Scale 2 | 16px.",
"name": "2",
"originalValue": "1rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"3": {
"$type": "dimension",
"$value": {
"value": 1.25,
"unit": "rem"
},
"$description": "Font Scale 3 | 20px.",
"name": "3",
"originalValue": "1.25rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"4": {
"$type": "dimension",
"$value": {
"value": 1.5,
"unit": "rem"
},
"$description": "Font Scale 4 | 24px.",
"name": "4",
"originalValue": "1.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"5": {
"$type": "dimension",
"$value": {
"value": 1.75,
"unit": "rem"
},
"$description": "Font Scale 5 | 28px.",
"name": "5",
"originalValue": "1.75rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "5",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"6": {
"$type": "dimension",
"$value": {
"value": 2,
"unit": "rem"
},
"$description": "Font Scale 6 | 32px.",
"name": "6",
"originalValue": "2rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "6",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"7": {
"$type": "dimension",
"$value": {
"value": 2.5,
"unit": "rem"
},
"$description": "Font Scale 7 | 40px.",
"name": "7",
"originalValue": "2.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "7",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"8": {
"$type": "dimension",
"$value": {
"value": 3,
"unit": "rem"
},
"$description": "Font Scale 8 | 48px.",
"name": "8",
"originalValue": "3rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "8",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"9": {
"$type": "dimension",
"$value": "{slds.g.font.scale.8}",
"$description": "Font Scale 9 | 48px.",
"name": "9",
"originalValue": "{slds.g.font.scale.8}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "9",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"10": {
"$type": "dimension",
"$value": "{slds.g.font.scale.8}",
"$description": "Font Scale 10 | 48px.",
"name": "10",
"originalValue": "{slds.g.font.scale.8}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"base": {
"$type": "dimension",
"$value": {
"value": 0.8125,
"unit": "rem"
},
"$description": "Default font-scale ratio for your application.",
"name": "base",
"originalValue": "0.8125rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "base",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"ratio": {
"$type": "number",
"$value": "1.15",
"$description": "Font Scale Ratio | 1.15.",
"name": "ratio",
"originalValue": "1.15",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "",
"namespace": "ratio",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"neg": {
"1": {
"$type": "dimension",
"$value": {
"value": 0.75,
"unit": "rem"
},
"$description": "Font Scale Neg 1 | 12px.",
"name": "1",
"originalValue": "0.75rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"2": {
"$type": "dimension",
"$value": {
"value": 0.625,
"unit": "rem"
},
"$description": "Font Scale Neg 2 | 10px.",
"name": "2",
"originalValue": "0.625rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"3": {
"$type": "dimension",
"$value": "{slds.g.font.scale.neg.2}",
"$description": "Font Scale Neg 3 | 10px.",
"name": "3",
"originalValue": "{slds.g.font.scale.neg.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"4": {
"$type": "dimension",
"$value": "{slds.g.font.scale.neg.3}",
"$description": "Font Scale Neg 4 | 10px.",
"name": "4",
"originalValue": "{slds.g.font.scale.neg.3}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
}
},
"var": {
"1": {
"$type": "dimension",
"$value": "{slds.g.font.scale.1}",
"$description": "Comfy (default) = 0.875rem | Compact = 0.875rem.",
"name": "1",
"originalValue": "{slds.g.font.scale.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"2": {
"$type": "dimension",
"$value": "{slds.g.font.scale.2}",
"$description": "Comfy (default) = 1rem | Compact = 0.875rem.",
"name": "2",
"originalValue": "{slds.g.font.scale.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"3": {
"$type": "dimension",
"$value": "{slds.g.font.scale.3}",
"$description": "Comfy (default) = 1.25rem | Compact = 1rem.",
"name": "3",
"originalValue": "{slds.g.font.scale.3}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"4": {
"$type": "dimension",
"$value": "{slds.g.font.scale.4}",
"$description": "Comfy (default) = 1.5rem | Compact = 1.25rem.",
"name": "4",
"originalValue": "{slds.g.font.scale.4}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"5": {
"$type": "dimension",
"$value": "{slds.g.font.scale.5}",
"$description": "Comfy (default) = 1.75rem | Compact = 1.75rem.",
"name": "5",
"originalValue": "{slds.g.font.scale.5}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"6": {
"$type": "dimension",
"$value": "{slds.g.font.scale.6}",
"$description": "Comfy (default) = 2rem | Compact = 2rem.",
"name": "6",
"originalValue": "{slds.g.font.scale.6}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "6",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"7": {
"$type": "dimension",
"$value": "{slds.g.font.scale.7}",
"$description": "Comfy (default) = 2.5rem | Compact = 2.5rem.",
"name": "7",
"originalValue": "{slds.g.font.scale.7}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "7",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"8": {
"$type": "dimension",
"$value": "{slds.g.font.scale.8}",
"$description": "Comfy (default) = 3rem | Compact = 3rem.",
"name": "8",
"originalValue": "{slds.g.font.scale.8}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "8",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"9": {
"$type": "dimension",
"$value": "{slds.g.font.scale.var.8}",
"$description": "Comfy (default) = 3rem | Compact = 3rem.",
"name": "9",
"originalValue": "{slds.g.font.scale.var.8}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "9",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"10": {
"$type": "dimension",
"$value": "{slds.g.font.scale.var.8}",
"$description": "Comfy (default) = 3rem | Compact = 3rem.",
"name": "10",
"originalValue": "{slds.g.font.scale.var.8}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"base": {
"$type": "dimension",
"$value": "{slds.g.font.scale.base}",
"$description": "Default variable font-scale ratio for your application.",
"name": "base",
"originalValue": "{slds.g.font.scale.base}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "base",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"neg": {
"1": {
"$type": "dimension",
"$value": "{slds.g.font.scale.neg.1}",
"$description": "Comfy (default) = 0.75rem | Compact = 0.75rem.",
"name": "1",
"originalValue": "{slds.g.font.scale.neg.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"2": {
"$type": "dimension",
"$value": "{slds.g.font.scale.neg.2}",
"$description": "Comfy (default) = 0.625rem | Compact = 0.625rem.",
"name": "2",
"originalValue": "{slds.g.font.scale.neg.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"3": {
"$type": "dimension",
"$value": "{slds.g.font.scale.var.neg.2}",
"$description": "Comfy (default) = 0.625rem | Compact = 0.625rem.",
"name": "3",
"originalValue": "{slds.g.font.scale.var.neg.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"4": {
"$type": "dimension",
"$value": "{slds.g.font.scale.var.neg.3}",
"$description": "Comfy (default) = 0.625rem | Compact = 0.625rem.",
"name": "4",
"originalValue": "{slds.g.font.scale.var.neg.3}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
}
}
}
},
"size": {
"base": {
"$type": "dimension",
"$value": "{slds.g.font.scale.base}",
"$description": "Font Size Base | 13px.",
"name": "base",
"originalValue": "{slds.g.font.scale.base}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "base",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
}
},
"line-clamp": {
"$type": "number",
"$value": "3",
"$description": "Default line-clamp.",
"name": "line-clamp",
"originalValue": "3",
"type": "number",
"syntax": "<number>",
"category": "",
"scope": "clamp",
"namespace": "line",
"themeOwned": true,
"cssProperties": [
"font-size"
]
}
},
"color": {
"palette": {
"neutral": {
"0": {
"$type": "color",
"$value": "{alias.palette.neutral.0}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.100}"
}
}
},
"$description": "Step 0 in the palette Neutral scale.",
"name": "0",
"originalValue": "{alias.palette.neutral.0}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "0",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"10": {
"$type": "color",
"$value": "{alias.palette.neutral.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.90}"
}
}
},
"$description": "Step 10 in the palette Neutral scale.",
"name": "10",
"originalValue": "{alias.palette.neutral.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.neutral.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.85}"
}
}
},
"$description": "Step 15 in the palette Neutral scale.",
"name": "15",
"originalValue": "{alias.palette.neutral.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.neutral.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.80}"
}
}
},
"$description": "Step 20 in the palette Neutral scale.",
"name": "20",
"originalValue": "{alias.palette.neutral.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.neutral.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.70}"
}
}
},
"$description": "Step 30 in the palette Neutral scale.",
"name": "30",
"originalValue": "{alias.palette.neutral.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.neutral.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.60}"
}
}
},
"$description": "Step 40 in the palette Neutral scale.",
"name": "40",
"originalValue": "{alias.palette.neutral.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.neutral.50}",
"$description": "Step 50 in the palette Neutral scale.",
"name": "50",
"originalValue": "{alias.palette.neutral.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.neutral.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.40}"
}
}
},
"$description": "Step 60 in the palette Neutral scale.",
"name": "60",
"originalValue": "{alias.palette.neutral.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.neutral.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.35}"
}
}
},
"$description": "Step 65 in the palette Neutral scale.",
"name": "65",
"originalValue": "{alias.palette.neutral.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.neutral.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.30}"
}
}
},
"$description": "Step 70 in the palette Neutral scale.",
"name": "70",
"originalValue": "{alias.palette.neutral.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.neutral.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.20}"
}
}
},
"$description": "Step 80 in the palette Neutral scale.",
"name": "80",
"originalValue": "{alias.palette.neutral.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.neutral.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.10}"
}
}
},
"$description": "Step 90 in the palette Neutral scale.",
"name": "90",
"originalValue": "{alias.palette.neutral.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.neutral.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.5}"
}
}
},
"$description": "Step 95 in the palette Neutral scale.",
"name": "95",
"originalValue": "{alias.palette.neutral.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"100": {
"$type": "color",
"$value": "{alias.palette.neutral.100}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.0}"
}
}
},
"$description": "Step 100 in the palette Neutral scale.",
"name": "100",
"originalValue": "{alias.palette.neutral.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "100",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"blue": {
"10": {
"$type": "color",
"$value": "{alias.palette.blue.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.90}"
}
}
},
"$description": "Step 10 in the palette Blue scale.",
"name": "10",
"originalValue": "{alias.palette.blue.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.blue.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.85}"
}
}
},
"$description": "Step 15 in the palette Blue scale.",
"name": "15",
"originalValue": "{alias.palette.blue.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.blue.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.80}"
}
}
},
"$description": "Step 20 in the palette Blue scale.",
"name": "20",
"originalValue": "{alias.palette.blue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.blue.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.70}"
}
}
},
"$description": "Step 30 in the palette Blue scale.",
"name": "30",
"originalValue": "{alias.palette.blue.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.blue.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.60}"
}
}
},
"$description": "Step 40 in the palette Blue scale.",
"name": "40",
"originalValue": "{alias.palette.blue.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.blue.50}",
"$description": "Step 50 in the palette Blue scale.",
"name": "50",
"originalValue": "{alias.palette.blue.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.blue.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.40}"
}
}
},
"$description": "Step 60 in the palette Blue scale.",
"name": "60",
"originalValue": "{alias.palette.blue.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.blue.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.35}"
}
}
},
"$description": "Step 65 in the palette Blue scale.",
"name": "65",
"originalValue": "{alias.palette.blue.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.blue.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.30}"
}
}
},
"$description": "Step 70 in the palette Blue scale.",
"name": "70",
"originalValue": "{alias.palette.blue.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.blue.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.20}"
}
}
},
"$description": "Step 80 in the palette Blue scale.",
"name": "80",
"originalValue": "{alias.palette.blue.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.blue.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.10}"
}
}
},
"$description": "Step 90 in the palette Blue scale.",
"name": "90",
"originalValue": "{alias.palette.blue.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.blue.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.5}"
}
}
},
"$description": "Step 95 in the palette Blue scale.",
"name": "95",
"originalValue": "{alias.palette.blue.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"cloud": {
"blue": {
"10": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.90}"
}
}
},
"$description": "Step 10 in the palette Cloud Blue scale.",
"name": "10",
"originalValue": "{alias.palette.cloudBlue.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.85}"
}
}
},
"$description": "Step 15 in the palette Cloud Blue scale.",
"name": "15",
"originalValue": "{alias.palette.cloudBlue.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.80}"
}
}
},
"$description": "Step 20 in the palette Cloud Blue scale.",
"name": "20",
"originalValue": "{alias.palette.cloudBlue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.70}"
}
}
},
"$description": "Step 30 in the palette Cloud Blue scale.",
"name": "30",
"originalValue": "{alias.palette.cloudBlue.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.60}"
}
}
},
"$description": "Step 40 in the palette Cloud Blue scale.",
"name": "40",
"originalValue": "{alias.palette.cloudBlue.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.50}",
"$description": "Step 50 in the palette Cloud Blue scale.",
"name": "50",
"originalValue": "{alias.palette.cloudBlue.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.40}"
}
}
},
"$description": "Step 60 in the palette Cloud Blue scale.",
"name": "60",
"originalValue": "{alias.palette.cloudBlue.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.35}"
}
}
},
"$description": "Step 65 in the palette Cloud Blue scale.",
"name": "65",
"originalValue": "{alias.palette.cloudBlue.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.30}"
}
}
},
"$description": "Step 70 in the palette Cloud Blue scale.",
"name": "70",
"originalValue": "{alias.palette.cloudBlue.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.20}"
}
}
},
"$description": "Step 80 in the palette Cloud Blue scale.",
"name": "80",
"originalValue": "{alias.palette.cloudBlue.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.10}"
}
}
},
"$description": "Step 90 in the palette Cloud Blue scale.",
"name": "90",
"originalValue": "{alias.palette.cloudBlue.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.cloudBlue.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.cloudBlue.5}"
}
}
},
"$description": "Step 95 in the palette Cloud Blue scale.",
"name": "95",
"originalValue": "{alias.palette.cloudBlue.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"electric": {
"blue": {
"10": {
"$type": "color",
"$value": "{alias.palette.electricBlue.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.90}"
}
}
},
"$description": "Step 10 in the palette Electric Blue scale.",
"name": "10",
"originalValue": "{alias.palette.electricBlue.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.electricBlue.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.85}"
}
}
},
"$description": "Step 15 in the palette Electric Blue scale.",
"name": "15",
"originalValue": "{alias.palette.electricBlue.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.electricBlue.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.80}"
}
}
},
"$description": "Step 20 in the palette Electric Blue scale.",
"name": "20",
"originalValue": "{alias.palette.electricBlue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.electricBlue.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.70}"
}
}
},
"$description": "Step 30 in the palette Electric Blue scale.",
"name": "30",
"originalValue": "{alias.palette.electricBlue.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.electricBlue.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.60}"
}
}
},
"$description": "Step 40 in the palette Electric Blue scale.",
"name": "40",
"originalValue": "{alias.palette.electricBlue.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.electricBlue.50}",
"$description": "Step 50 in the palette Electric Blue scale.",
"name": "50",
"originalValue": "{alias.palette.electricBlue.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.electricBlue.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.40}"
}
}
},
"$description": "Step 60 in the palette Electric Blue scale.",
"name": "60",
"originalValue": "{alias.palette.electricBlue.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.electricBlue.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.35}"
}
}
},
"$description": "Step 65 in the palette Electric Blue scale.",
"name": "65",
"originalValue": "{alias.palette.electricBlue.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.electricBlue.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.30}"
}
}
},
"$description": "Step 70 in the palette Electric Blue scale.",
"name": "70",
"originalValue": "{alias.palette.electricBlue.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.electricBlue.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.20}"
}
}
},
"$description": "Step 80 in the palette Electric Blue scale.",
"name": "80",
"originalValue": "{alias.palette.electricBlue.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.electricBlue.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.10}"
}
}
},
"$description": "Step 90 in the palette Electric Blue scale.",
"name": "90",
"originalValue": "{alias.palette.electricBlue.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.electricBlue.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.5}"
}
}
},
"$description": "Step 95 in the palette Electric Blue scale.",
"name": "95",
"originalValue": "{alias.palette.electricBlue.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"green": {
"10": {
"$type": "color",
"$value": "{alias.palette.green.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.90}"
}
}
},
"$description": "Step 10 in the palette Green scale.",
"name": "10",
"originalValue": "{alias.palette.green.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.green.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.85}"
}
}
},
"$description": "Step 15 in the palette Green scale.",
"name": "15",
"originalValue": "{alias.palette.green.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.green.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.80}"
}
}
},
"$description": "Step 20 in the palette Green scale.",
"name": "20",
"originalValue": "{alias.palette.green.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.green.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.70}"
}
}
},
"$description": "Step 30 in the palette Green scale.",
"name": "30",
"originalValue": "{alias.palette.green.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.green.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.60}"
}
}
},
"$description": "Step 40 in the palette Green scale.",
"name": "40",
"originalValue": "{alias.palette.green.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.green.50}",
"$description": "Step 50 in the palette Green scale.",
"name": "50",
"originalValue": "{alias.palette.green.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.green.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.40}"
}
}
},
"$description": "Step 60 in the palette Green scale.",
"name": "60",
"originalValue": "{alias.palette.green.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.green.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.35}"
}
}
},
"$description": "Step 65 in the palette Green scale.",
"name": "65",
"originalValue": "{alias.palette.green.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.green.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.30}"
}
}
},
"$description": "Step 70 in the palette Green scale.",
"name": "70",
"originalValue": "{alias.palette.green.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.green.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.20}"
}
}
},
"$description": "Step 80 in the palette Green scale.",
"name": "80",
"originalValue": "{alias.palette.green.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.green.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.10}"
}
}
},
"$description": "Step 90 in the palette Green scale.",
"name": "90",
"originalValue": "{alias.palette.green.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.green.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.green.5}"
}
}
},
"$description": "Step 95 in the palette Green scale.",
"name": "95",
"originalValue": "{alias.palette.green.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"hot": {
"orange": {
"10": {
"$type": "color",
"$value": "{alias.palette.hotOrange.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.90}"
}
}
},
"$description": "Step 10 in the palette Hot Orange scale.",
"name": "10",
"originalValue": "{alias.palette.hotOrange.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.hotOrange.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.85}"
}
}
},
"$description": "Step 15 in the palette Hot Orange scale.",
"name": "15",
"originalValue": "{alias.palette.hotOrange.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.hotOrange.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.80}"
}
}
},
"$description": "Step 20 in the palette Hot Orange scale.",
"name": "20",
"originalValue": "{alias.palette.hotOrange.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.hotOrange.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.70}"
}
}
},
"$description": "Step 30 in the palette Hot Orange scale.",
"name": "30",
"originalValue": "{alias.palette.hotOrange.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.hotOrange.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.60}"
}
}
},
"$description": "Step 40 in the palette Hot Orange scale.",
"name": "40",
"originalValue": "{alias.palette.hotOrange.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.hotOrange.50}",
"$description": "Step 50 in the palette Hot Orange scale.",
"name": "50",
"originalValue": "{alias.palette.hotOrange.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.hotOrange.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.40}"
}
}
},
"$description": "Step 60 in the palette Hot Orange scale.",
"name": "60",
"originalValue": "{alias.palette.hotOrange.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.hotOrange.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.35}"
}
}
},
"$description": "Step 65 in the palette Hot Orange scale.",
"name": "65",
"originalValue": "{alias.palette.hotOrange.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.hotOrange.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.30}"
}
}
},
"$description": "Step 70 in the palette Hot Orange scale.",
"name": "70",
"originalValue": "{alias.palette.hotOrange.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.hotOrange.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.20}"
}
}
},
"$description": "Step 80 in the palette Hot Orange scale.",
"name": "80",
"originalValue": "{alias.palette.hotOrange.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.hotOrange.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.10}"
}
}
},
"$description": "Step 90 in the palette Hot Orange scale.",
"name": "90",
"originalValue": "{alias.palette.hotOrange.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.hotOrange.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.hotOrange.5}"
}
}
},
"$description": "Step 95 in the palette Hot Orange scale.",
"name": "95",
"originalValue": "{alias.palette.hotOrange.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"indigo": {
"10": {
"$type": "color",
"$value": "{alias.palette.indigo.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.90}"
}
}
},
"$description": "Step 10 in the palette Indigo scale.",
"name": "10",
"originalValue": "{alias.palette.indigo.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.indigo.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.85}"
}
}
},
"$description": "Step 15 in the palette Indigo scale.",
"name": "15",
"originalValue": "{alias.palette.indigo.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.indigo.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.80}"
}
}
},
"$description": "Step 20 in the palette Indigo scale.",
"name": "20",
"originalValue": "{alias.palette.indigo.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.indigo.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.70}"
}
}
},
"$description": "Step 30 in the palette Indigo scale.",
"name": "30",
"originalValue": "{alias.palette.indigo.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.indigo.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.60}"
}
}
},
"$description": "Step 40 in the palette Indigo scale.",
"name": "40",
"originalValue": "{alias.palette.indigo.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.indigo.50}",
"$description": "Step 50 in the palette Indigo scale.",
"name": "50",
"originalValue": "{alias.palette.indigo.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.indigo.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.40}"
}
}
},
"$description": "Step 60 in the palette Indigo scale.",
"name": "60",
"originalValue": "{alias.palette.indigo.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.indigo.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.35}"
}
}
},
"$description": "Step 65 in the palette Indigo scale.",
"name": "65",
"originalValue": "{alias.palette.indigo.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.indigo.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.30}"
}
}
},
"$description": "Step 70 in the palette Indigo scale.",
"name": "70",
"originalValue": "{alias.palette.indigo.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.indigo.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.20}"
}
}
},
"$description": "Step 80 in the palette Indigo scale.",
"name": "80",
"originalValue": "{alias.palette.indigo.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.indigo.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.10}"
}
}
},
"$description": "Step 90 in the palette Indigo scale.",
"name": "90",
"originalValue": "{alias.palette.indigo.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.indigo.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.indigo.5}"
}
}
},
"$description": "Step 95 in the palette Indigo scale.",
"name": "95",
"originalValue": "{alias.palette.indigo.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"orange": {
"10": {
"$type": "color",
"$value": "{alias.palette.orange.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.90}"
}
}
},
"$description": "Step 10 in the palette Orange scale.",
"name": "10",
"originalValue": "{alias.palette.orange.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.orange.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.85}"
}
}
},
"$description": "Step 15 in the palette Orange scale.",
"name": "15",
"originalValue": "{alias.palette.orange.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.orange.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.80}"
}
}
},
"$description": "Step 20 in the palette Orange scale.",
"name": "20",
"originalValue": "{alias.palette.orange.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.orange.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.70}"
}
}
},
"$description": "Step 30 in the palette Orange scale.",
"name": "30",
"originalValue": "{alias.palette.orange.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.orange.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.60}"
}
}
},
"$description": "Step 40 in the palette Orange scale.",
"name": "40",
"originalValue": "{alias.palette.orange.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.orange.50}",
"$description": "Step 50 in the palette Orange scale.",
"name": "50",
"originalValue": "{alias.palette.orange.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.orange.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.40}"
}
}
},
"$description": "Step 60 in the palette Orange scale.",
"name": "60",
"originalValue": "{alias.palette.orange.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.orange.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.35}"
}
}
},
"$description": "Step 65 in the palette Orange scale.",
"name": "65",
"originalValue": "{alias.palette.orange.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.orange.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.30}"
}
}
},
"$description": "Step 70 in the palette Orange scale.",
"name": "70",
"originalValue": "{alias.palette.orange.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.orange.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.20}"
}
}
},
"$description": "Step 80 in the palette Orange scale.",
"name": "80",
"originalValue": "{alias.palette.orange.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.orange.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.10}"
}
}
},
"$description": "Step 90 in the palette Orange scale.",
"name": "90",
"originalValue": "{alias.palette.orange.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.orange.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.orange.5}"
}
}
},
"$description": "Step 95 in the palette Orange scale.",
"name": "95",
"originalValue": "{alias.palette.orange.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"pink": {
"10": {
"$type": "color",
"$value": "{alias.palette.pink.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.90}"
}
}
},
"$description": "Step 10 in the palette Pink scale.",
"name": "10",
"originalValue": "{alias.palette.pink.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.pink.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.85}"
}
}
},
"$description": "Step 15 in the palette Pink scale.",
"name": "15",
"originalValue": "{alias.palette.pink.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.pink.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.80}"
}
}
},
"$description": "Step 20 in the palette Pink scale.",
"name": "20",
"originalValue": "{alias.palette.pink.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.pink.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.70}"
}
}
},
"$description": "Step 30 in the palette Pink scale.",
"name": "30",
"originalValue": "{alias.palette.pink.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.pink.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.60}"
}
}
},
"$description": "Step 40 in the palette Pink scale.",
"name": "40",
"originalValue": "{alias.palette.pink.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.pink.50}",
"$description": "Step 50 in the palette Pink scale.",
"name": "50",
"originalValue": "{alias.palette.pink.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.pink.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.40}"
}
}
},
"$description": "Step 60 in the palette Pink scale.",
"name": "60",
"originalValue": "{alias.palette.pink.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.pink.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.35}"
}
}
},
"$description": "Step 65 in the palette Pink scale.",
"name": "65",
"originalValue": "{alias.palette.pink.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.pink.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.30}"
}
}
},
"$description": "Step 70 in the palette Pink scale.",
"name": "70",
"originalValue": "{alias.palette.pink.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.pink.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.20}"
}
}
},
"$description": "Step 80 in the palette Pink scale.",
"name": "80",
"originalValue": "{alias.palette.pink.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.pink.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.10}"
}
}
},
"$description": "Step 90 in the palette Pink scale.",
"name": "90",
"originalValue": "{alias.palette.pink.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.pink.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.pink.5}"
}
}
},
"$description": "Step 95 in the palette Pink scale.",
"name": "95",
"originalValue": "{alias.palette.pink.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"purple": {
"10": {
"$type": "color",
"$value": "{alias.palette.purple.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.90}"
}
}
},
"$description": "Step 10 in the palette Purple scale.",
"name": "10",
"originalValue": "{alias.palette.purple.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.purple.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.85}"
}
}
},
"$description": "Step 15 in the palette Purple scale.",
"name": "15",
"originalValue": "{alias.palette.purple.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.purple.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.80}"
}
}
},
"$description": "Step 20 in the palette Purple scale.",
"name": "20",
"originalValue": "{alias.palette.purple.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.purple.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.70}"
}
}
},
"$description": "Step 30 in the palette Purple scale.",
"name": "30",
"originalValue": "{alias.palette.purple.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.purple.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.60}"
}
}
},
"$description": "Step 40 in the palette Purple scale.",
"name": "40",
"originalValue": "{alias.palette.purple.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.purple.50}",
"$description": "Step 50 in the palette Purple scale.",
"name": "50",
"originalValue": "{alias.palette.purple.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.purple.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.40}"
}
}
},
"$description": "Step 60 in the palette Purple scale.",
"name": "60",
"originalValue": "{alias.palette.purple.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.purple.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.35}"
}
}
},
"$description": "Step 65 in the palette Purple scale.",
"name": "65",
"originalValue": "{alias.palette.purple.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.purple.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.30}"
}
}
},
"$description": "Step 70 in the palette Purple scale.",
"name": "70",
"originalValue": "{alias.palette.purple.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.purple.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.20}"
}
}
},
"$description": "Step 80 in the palette Purple scale.",
"name": "80",
"originalValue": "{alias.palette.purple.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.purple.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.10}"
}
}
},
"$description": "Step 90 in the palette Purple scale.",
"name": "90",
"originalValue": "{alias.palette.purple.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.purple.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.purple.5}"
}
}
},
"$description": "Step 95 in the palette Purple scale.",
"name": "95",
"originalValue": "{alias.palette.purple.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"red": {
"10": {
"$type": "color",
"$value": "{alias.palette.red.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.90}"
}
}
},
"$description": "Step 10 in the palette Red scale.",
"name": "10",
"originalValue": "{alias.palette.red.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.red.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.85}"
}
}
},
"$description": "Step 15 in the palette Red scale.",
"name": "15",
"originalValue": "{alias.palette.red.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.red.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.80}"
}
}
},
"$description": "Step 20 in the palette Red scale.",
"name": "20",
"originalValue": "{alias.palette.red.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.red.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.70}"
}
}
},
"$description": "Step 30 in the palette Red scale.",
"name": "30",
"originalValue": "{alias.palette.red.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.red.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.60}"
}
}
},
"$description": "Step 40 in the palette Red scale.",
"name": "40",
"originalValue": "{alias.palette.red.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.red.50}",
"$description": "Step 50 in the palette Red scale.",
"name": "50",
"originalValue": "{alias.palette.red.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.red.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.40}"
}
}
},
"$description": "Step 60 in the palette Red scale.",
"name": "60",
"originalValue": "{alias.palette.red.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.red.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.35}"
}
}
},
"$description": "Step 65 in the palette Red scale.",
"name": "65",
"originalValue": "{alias.palette.red.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.red.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.30}"
}
}
},
"$description": "Step 70 in the palette Red scale.",
"name": "70",
"originalValue": "{alias.palette.red.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.red.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.20}"
}
}
},
"$description": "Step 80 in the palette Red scale.",
"name": "80",
"originalValue": "{alias.palette.red.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.red.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.10}"
}
}
},
"$description": "Step 90 in the palette Red scale.",
"name": "90",
"originalValue": "{alias.palette.red.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.red.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.red.5}"
}
}
},
"$description": "Step 95 in the palette Red scale.",
"name": "95",
"originalValue": "{alias.palette.red.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"teal": {
"10": {
"$type": "color",
"$value": "{alias.palette.teal.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.90}"
}
}
},
"$description": "Step 10 in the palette Teal scale.",
"name": "10",
"originalValue": "{alias.palette.teal.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.teal.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.85}"
}
}
},
"$description": "Step 15 in the palette Teal scale.",
"name": "15",
"originalValue": "{alias.palette.teal.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.teal.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.80}"
}
}
},
"$description": "Step 20 in the palette Teal scale.",
"name": "20",
"originalValue": "{alias.palette.teal.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.teal.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.70}"
}
}
},
"$description": "Step 30 in the palette Teal scale.",
"name": "30",
"originalValue": "{alias.palette.teal.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.teal.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.60}"
}
}
},
"$description": "Step 40 in the palette Teal scale.",
"name": "40",
"originalValue": "{alias.palette.teal.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.teal.50}",
"$description": "Step 50 in the palette Teal scale.",
"name": "50",
"originalValue": "{alias.palette.teal.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.teal.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.40}"
}
}
},
"$description": "Step 60 in the palette Teal scale.",
"name": "60",
"originalValue": "{alias.palette.teal.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.teal.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.35}"
}
}
},
"$description": "Step 65 in the palette Teal scale.",
"name": "65",
"originalValue": "{alias.palette.teal.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.teal.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.30}"
}
}
},
"$description": "Step 70 in the palette Teal scale.",
"name": "70",
"originalValue": "{alias.palette.teal.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.teal.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.20}"
}
}
},
"$description": "Step 80 in the palette Teal scale.",
"name": "80",
"originalValue": "{alias.palette.teal.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.teal.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.10}"
}
}
},
"$description": "Step 90 in the palette Teal scale.",
"name": "90",
"originalValue": "{alias.palette.teal.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.teal.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.teal.5}"
}
}
},
"$description": "Step 95 in the palette Teal scale.",
"name": "95",
"originalValue": "{alias.palette.teal.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"violet": {
"10": {
"$type": "color",
"$value": "{alias.palette.violet.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.90}"
}
}
},
"$description": "Step 10 in the palette Violet scale.",
"name": "10",
"originalValue": "{alias.palette.violet.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.violet.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.85}"
}
}
},
"$description": "Step 15 in the palette Violet scale.",
"name": "15",
"originalValue": "{alias.palette.violet.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.violet.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.80}"
}
}
},
"$description": "Step 20 in the palette Violet scale.",
"name": "20",
"originalValue": "{alias.palette.violet.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.violet.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.70}"
}
}
},
"$description": "Step 30 in the palette Violet scale.",
"name": "30",
"originalValue": "{alias.palette.violet.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.violet.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.60}"
}
}
},
"$description": "Step 40 in the palette Violet scale.",
"name": "40",
"originalValue": "{alias.palette.violet.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.violet.50}",
"$description": "Step 50 in the palette Violet scale.",
"name": "50",
"originalValue": "{alias.palette.violet.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.violet.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.40}"
}
}
},
"$description": "Step 60 in the palette Violet scale.",
"name": "60",
"originalValue": "{alias.palette.violet.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.violet.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.35}"
}
}
},
"$description": "Step 65 in the palette Violet scale.",
"name": "65",
"originalValue": "{alias.palette.violet.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.violet.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.30}"
}
}
},
"$description": "Step 70 in the palette Violet scale.",
"name": "70",
"originalValue": "{alias.palette.violet.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.violet.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.20}"
}
}
},
"$description": "Step 80 in the palette Violet scale.",
"name": "80",
"originalValue": "{alias.palette.violet.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.violet.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.10}"
}
}
},
"$description": "Step 90 in the palette Violet scale.",
"name": "90",
"originalValue": "{alias.palette.violet.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.violet.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.violet.5}"
}
}
},
"$description": "Step 95 in the palette Violet scale.",
"name": "95",
"originalValue": "{alias.palette.violet.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"yellow": {
"10": {
"$type": "color",
"$value": "{alias.palette.yellow.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.90}"
}
}
},
"$description": "Step 10 in the palette Yellow scale.",
"name": "10",
"originalValue": "{alias.palette.yellow.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.yellow.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.85}"
}
}
},
"$description": "Step 15 in the palette Yellow scale.",
"name": "15",
"originalValue": "{alias.palette.yellow.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.yellow.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.80}"
}
}
},
"$description": "Step 20 in the palette Yellow scale.",
"name": "20",
"originalValue": "{alias.palette.yellow.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.yellow.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.70}"
}
}
},
"$description": "Step 30 in the palette Yellow scale.",
"name": "30",
"originalValue": "{alias.palette.yellow.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.yellow.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.60}"
}
}
},
"$description": "Step 40 in the palette Yellow scale.",
"name": "40",
"originalValue": "{alias.palette.yellow.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.yellow.50}",
"$description": "Step 50 in the palette Yellow scale.",
"name": "50",
"originalValue": "{alias.palette.yellow.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.yellow.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.40}"
}
}
},
"$description": "Step 60 in the palette Yellow scale.",
"name": "60",
"originalValue": "{alias.palette.yellow.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.yellow.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.35}"
}
}
},
"$description": "Step 65 in the palette Yellow scale.",
"name": "65",
"originalValue": "{alias.palette.yellow.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.yellow.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.30}"
}
}
},
"$description": "Step 70 in the palette Yellow scale.",
"name": "70",
"originalValue": "{alias.palette.yellow.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.yellow.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.20}"
}
}
},
"$description": "Step 80 in the palette Yellow scale.",
"name": "80",
"originalValue": "{alias.palette.yellow.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.yellow.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.10}"
}
}
},
"$description": "Step 90 in the palette Yellow scale.",
"name": "90",
"originalValue": "{alias.palette.yellow.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.yellow.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.yellow.5}"
}
}
},
"$description": "Step 95 in the palette Yellow scale.",
"name": "95",
"originalValue": "{alias.palette.yellow.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"surface": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.100}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.15}"
}
}
},
"$description": "Color surface used for page backgrounds.",
"name": "1",
"originalValue": "{alias.palette.neutral.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.neutral.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.10}"
}
}
},
"$description": "Color surface used for darker page backgrounds.",
"name": "2",
"originalValue": "{alias.palette.neutral.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"3": {
"$type": "color",
"$value": "{alias.palette.neutral.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.20}"
}
}
},
"$description": "Color surface used for containers.",
"name": "3",
"originalValue": "{alias.palette.neutral.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"container": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.100}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.15}"
}
}
},
"$description": "Default container background fill for components such as cards and modals.",
"name": "1",
"originalValue": "{alias.palette.neutral.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.neutral.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.10}"
}
}
},
"$description": "Darker color for container background fill for components.",
"name": "2",
"originalValue": "{alias.palette.neutral.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"3": {
"$type": "color",
"$value": "{alias.palette.neutral.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.20}"
}
}
},
"$description": "Darkest color for container background fill for components.",
"name": "3",
"originalValue": "{alias.palette.neutral.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"inverse": {
"1": {
"$type": "color",
"$value": "{alias.palette.blue.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.80}"
}
}
},
"$description": "Inverse color container background fill for components. Always pair with on-surface-inverse-1.",
"name": "1",
"originalValue": "{alias.palette.blue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.blue.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.70}"
}
}
},
"$description": "Inverse darker color container background fill for components. Always pair with on-surface-inverse-2.",
"name": "2",
"originalValue": "{alias.palette.blue.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
}
}
},
"inverse": {
"1": {
"$type": "color",
"$value": "{alias.palette.blue.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.80}"
}
}
},
"$description": "Inverse page background. Always pair with on-surface-inverse-1.",
"name": "1",
"originalValue": "{alias.palette.blue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.blue.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.90}"
}
}
},
"$description": "Darker inverse page background. Always pair with on-surface-inverse-2.",
"name": "2",
"originalValue": "{alias.palette.blue.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
}
}
},
"on": {
"accent": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.100}",
"$description": "Text and icon fill color displayed on branded containers. Always pair with on-accent-container-1.",
"name": "1",
"originalValue": "{alias.palette.neutral.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.neutral.100}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.40}"
}
}
},
"$description": "Text and icon fill color displayed on branded containers. Always pair with on-accent-container-2.",
"name": "2",
"originalValue": "{alias.palette.neutral.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"3": {
"$type": "color",
"$value": "{alias.palette.neutral.100}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.30}"
}
}
},
"$description": "Text and icon fill color displayed on branded containers. Always pair with on-accent-container-3.",
"name": "3",
"originalValue": "{alias.palette.neutral.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
}
},
"surface": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.70}"
}
}
},
"$description": "Lightest text and icon fill. Used for body text, placeholder text, field labels, sub-headings, and taglines.",
"name": "1",
"originalValue": "{alias.palette.neutral.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.neutral.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.90}"
}
}
},
"$description": "Darker text and icon fills used for secondary and tertiary headings, dark body copy, and filled input fields.",
"name": "2",
"originalValue": "{alias.palette.neutral.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"3": {
"$type": "color",
"$value": "{alias.palette.blue.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.90}"
}
}
},
"$description": "Darkest text and icon fill used for title and pages or components.",
"name": "3",
"originalValue": "{alias.palette.blue.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"inverse": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.100}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.10}"
}
}
},
"$description": "Lightest text and icon fill on dark backgrounds. Always pair with surface-inverse-1 or surface-container-inverse-1.",
"name": "1",
"originalValue": "{alias.palette.neutral.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.electricBlue.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.electricBlue.20}"
}
}
},
"$description": "Darker text and icon fill on dark backgrounds (50 to 100). Always pair with surface-inverse-2 or surface-container-inverse-2.",
"name": "2",
"originalValue": "{alias.palette.electricBlue.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
}
}
},
"info": {
"1": {
"$type": "color",
"$value": "{slds.r.color.info.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.90}"
}
}
},
"$description": "Step 1 in the On Info scale for colors that define the on info colors.",
"name": "1",
"originalValue": "{slds.r.color.info.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
}
},
"success": {
"1": {
"$type": "color",
"$value": "{slds.r.color.success.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.90}"
}
}
},
"$description": "Step 1 in the On Success scale for colors that define the on success colors.",
"name": "1",
"originalValue": "{slds.r.color.success.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"2": {
"$type": "color",
"$value": "{slds.r.color.success.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.95}"
}
}
},
"$description": "Step 2 in the On Success scale for colors that define the on success colors.",
"name": "2",
"originalValue": "{slds.r.color.success.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
}
},
"warning": {
"1": {
"$type": "color",
"$value": "{slds.r.color.warning.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.90}"
}
}
},
"$description": "Step 1 in the On Warning scale.",
"name": "1",
"originalValue": "{slds.r.color.warning.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
}
},
"error": {
"1": {
"$type": "color",
"$value": "{slds.r.color.error.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.90}"
}
}
},
"$description": "Fill color for text and icons displayed within an error container. Always pair with error-container-1.",
"name": "1",
"originalValue": "{slds.r.color.error.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"2": {
"$type": "color",
"$value": "{slds.r.color.error.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.95}"
}
}
},
"$description": "Fill color for text and icons displayed within an error container. Always pair with error-container-2.",
"name": "2",
"originalValue": "{slds.r.color.error.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
}
},
"disabled": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.50}",
"$description": "Fill color for text and icons displayed within disabled-container-1 (netural-100). Always pair with disabled-container-1.",
"name": "1",
"originalValue": "{alias.palette.neutral.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.neutral.50}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.60}"
}
}
},
"$description": "Fill color for text and icons displayed within disabled-container-2 (neutral-80). Always pair with disabled-container-2.",
"name": "2",
"originalValue": "{alias.palette.neutral.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"color",
"fill"
]
}
}
},
"border": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.30}"
}
}
},
"$description": "Borders for decorative components or divider lines between content.",
"name": "1",
"originalValue": "{alias.palette.neutral.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.neutral.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.50}"
}
}
},
"$description": "Border for functional or interactive components.",
"name": "2",
"originalValue": "{alias.palette.neutral.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
},
"accent": {
"1": {
"$type": "color",
"$value": "{slds.r.color.brand.50}",
"$description": "Border color for branded containers.",
"name": "1",
"originalValue": "{slds.r.color.brand.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
},
"2": {
"$type": "color",
"$value": "{slds.r.color.brand.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.70}"
}
}
},
"$description": "Border color for branded containers.",
"name": "2",
"originalValue": "{slds.r.color.brand.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
},
"3": {
"$type": "color",
"$value": "{slds.r.color.brand.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.80}"
}
}
},
"$description": "Hover border color for branded containers.",
"name": "3",
"originalValue": "{slds.r.color.brand.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
}
},
"inverse": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.10}"
}
}
},
"$description": "Border for functional or interactive components on dark backgrounds.",
"name": "1",
"originalValue": "{alias.palette.neutral.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.blue.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.blue.80}"
}
}
},
"$description": "Borders for decorative components or divider lines between content on dark backgrounds.",
"name": "2",
"originalValue": "{alias.palette.blue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
}
},
"success": {
"1": {
"$type": "color",
"$value": "{slds.g.color.success.base.40}",
"$description": "Step 1 in the Border Success scale for colors that define the borders of success containers.",
"name": "1",
"originalValue": "{slds.g.color.success.base.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
},
"2": {
"$type": "color",
"$value": "{slds.g.color.success.base.30}",
"$description": "Step 2 in the Border Success scale for colors that define the borders of success containers.",
"name": "2",
"originalValue": "{slds.g.color.success.base.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
}
},
"warning": {
"1": {
"$type": "color",
"$value": "{slds.r.color.warning.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.70}"
}
}
},
"$description": "Step 1 in the Border Warning scale for colors that define the borders of warning containers.",
"name": "1",
"originalValue": "{slds.r.color.warning.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
}
},
"error": {
"1": {
"$type": "color",
"$value": "{slds.r.color.error.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.70}"
}
}
},
"$description": "Border color for error containers such as destructive buttons.",
"name": "1",
"originalValue": "{slds.r.color.error.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
},
"2": {
"$type": "color",
"$value": "{slds.r.color.error.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.80}"
}
}
},
"$description": "Hover border color for error containers such as destructive buttons.",
"name": "2",
"originalValue": "{slds.r.color.error.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
}
},
"disabled": {
"1": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.50}",
"$description": "Border color for disabled containers (border-2 becomes border-disabled-1 for disabled states).",
"name": "1",
"originalValue": "{slds.g.color.neutral.base.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
},
"2": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.40}",
"$description": "Border color for disabled UI elements. This is one step darker than disabled-border-1.",
"name": "2",
"originalValue": "{slds.g.color.neutral.base.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-color"
]
}
}
},
"accent": {
"1": {
"$type": "color",
"$value": "{slds.r.color.brand.50}",
"$description": "Emphasis color for large text and icon fills.",
"name": "1",
"originalValue": "{slds.r.color.brand.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"2": {
"$type": "color",
"$value": "{slds.r.color.brand.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.70}"
}
}
},
"$description": "Emphasis color for text, links, and icon color fills. Hover state color for interactive elements.",
"name": "2",
"originalValue": "{slds.r.color.brand.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"3": {
"$type": "color",
"$value": "{slds.r.color.brand.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.80}"
}
}
},
"$description": "Emphasis color for text, links, and icon alternative colors. Hover state color for interactive elements.",
"name": "3",
"originalValue": "{slds.r.color.brand.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"container": {
"1": {
"$type": "color",
"$value": "{slds.r.color.brand.50}",
"$description": "Background fill for containers that emphasize branded component and interactive elements such as Brand buttons. Always pair with on-accent-1.",
"name": "1",
"originalValue": "{slds.r.color.brand.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"2": {
"$type": "color",
"$value": "{slds.r.color.brand.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.90}"
}
}
},
"$description": "Background fill on hover state for containers that emphasize branded component and interactive elements such as Brand buttons. Always pair with on-accent-2.",
"name": "2",
"originalValue": "{slds.r.color.brand.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"3": {
"$type": "color",
"$value": "{slds.r.color.brand.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.80}"
}
}
},
"$description": "Alternative background fill on hover state for containers that emphasize branded component and interactive elements such as Brand buttons. Always pair with on-accent-3.",
"name": "3",
"originalValue": "{slds.r.color.brand.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
}
},
"light": {
"1": {
"$type": "color",
"$value": "{alias.palette.electricBlue.95}",
"$deprecated": true,
"$description": "Color Accent Light 1.",
"name": "1",
"originalValue": "{alias.palette.electricBlue.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.electricBlue.90}",
"$deprecated": true,
"$description": "Color Accent Light 2.",
"name": "2",
"originalValue": "{alias.palette.electricBlue.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"dark": {
"1": {
"$type": "color",
"$value": "{alias.palette.electricBlue.20}",
"$deprecated": true,
"$description": "Color Accent Dark 1.",
"name": "1",
"originalValue": "{alias.palette.electricBlue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.electricBlue.10}",
"$deprecated": true,
"$description": "Color Accent Dark 2.",
"name": "2",
"originalValue": "{alias.palette.electricBlue.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"error": {
"1": {
"$type": "color",
"$value": "{slds.r.color.error.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.70}"
}
}
},
"$description": "Fill color for text and icons displaying an error.",
"name": "1",
"originalValue": "{slds.r.color.error.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"container": {
"1": {
"$type": "color",
"$value": "{slds.r.color.error.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.30}"
}
}
},
"$description": "Container background fill for error components such as toast or alerts. Always pair with on-error-1.",
"name": "1",
"originalValue": "{slds.r.color.error.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"2": {
"$type": "color",
"$value": "{slds.r.color.error.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.40}"
}
}
},
"$description": "Container background fill for error components such as destructive buttons. Always pair with on-error-2.",
"name": "2",
"originalValue": "{slds.r.color.error.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
}
},
"base": {
"10": {
"$type": "color",
"$value": "{slds.r.color.error.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.90}"
}
}
},
"$description": "Step 10 in the Error color scale.",
"name": "10",
"originalValue": "{slds.r.color.error.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{slds.r.color.error.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.85}"
}
}
},
"$description": "Error Base 15 - if used as a background, please use Error Base 100-65 to meet accessibility guidelines.",
"name": "15",
"originalValue": "{slds.r.color.error.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{slds.r.color.error.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.80}"
}
}
},
"$description": "Step 20 in the Error color scale.",
"name": "20",
"originalValue": "{slds.r.color.error.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{slds.r.color.error.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.70}"
}
}
},
"$description": "Step 30 in the Error color scale.",
"name": "30",
"originalValue": "{slds.r.color.error.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{slds.r.color.error.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.60}"
}
}
},
"$description": "Step 40 in the Error color scale.",
"name": "40",
"originalValue": "{slds.r.color.error.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"45": {
"$type": "color",
"$value": "{slds.r.color.error.45}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.55}"
}
}
},
"$description": "Error Base 45 - if used as a background, please use Error Base 100-80 to meet accessibility guidelines.",
"name": "45",
"originalValue": "{slds.r.color.error.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{slds.r.color.error.50}",
"$description": "Step 50 in the Error color scale.",
"name": "50",
"originalValue": "{slds.r.color.error.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"55": {
"$type": "color",
"$value": "{slds.r.color.error.55}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.45}"
}
}
},
"$description": "Error Base 55 - if used as a background, please use Error Base 100-90 to meet accessibility guidelines.",
"name": "55",
"originalValue": "{slds.r.color.error.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{slds.r.color.error.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.40}"
}
}
},
"$description": "Step 60 in the Error color scale.",
"name": "60",
"originalValue": "{slds.r.color.error.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{slds.r.color.error.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.35}"
}
}
},
"$description": "Error Base 65 - if used as a background, please use Error Base 20-10 to meet accessibility guidelines.",
"name": "65",
"originalValue": "{slds.r.color.error.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{slds.r.color.error.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.30}"
}
}
},
"$description": "Step 70 in the Error color scale.",
"name": "70",
"originalValue": "{slds.r.color.error.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{slds.r.color.error.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.20}"
}
}
},
"$description": "Step 80 in the Error color scale.",
"name": "80",
"originalValue": "{slds.r.color.error.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{slds.r.color.error.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.10}"
}
}
},
"$description": "Step 90 in the Error color scale.",
"name": "90",
"originalValue": "{slds.r.color.error.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{slds.r.color.error.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.error.5}"
}
}
},
"$description": "Step 95 in the Error color scale.",
"name": "95",
"originalValue": "{slds.r.color.error.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"100": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.100}",
"$deprecated": true,
"$description": "Step 100 in the Error color scale.",
"name": "100",
"originalValue": "{slds.g.color.neutral.base.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "100",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"warning": {
"1": {
"$type": "color",
"$value": "{slds.r.color.warning.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.70}"
}
}
},
"$description": "Color Warning 1.",
"name": "1",
"originalValue": "{slds.r.color.warning.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"container": {
"1": {
"$type": "color",
"$value": "{slds.r.color.warning.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.30}"
}
}
},
"$description": "Color Warning Container 1.",
"name": "1",
"originalValue": "{slds.r.color.warning.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
}
},
"base": {
"10": {
"$type": "color",
"$value": "{slds.r.color.warning.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.90}"
}
}
},
"$description": "Step 10 in the Warning color scale.",
"name": "10",
"originalValue": "{slds.r.color.warning.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{slds.r.color.warning.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.85}"
}
}
},
"$description": "Warning Base 15 - if used as a background, please use Warning Base 100-50 to meet accessibility guidelines.",
"name": "15",
"originalValue": "{slds.r.color.warning.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{slds.r.color.warning.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.80}"
}
}
},
"$description": "Step 20 in the Warning color scale.",
"name": "20",
"originalValue": "{slds.r.color.warning.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{slds.r.color.warning.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.70}"
}
}
},
"$description": "Step 30 in the Warning color scale.",
"name": "30",
"originalValue": "{slds.r.color.warning.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{slds.r.color.warning.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.60}"
}
}
},
"$description": "Step 40 in the Warning color scale.",
"name": "40",
"originalValue": "{slds.r.color.warning.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"45": {
"$type": "color",
"$value": "{slds.r.color.warning.45}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.55}"
}
}
},
"$description": "Warning Base 45 - if used as a background, please use Warning Base 100-80 to meet accessibility guidelines.",
"name": "45",
"originalValue": "{slds.r.color.warning.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{slds.r.color.warning.50}",
"$description": "Step 50 in the Warning color scale.",
"name": "50",
"originalValue": "{slds.r.color.warning.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"55": {
"$type": "color",
"$value": "{slds.r.color.warning.55}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.45}"
}
}
},
"$description": "Warning Base 55 - if used as a background, please use Warning Base 100-90 to meet accessibility guidelines.",
"name": "55",
"originalValue": "{slds.r.color.warning.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{slds.r.color.warning.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.40}"
}
}
},
"$description": "Step 60 in the Warning color scale.",
"name": "60",
"originalValue": "{slds.r.color.warning.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{slds.r.color.warning.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.35}"
}
}
},
"$description": "Warning Base 65 - if used as a background, please use Warning Base 20-10 to meet accessibility guidelines.",
"name": "65",
"originalValue": "{slds.r.color.warning.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{slds.r.color.warning.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.30}"
}
}
},
"$description": "Step 70 in the Warning color scale.",
"name": "70",
"originalValue": "{slds.r.color.warning.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{slds.r.color.warning.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.20}"
}
}
},
"$description": "Step 80 in the Warning color scale.",
"name": "80",
"originalValue": "{slds.r.color.warning.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{slds.r.color.warning.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.10}"
}
}
},
"$description": "Step 90 in the Warning color scale.",
"name": "90",
"originalValue": "{slds.r.color.warning.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{slds.r.color.warning.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.warning.5}"
}
}
},
"$description": "Step 95 in the Warning color scale.",
"name": "95",
"originalValue": "{slds.r.color.warning.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"100": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.100}",
"$deprecated": true,
"$description": "Step 100 in the Warning color scale.",
"name": "100",
"originalValue": "{slds.g.color.neutral.base.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "100",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"success": {
"1": {
"$type": "color",
"$value": "{slds.r.color.success.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.70}"
}
}
},
"$description": "Color Success 1.",
"name": "1",
"originalValue": "{slds.r.color.success.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"container": {
"1": {
"$type": "color",
"$value": "{slds.r.color.success.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.30}"
}
}
},
"$description": "Color Success Container 1.",
"name": "1",
"originalValue": "{slds.r.color.success.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"2": {
"$type": "color",
"$value": "{slds.r.color.success.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.40}"
}
}
},
"$description": "Color Success Container 2.",
"name": "2",
"originalValue": "{slds.r.color.success.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
}
},
"base": {
"10": {
"$type": "color",
"$value": "{slds.r.color.success.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.90}"
}
}
},
"$description": "Step 10 in the Success color scale.",
"name": "10",
"originalValue": "{slds.r.color.success.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{slds.r.color.success.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.85}"
}
}
},
"$description": "Success Base 15 - if used as a background, please use Success Base 100-65 to meet accessibility guidelines.",
"name": "15",
"originalValue": "{slds.r.color.success.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{slds.r.color.success.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.80}"
}
}
},
"$description": "Step 20 in the Success color scale.",
"name": "20",
"originalValue": "{slds.r.color.success.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{slds.r.color.success.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.70}"
}
}
},
"$description": "Step 30 in the Success color scale.",
"name": "30",
"originalValue": "{slds.r.color.success.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{slds.r.color.success.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.60}"
}
}
},
"$description": "Step 40 in the Success color scale.",
"name": "40",
"originalValue": "{slds.r.color.success.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"45": {
"$type": "color",
"$value": "{slds.r.color.success.45}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.55}"
}
}
},
"$description": "Success Base 45 - if used as a background, please use Success Base 100-80 to meet accessibility guidelines.",
"name": "45",
"originalValue": "{slds.r.color.success.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{slds.r.color.success.50}",
"$description": "Step 50 in the Success color scale.",
"name": "50",
"originalValue": "{slds.r.color.success.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"55": {
"$type": "color",
"$value": "{slds.r.color.success.55}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.45}"
}
}
},
"$description": "Success Base 55 - if used as a background, please use Success Base 100-90 to meet accessibility guidelines.",
"name": "55",
"originalValue": "{slds.r.color.success.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{slds.r.color.success.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.40}"
}
}
},
"$description": "Step 60 in the Success color scale.",
"name": "60",
"originalValue": "{slds.r.color.success.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{slds.r.color.success.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.35}"
}
}
},
"$description": "Success Base 65 - if used as a background, please use Success Base 20-10 to meet accessibility guidelines.",
"name": "65",
"originalValue": "{slds.r.color.success.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{slds.r.color.success.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.30}"
}
}
},
"$description": "Step 70 in the Success color scale.",
"name": "70",
"originalValue": "{slds.r.color.success.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{slds.r.color.success.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.20}"
}
}
},
"$description": "Step 80 in the Success color scale.",
"name": "80",
"originalValue": "{slds.r.color.success.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{slds.r.color.success.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.10}"
}
}
},
"$description": "Step 90 in the Success color scale.",
"name": "90",
"originalValue": "{slds.r.color.success.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{slds.r.color.success.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.success.5}"
}
}
},
"$description": "Step 95 in the Success color scale.",
"name": "95",
"originalValue": "{slds.r.color.success.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"100": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.100}",
"$deprecated": true,
"$description": "Step 100 in the Success color scale.",
"name": "100",
"originalValue": "{slds.g.color.neutral.base.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "100",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"info": {
"1": {
"$type": "color",
"$value": "{slds.r.color.info.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.70}"
}
}
},
"$description": "Step 1 in the Info scale for colors that define the info colors.",
"name": "1",
"originalValue": "{slds.r.color.info.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"container": {
"1": {
"$type": "color",
"$value": "{slds.r.color.info.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.30}"
}
}
},
"$description": "Step 1 in the Info Container scale for colors that define the info containers.",
"name": "1",
"originalValue": "{slds.r.color.info.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
}
},
"base": {
"10": {
"$type": "color",
"$value": "{slds.r.color.info.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.90}"
}
}
},
"$description": "Info Base 10 - if used as a background, please use Info Base 100-65 to meet accessibility guidelines.",
"name": "10",
"originalValue": "{slds.r.color.info.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{slds.r.color.info.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.85}"
}
}
},
"$description": "Info Base 15 - if used as a background, please use Info Base 100-65 to meet accessibility guidelines.",
"name": "15",
"originalValue": "{slds.r.color.info.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{slds.r.color.info.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.80}"
}
}
},
"$description": "Info Base 20 - if used as a background, please use Info Base 100-70 to meet accessibility guidelines.",
"name": "20",
"originalValue": "{slds.r.color.info.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{slds.r.color.info.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.70}"
}
}
},
"$description": "Info Base 30 - if used as a background, please use Info Base 100-80 to meet accessibility guidelines.",
"name": "30",
"originalValue": "{slds.r.color.info.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"35": {
"$type": "color",
"$value": "{slds.r.color.info.35}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.65}"
}
}
},
"$description": "Info Base 35 - if used as a background, please use Info Base 100-80 to meet accessibility guidelines.",
"name": "35",
"originalValue": "{slds.r.color.info.35}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "35",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{slds.r.color.info.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.60}"
}
}
},
"$description": "Info Base 40 - if used as a background, please use Info Base 100-90 to meet accessibility guidelines.",
"name": "40",
"originalValue": "{slds.r.color.info.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"45": {
"$type": "color",
"$value": "{slds.r.color.info.45}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.55}"
}
}
},
"$description": "Info Base 45 - if used as a background, please use Info Base 100-90 to meet accessibility guidelines.",
"name": "45",
"originalValue": "{slds.r.color.info.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{slds.r.color.info.50}",
"$description": "Info Base 50 - if used as a background, please use Info Base 100-95 to meet accessibility guidelines.",
"name": "50",
"originalValue": "{slds.r.color.info.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"55": {
"$type": "color",
"$value": "{slds.r.color.info.55}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.45}"
}
}
},
"$description": "Info Base 55 - if used as a background, please use Info Base 100-95 to meet accessibility guidelines.",
"name": "55",
"originalValue": "{slds.r.color.info.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{slds.r.color.info.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.40}"
}
}
},
"$description": "Info Base 60 - if used as a background, please use Info Base 100 to meet accessibility guidelines.",
"name": "60",
"originalValue": "{slds.r.color.info.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{slds.r.color.info.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.35}"
}
}
},
"$description": "Info Base 65 - if used as a background, please use Info Base 15-10 to meet accessibility guidelines.",
"name": "65",
"originalValue": "{slds.r.color.info.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{slds.r.color.info.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.30}"
}
}
},
"$description": "Info Base 70 - if used as a background, please use Info Base 20-10 to meet accessibility guidelines.",
"name": "70",
"originalValue": "{slds.r.color.info.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{slds.r.color.info.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.20}"
}
}
},
"$description": "Info Base 80 - if used as a background, please use Info Base 30-10 to meet accessibility guidelines.",
"name": "80",
"originalValue": "{slds.r.color.info.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{slds.r.color.info.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.10}"
}
}
},
"$description": "Info Base 90 - if used as a background, please use Info Base 40-10 to meet accessibility guidelines.",
"name": "90",
"originalValue": "{slds.r.color.info.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{slds.r.color.info.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.info.5}"
}
}
},
"$description": "Info Base 95 - if used as a background, please use Info Base 50-10 to meet accessibility guidelines.",
"name": "95",
"originalValue": "{slds.r.color.info.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"100": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.100}",
"$deprecated": true,
"$description": "Info Base 100 - if used as a background, please use Info Base 60-10 to meet accessibility guidelines.",
"name": "100",
"originalValue": "{slds.g.color.neutral.base.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "100",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"disabled": {
"1": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.50}",
"$description": "Fill color fo text and icons in disabled components or with disabled content.",
"name": "1",
"originalValue": "{slds.g.color.neutral.base.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"2": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.40}",
"$description": "Color denoting disabled UI elements. This is one step darker than disabled-1.",
"name": "2",
"originalValue": "{slds.g.color.neutral.base.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color",
"fill",
"color"
]
},
"container": {
"1": {
"$type": "color",
"$value": "{alias.palette.neutral.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.20}"
}
}
},
"$description": "Disabled container background fill for white components. Always pair with on-disabled-1.",
"name": "1",
"originalValue": "{alias.palette.neutral.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
},
"2": {
"$type": "color",
"$value": "{alias.palette.neutral.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.30}"
}
}
},
"$description": "Disabled container background fill for grey components. Always pair with on-disabled-2.",
"name": "2",
"originalValue": "{alias.palette.neutral.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background",
"background-color"
]
}
}
},
"neutral": {
"base": {
"0": {
"$type": "color",
"$value": "{alias.palette.neutral.0}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.100}"
}
}
},
"$description": "Step 0 in the Neutral color scale.",
"name": "0",
"originalValue": "{alias.palette.neutral.0}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "0",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"10": {
"$type": "color",
"$value": "{alias.palette.neutral.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.90}"
}
}
},
"$description": "Step 10 in the Neutral color scale.",
"name": "10",
"originalValue": "{alias.palette.neutral.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.neutral.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.85}"
}
}
},
"$description": "Step 15 in the Neutral color scale.",
"name": "15",
"originalValue": "{alias.palette.neutral.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.neutral.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.80}"
}
}
},
"$description": "Step 20 in the Neutral color scale.",
"name": "20",
"originalValue": "{alias.palette.neutral.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.neutral.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.70}"
}
}
},
"$description": "Step 30 in the Neutral color scale.",
"name": "30",
"originalValue": "{alias.palette.neutral.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.neutral.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.60}"
}
}
},
"$description": "Step 40 in the Neutral color scale.",
"name": "40",
"originalValue": "{alias.palette.neutral.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"45": {
"$type": "color",
"$value": "{alias.palette.neutral.45}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.55}"
}
}
},
"$description": "Neutral Base 45 - if used as a background, please use Neutral Base 100-90 to meet accessibility guidelines.",
"name": "45",
"originalValue": "{alias.palette.neutral.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.neutral.50}",
"$description": "Step 50 in the Neutral color scale.",
"name": "50",
"originalValue": "{alias.palette.neutral.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"55": {
"$type": "color",
"$value": "{alias.palette.neutral.55}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.45}"
}
}
},
"$description": "Neutral Base 55 - if used as a background, please use Neutral Base 100-95 to meet accessibility guidelines.",
"name": "55",
"originalValue": "{alias.palette.neutral.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.neutral.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.40}"
}
}
},
"$description": "Step 60 in the Neutral color scale.",
"name": "60",
"originalValue": "{alias.palette.neutral.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.neutral.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.35}"
}
}
},
"$description": "Step 65 in the Neutral color scale.",
"name": "65",
"originalValue": "{alias.palette.neutral.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.neutral.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.30}"
}
}
},
"$description": "Step 70 in the Neutral color scale.",
"name": "70",
"originalValue": "{alias.palette.neutral.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.neutral.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.20}"
}
}
},
"$description": "Step 80 in the Neutral color scale.",
"name": "80",
"originalValue": "{alias.palette.neutral.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.neutral.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.10}"
}
}
},
"$description": "Step 90 in the Neutral color scale.",
"name": "90",
"originalValue": "{alias.palette.neutral.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.neutral.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.5}"
}
}
},
"$description": "Step 95 in the Neutral color scale.",
"name": "95",
"originalValue": "{alias.palette.neutral.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"100": {
"$type": "color",
"$value": "{alias.palette.neutral.100}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{alias.palette.neutral.0}"
}
}
},
"$description": "Step 100 in the Neutral color scale.",
"name": "100",
"originalValue": "{alias.palette.neutral.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "100",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"brand": {
"base": {
"10": {
"$type": "color",
"$value": "{slds.r.color.brand.10}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.90}"
}
}
},
"$description": "Step 10 in the Brand color scale.",
"name": "10",
"originalValue": "{slds.r.color.brand.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"15": {
"$type": "color",
"$value": "{slds.r.color.brand.15}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.85}"
}
}
},
"$description": "Step 15 in the Brand color scale.",
"name": "15",
"originalValue": "{slds.r.color.brand.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"20": {
"$type": "color",
"$value": "{slds.r.color.brand.20}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.80}"
}
}
},
"$description": "Step 20 in the Brand color scale.",
"name": "20",
"originalValue": "{slds.r.color.brand.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"30": {
"$type": "color",
"$value": "{slds.r.color.brand.30}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.70}"
}
}
},
"$description": "Step 30 in the Brand color scale.",
"name": "30",
"originalValue": "{slds.r.color.brand.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"40": {
"$type": "color",
"$value": "{slds.r.color.brand.40}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.60}"
}
}
},
"$description": "Step 40 in the Brand color scale.",
"name": "40",
"originalValue": "{slds.r.color.brand.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"45": {
"$type": "color",
"$value": "{slds.r.color.brand.45}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.55}"
}
}
},
"$description": "Brand Base 45 - if used as a background, please use Brand Base 100-90 to meet accessibility guidelines.",
"name": "45",
"originalValue": "{slds.r.color.brand.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"50": {
"$type": "color",
"$value": "{slds.r.color.brand.50}",
"$description": "Step 50 in the Brand color scale.",
"name": "50",
"originalValue": "{slds.r.color.brand.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"55": {
"$type": "color",
"$value": "{slds.r.color.brand.55}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.45}"
}
}
},
"$description": "Brand Base 55 - if used as a background, please use Brand Base 100-95 to meet accessibility guidelines.",
"name": "55",
"originalValue": "{slds.r.color.brand.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"60": {
"$type": "color",
"$value": "{slds.r.color.brand.60}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.40}"
}
}
},
"$description": "Step 60 in the Brand color scale.",
"name": "60",
"originalValue": "{slds.r.color.brand.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"65": {
"$type": "color",
"$value": "{slds.r.color.brand.65}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.35}"
}
}
},
"$description": "Step 65 in the Brand color scale.",
"name": "65",
"originalValue": "{slds.r.color.brand.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"70": {
"$type": "color",
"$value": "{slds.r.color.brand.70}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.30}"
}
}
},
"$description": "Step 70 in the Brand color scale.",
"name": "70",
"originalValue": "{slds.r.color.brand.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"80": {
"$type": "color",
"$value": "{slds.r.color.brand.80}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.20}"
}
}
},
"$description": "Step 80 in the Brand color scale.",
"name": "80",
"originalValue": "{slds.r.color.brand.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"90": {
"$type": "color",
"$value": "{slds.r.color.brand.90}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.10}"
}
}
},
"$description": "Step 90 in the Brand color scale.",
"name": "90",
"originalValue": "{slds.r.color.brand.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"95": {
"$type": "color",
"$value": "{slds.r.color.brand.95}",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "{slds.r.color.brand.5}"
}
}
},
"$description": "Step 95 in the Brand color scale.",
"name": "95",
"originalValue": "{slds.r.color.brand.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"100": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.100}",
"$deprecated": true,
"$description": "Step 100 in the Brand color scale.",
"name": "100",
"originalValue": "{slds.g.color.neutral.base.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "100",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
}
},
"shadow": {
"1": {
"$type": "shadow",
"$value": "0px 0px 2px 0px light-dark(#0000002e, #0000005c), 0px 2px 2px 0px light-dark(#0000002e, #0000005c), 0px -1px 2px 0px light-dark(#0000001a, #00000033)",
"$description": "Shadow 1.",
"name": "1",
"originalValue": "0px 0px 2px 0px light-dark(#0000002e, #0000005c), 0px 2px 2px 0px light-dark(#0000002e, #0000005c), 0px -1px 2px 0px light-dark(#0000001a, #00000033)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "0px 0px 5px 0px light-dark(#00000029, #00000052), 0px 3px 3px 0px light-dark(#00000029, #00000052), 0px -1px 2px 0px light-dark(#00000017, #0000002e)",
"$description": "Shadow 2.",
"name": "2",
"originalValue": "0px 0px 5px 0px light-dark(#00000029, #00000052), 0px 3px 3px 0px light-dark(#00000029, #00000052), 0px -1px 2px 0px light-dark(#00000017, #0000002e)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "0px 0px 7px 0px light-dark(#00000024, #00000047), 0px 5px 5px 0px light-dark(#00000024, #00000047), 0px -1px 2px 0px light-dark(#00000014, #00000029)",
"$description": "Shadow 3.",
"name": "3",
"originalValue": "0px 0px 7px 0px light-dark(#00000024, #00000047), 0px 5px 5px 0px light-dark(#00000024, #00000047), 0px -1px 2px 0px light-dark(#00000014, #00000029)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "0px 0px 10px 0px light-dark(#0000001f, #0000003d), 0px 7px 7px 0px light-dark(#0000001f, #0000003d), 0px -1px 3px 0px light-dark(#00000012, #00000024)",
"$description": "Shadow 4.",
"name": "4",
"originalValue": "0px 0px 10px 0px light-dark(#0000001f, #0000003d), 0px 7px 7px 0px light-dark(#0000001f, #0000003d), 0px -1px 3px 0px light-dark(#00000012, #00000024)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"5": {
"$type": "shadow",
"$value": "{slds.g.shadow.4}",
"$description": "Shadow 5.",
"name": "5",
"originalValue": "{slds.g.shadow.4}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"6": {
"$type": "shadow",
"$value": "{slds.g.shadow.4}",
"$description": "Shadow 6.",
"name": "6",
"originalValue": "{slds.g.shadow.4}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "6",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"outline": {
"focus": {
"1": {
"$type": "shadow",
"$value": "0px 0px 0px 2px {slds.g.color.brand.base.15}",
"$description": "Shadow Outline Focus 1.",
"name": "1",
"originalValue": "0px 0px 0px 2px {slds.g.color.brand.base.15}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
},
"outset": {
"focus": {
"1": {
"$type": "shadow",
"$value": "0px 0px 0px 2px {slds.g.color.neutral.base.100}, 0px 0px 0px 4px {slds.g.color.brand.base.15}",
"$description": "Shadow Outset Focus 1.",
"name": "1",
"originalValue": "0px 0px 0px 2px {slds.g.color.neutral.base.100}, 0px 0px 0px 4px {slds.g.color.brand.base.15}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
},
"inset": {
"focus": {
"1": {
"$type": "shadow",
"$value": "0px 0px 0px 2px {slds.g.color.brand.base.15} inset",
"$description": "Shadow Inset Focus 1.",
"name": "1",
"originalValue": "0px 0px 0px 2px {slds.g.color.brand.base.15} inset",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"inverse": {
"focus": {
"1": {
"$type": "shadow",
"$value": "0px 0px 0px 2px {slds.g.color.brand.base.15} inset, 0px 0px 0px 4px {slds.g.color.neutral.base.100} inset",
"$description": "Shadow inset inverse focus",
"name": "1",
"originalValue": "0px 0px 0px 2px {slds.g.color.brand.base.15} inset, 0px 0px 0px 4px {slds.g.color.neutral.base.100} inset",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
}
},
"inverse": {
"1": {
"$type": "shadow",
"$value": "0 0 3px #f3f3f3",
"$description": "Shadow Inverse 1",
"name": "1",
"originalValue": "0 0 3px #f3f3f3",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"insetinverse": {
"focus": {
"1": {
"$type": "shadow",
"$value": "{slds.g.shadow.inset.inverse.focus.1}",
"$deprecated": true,
"$description": "Shadow Inset inverse Focus 1.",
"name": "1",
"originalValue": "{slds.g.shadow.inset.inverse.focus.1}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
},
"block": {
"start": {
"1": {
"$type": "shadow",
"$value": "0px 0px 2px 0px light-dark(#0000002e, #0000005c), 0px -2px 2px 0px light-dark(#0000002e, #0000005c), 0px 1px 2px 0px light-dark(#0000001a, #00000033)",
"$description": "Shadow depth 1 - up",
"name": "1",
"originalValue": "0px 0px 2px 0px light-dark(#0000002e, #0000005c), 0px -2px 2px 0px light-dark(#0000002e, #0000005c), 0px 1px 2px 0px light-dark(#0000001a, #00000033)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "0px 0px 5px 0px light-dark(#00000029, #00000052), 0px -3px 3px 0px light-dark(#00000029, #00000052), 0px 1px 2px 0px light-dark(#00000017, #0000002e)",
"$description": "Shadow depth 2 - up",
"name": "2",
"originalValue": "0px 0px 5px 0px light-dark(#00000029, #00000052), 0px -3px 3px 0px light-dark(#00000029, #00000052), 0px 1px 2px 0px light-dark(#00000017, #0000002e)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "0px 0px 7px 0px light-dark(#00000024, #00000047), 0px -5px 5px 0px light-dark(#00000024, #00000047), 0px 1px 2px 0px light-dark(#00000014, #00000029)",
"$description": "Shadow depth 3 - up",
"name": "3",
"originalValue": "0px 0px 7px 0px light-dark(#00000024, #00000047), 0px -5px 5px 0px light-dark(#00000024, #00000047), 0px 1px 2px 0px light-dark(#00000014, #00000029)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "0px 0px 10px 0px light-dark(#0000001f, #0000003d), 0px -7px 7px 0px light-dark(#0000001f, #0000003d), 0px 1px 3px 0px light-dark(#00000012, #00000024)",
"$description": "Shadow depth 4 - up",
"name": "4",
"originalValue": "0px 0px 10px 0px light-dark(#0000001f, #0000003d), 0px -7px 7px 0px light-dark(#0000001f, #0000003d), 0px 1px 3px 0px light-dark(#00000012, #00000024)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"end": {
"1": {
"$type": "shadow",
"$value": "{slds.g.shadow.1}",
"$description": "Shadow depth 1 - down",
"name": "1",
"originalValue": "{slds.g.shadow.1}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "{slds.g.shadow.2}",
"$description": "Shadow depth 2 - down",
"name": "2",
"originalValue": "{slds.g.shadow.2}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "{slds.g.shadow.3}",
"$description": "Shadow depth 3 - down",
"name": "3",
"originalValue": "{slds.g.shadow.3}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "{slds.g.shadow.4}",
"$description": "Shadow depth 4 - down",
"name": "4",
"originalValue": "{slds.g.shadow.4}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
},
"blockstart": {
"1": {
"$type": "shadow",
"$value": "{slds.g.shadow.block.start.1}",
"$deprecated": true,
"$description": "Shadow Blockstart 1.",
"name": "1",
"originalValue": "{slds.g.shadow.block.start.1}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "{slds.g.shadow.block.start.2}",
"$deprecated": true,
"$description": "Shadow Blockstart 2.",
"name": "2",
"originalValue": "{slds.g.shadow.block.start.2}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "{slds.g.shadow.block.start.3}",
"$deprecated": true,
"$description": "Shadow Blockstart 3.",
"name": "3",
"originalValue": "{slds.g.shadow.block.start.3}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "{slds.g.shadow.block.start.4}",
"$deprecated": true,
"$description": "Shadow Blockstart 4.",
"name": "4",
"originalValue": "{slds.g.shadow.block.start.4}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"blockend": {
"1": {
"$type": "shadow",
"$value": "{slds.g.shadow.block.end.1}",
"$deprecated": true,
"$description": "Shadow Blockend 1.",
"name": "1",
"originalValue": "{slds.g.shadow.block.end.1}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "{slds.g.shadow.block.end.2}",
"$deprecated": true,
"$description": "Shadow Blockend 2.",
"name": "2",
"originalValue": "{slds.g.shadow.block.end.2}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "{slds.g.shadow.block.end.3}",
"$deprecated": true,
"$description": "Shadow Blockend 3.",
"name": "3",
"originalValue": "{slds.g.shadow.block.end.3}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "{slds.g.shadow.block.end.4}",
"$deprecated": true,
"$description": "Shadow Blockend 4.",
"name": "4",
"originalValue": "{slds.g.shadow.block.end.4}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"inline": {
"start": {
"1": {
"$type": "shadow",
"$value": "0px 0px 2px 0px light-dark(#0000002e, #0000005c), -2px 0px 2px 0px light-dark(#0000002e, #0000005c), 1px 0px 2px 0px light-dark(#0000001a, #00000033)",
"$description": "Shadow depth 1 - left",
"name": "1",
"originalValue": "0px 0px 2px 0px light-dark(#0000002e, #0000005c), -2px 0px 2px 0px light-dark(#0000002e, #0000005c), 1px 0px 2px 0px light-dark(#0000001a, #00000033)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "0px 0px 5px 0px light-dark(#00000029, #00000052), -3px 0px 3px 0px light-dark(#00000029, #00000052), 1px 0px 2px 0px light-dark(#00000017, #0000002e)",
"$description": "Shadow depth 2 - left",
"name": "2",
"originalValue": "0px 0px 5px 0px light-dark(#00000029, #00000052), -3px 0px 3px 0px light-dark(#00000029, #00000052), 1px 0px 2px 0px light-dark(#00000017, #0000002e)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "0px 0px 7px 0px light-dark(#00000024, #00000047), -5px 0px 5px 0px light-dark(#00000024, #00000047), 1px 0px 2px 0px light-dark(#00000014, #00000029)",
"$description": "Shadow depth 3 - left",
"name": "3",
"originalValue": "0px 0px 7px 0px light-dark(#00000024, #00000047), -5px 0px 5px 0px light-dark(#00000024, #00000047), 1px 0px 2px 0px light-dark(#00000014, #00000029)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "0px 0px 10px 0px light-dark(#0000001f, #0000003d), -7px 0px 7px 0px light-dark(#0000001f, #0000003d), 1px 0px 3px 0px light-dark(#00000012, #00000024)",
"$description": "Shadow depth 4 - left",
"name": "4",
"originalValue": "0px 0px 10px 0px light-dark(#0000001f, #0000003d), -7px 0px 7px 0px light-dark(#0000001f, #0000003d), 1px 0px 3px 0px light-dark(#00000012, #00000024)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"end": {
"1": {
"$type": "shadow",
"$value": "0px 0px 2px 0px light-dark(#0000002e, #0000005c), 2px 0px 2px 0px light-dark(#0000002e, #0000005c), -1px 0 2px 0 light-dark(#0000001a, #00000033)",
"$description": "Shadow depth 1 - right",
"name": "1",
"originalValue": "0px 0px 2px 0px light-dark(#0000002e, #0000005c), 2px 0px 2px 0px light-dark(#0000002e, #0000005c), -1px 0 2px 0 light-dark(#0000001a, #00000033)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "0px 0px 5px 0px light-dark(#00000029, #00000052), 3px 0px 3px 0px light-dark(#00000029, #00000052), -1px 0px 2px 0px light-dark(#00000017, #0000002e)",
"$description": "Shadow depth 2 - right",
"name": "2",
"originalValue": "0px 0px 5px 0px light-dark(#00000029, #00000052), 3px 0px 3px 0px light-dark(#00000029, #00000052), -1px 0px 2px 0px light-dark(#00000017, #0000002e)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "0px 0px 7px 0px light-dark(#00000024, #00000047), 5px 0px 5px 0px light-dark(#00000024, #00000047), -1px 0px 3px 0px light-dark(#00000014, #00000029)",
"$description": "Shadow depth 3 - right",
"name": "3",
"originalValue": "0px 0px 7px 0px light-dark(#00000024, #00000047), 5px 0px 5px 0px light-dark(#00000024, #00000047), -1px 0px 3px 0px light-dark(#00000014, #00000029)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "0px 0px 10px 0px light-dark(#0000001f, #0000003d), 7px 0px 7px 0px light-dark(#0000001f, #0000003d), -1px 0px 3px 0px light-dark(#00000012, #00000024)",
"$description": "Shadow depth 4 - right",
"name": "4",
"originalValue": "0px 0px 10px 0px light-dark(#0000001f, #0000003d), 7px 0px 7px 0px light-dark(#0000001f, #0000003d), -1px 0px 3px 0px light-dark(#00000012, #00000024)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
},
"inlinestart": {
"1": {
"$type": "shadow",
"$value": "{slds.g.shadow.inline.start.1}",
"$deprecated": true,
"$description": "Shadow Inlinestart 1.",
"name": "1",
"originalValue": "{slds.g.shadow.inline.start.1}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "{slds.g.shadow.inline.start.2}",
"$deprecated": true,
"$description": "Shadow Inlinestart 2.",
"name": "2",
"originalValue": "{slds.g.shadow.inline.start.2}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "{slds.g.shadow.inline.start.3}",
"$deprecated": true,
"$description": "Shadow Inlinestart 3.",
"name": "3",
"originalValue": "{slds.g.shadow.inline.start.3}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "{slds.g.shadow.inline.start.4}",
"$deprecated": true,
"$description": "Shadow Inlinestart 4.",
"name": "4",
"originalValue": "{slds.g.shadow.inline.start.4}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"inlineend": {
"1": {
"$type": "shadow",
"$value": "{slds.g.shadow.inline.end.1}",
"$deprecated": true,
"$description": "Shadow Inlineend 1.",
"name": "1",
"originalValue": "{slds.g.shadow.inline.end.1}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "1",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"2": {
"$type": "shadow",
"$value": "{slds.g.shadow.inline.end.2}",
"$deprecated": true,
"$description": "Shadow Inlineend 2.",
"name": "2",
"originalValue": "{slds.g.shadow.inline.end.2}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "2",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"3": {
"$type": "shadow",
"$value": "{slds.g.shadow.inline.end.3}",
"$deprecated": true,
"$description": "Shadow Inlineend 3.",
"name": "3",
"originalValue": "{slds.g.shadow.inline.end.3}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "3",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"4": {
"$type": "shadow",
"$value": "{slds.g.shadow.inline.end.4}",
"$deprecated": true,
"$description": "Shadow Inlineend 4.",
"name": "4",
"originalValue": "{slds.g.shadow.inline.end.4}",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "4",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
}
},
"r": {
"color": {
"brand": {
"5": {
"$type": "color",
"$value": "{alias.palette.electricBlue.5}",
"name": "5",
"originalValue": "{alias.palette.electricBlue.5}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"10": {
"$type": "color",
"$value": "{alias.palette.electricBlue.10}",
"name": "10",
"originalValue": "{alias.palette.electricBlue.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.electricBlue.15}",
"name": "15",
"originalValue": "{alias.palette.electricBlue.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.electricBlue.20}",
"name": "20",
"originalValue": "{alias.palette.electricBlue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.electricBlue.30}",
"name": "30",
"originalValue": "{alias.palette.electricBlue.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"35": {
"$type": "color",
"$value": "{alias.palette.electricBlue.35}",
"name": "35",
"originalValue": "{alias.palette.electricBlue.35}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "35",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.electricBlue.40}",
"name": "40",
"originalValue": "{alias.palette.electricBlue.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"45": {
"$type": "color",
"$value": "{alias.palette.electricBlue.45}",
"name": "45",
"originalValue": "{alias.palette.electricBlue.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.electricBlue.50}",
"name": "50",
"originalValue": "{alias.palette.electricBlue.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"55": {
"$type": "color",
"$value": "{alias.palette.electricBlue.55}",
"name": "55",
"originalValue": "{alias.palette.electricBlue.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.electricBlue.60}",
"name": "60",
"originalValue": "{alias.palette.electricBlue.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.electricBlue.65}",
"name": "65",
"originalValue": "{alias.palette.electricBlue.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.electricBlue.70}",
"name": "70",
"originalValue": "{alias.palette.electricBlue.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.electricBlue.80}",
"name": "80",
"originalValue": "{alias.palette.electricBlue.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"85": {
"$type": "color",
"$value": "{alias.palette.electricBlue.85}",
"name": "85",
"originalValue": "{alias.palette.electricBlue.85}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "85",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.electricBlue.90}",
"name": "90",
"originalValue": "{alias.palette.electricBlue.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.electricBlue.95}",
"name": "95",
"originalValue": "{alias.palette.electricBlue.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
}
},
"info": {
"5": {
"$type": "color",
"$value": "{alias.palette.blue.5}",
"name": "5",
"originalValue": "{alias.palette.blue.5}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"10": {
"$type": "color",
"$value": "{alias.palette.blue.10}",
"name": "10",
"originalValue": "{alias.palette.blue.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.blue.15}",
"name": "15",
"originalValue": "{alias.palette.blue.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.blue.20}",
"name": "20",
"originalValue": "{alias.palette.blue.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.blue.30}",
"name": "30",
"originalValue": "{alias.palette.blue.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"35": {
"$type": "color",
"$value": "{alias.palette.blue.35}",
"name": "35",
"originalValue": "{alias.palette.blue.35}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "35",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.blue.40}",
"name": "40",
"originalValue": "{alias.palette.blue.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"45": {
"$type": "color",
"$value": "{alias.palette.blue.45}",
"name": "45",
"originalValue": "{alias.palette.blue.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.blue.50}",
"name": "50",
"originalValue": "{alias.palette.blue.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"55": {
"$type": "color",
"$value": "{alias.palette.blue.55}",
"name": "55",
"originalValue": "{alias.palette.blue.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.blue.60}",
"name": "60",
"originalValue": "{alias.palette.blue.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.blue.65}",
"name": "65",
"originalValue": "{alias.palette.blue.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.blue.70}",
"name": "70",
"originalValue": "{alias.palette.blue.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.blue.80}",
"name": "80",
"originalValue": "{alias.palette.blue.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"85": {
"$type": "color",
"$value": "{alias.palette.blue.85}",
"name": "85",
"originalValue": "{alias.palette.blue.85}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "85",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.blue.90}",
"name": "90",
"originalValue": "{alias.palette.blue.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.blue.95}",
"name": "95",
"originalValue": "{alias.palette.blue.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
}
},
"success": {
"5": {
"$type": "color",
"$value": "{alias.palette.teal.5}",
"name": "5",
"originalValue": "{alias.palette.teal.5}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"10": {
"$type": "color",
"$value": "{alias.palette.teal.10}",
"name": "10",
"originalValue": "{alias.palette.teal.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.teal.15}",
"name": "15",
"originalValue": "{alias.palette.teal.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.teal.20}",
"name": "20",
"originalValue": "{alias.palette.teal.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.teal.30}",
"name": "30",
"originalValue": "{alias.palette.teal.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"35": {
"$type": "color",
"$value": "{alias.palette.teal.35}",
"name": "35",
"originalValue": "{alias.palette.teal.35}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "35",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.teal.40}",
"name": "40",
"originalValue": "{alias.palette.teal.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"45": {
"$type": "color",
"$value": "{alias.palette.teal.45}",
"name": "45",
"originalValue": "{alias.palette.teal.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.teal.50}",
"name": "50",
"originalValue": "{alias.palette.teal.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"55": {
"$type": "color",
"$value": "{alias.palette.teal.55}",
"name": "55",
"originalValue": "{alias.palette.teal.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.teal.60}",
"name": "60",
"originalValue": "{alias.palette.teal.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.teal.65}",
"name": "65",
"originalValue": "{alias.palette.teal.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.teal.70}",
"name": "70",
"originalValue": "{alias.palette.teal.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.teal.80}",
"name": "80",
"originalValue": "{alias.palette.teal.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"85": {
"$type": "color",
"$value": "{alias.palette.teal.85}",
"name": "85",
"originalValue": "{alias.palette.teal.85}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "85",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.teal.90}",
"name": "90",
"originalValue": "{alias.palette.teal.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.teal.95}",
"name": "95",
"originalValue": "{alias.palette.teal.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
}
},
"error": {
"5": {
"$type": "color",
"$value": "{alias.palette.pink.5}",
"name": "5",
"originalValue": "{alias.palette.pink.5}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"10": {
"$type": "color",
"$value": "{alias.palette.pink.10}",
"name": "10",
"originalValue": "{alias.palette.pink.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.pink.15}",
"name": "15",
"originalValue": "{alias.palette.pink.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.pink.20}",
"name": "20",
"originalValue": "{alias.palette.pink.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.pink.30}",
"name": "30",
"originalValue": "{alias.palette.pink.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"35": {
"$type": "color",
"$value": "{alias.palette.pink.35}",
"name": "35",
"originalValue": "{alias.palette.pink.35}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "35",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.pink.40}",
"name": "40",
"originalValue": "{alias.palette.pink.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"45": {
"$type": "color",
"$value": "{alias.palette.pink.45}",
"name": "45",
"originalValue": "{alias.palette.pink.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.pink.50}",
"name": "50",
"originalValue": "{alias.palette.pink.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"55": {
"$type": "color",
"$value": "{alias.palette.pink.55}",
"name": "55",
"originalValue": "{alias.palette.pink.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.pink.60}",
"name": "60",
"originalValue": "{alias.palette.pink.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.pink.65}",
"name": "65",
"originalValue": "{alias.palette.pink.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.pink.70}",
"name": "70",
"originalValue": "{alias.palette.pink.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.pink.80}",
"name": "80",
"originalValue": "{alias.palette.pink.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"85": {
"$type": "color",
"$value": "{alias.palette.pink.85}",
"name": "85",
"originalValue": "{alias.palette.pink.85}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "85",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.pink.90}",
"name": "90",
"originalValue": "{alias.palette.pink.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.pink.95}",
"name": "95",
"originalValue": "{alias.palette.pink.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
}
},
"warning": {
"5": {
"$type": "color",
"$value": "{alias.palette.yellow.5}",
"name": "5",
"originalValue": "{alias.palette.yellow.5}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "5",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"10": {
"$type": "color",
"$value": "{alias.palette.yellow.10}",
"name": "10",
"originalValue": "{alias.palette.yellow.10}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "10",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"15": {
"$type": "color",
"$value": "{alias.palette.yellow.15}",
"name": "15",
"originalValue": "{alias.palette.yellow.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "15",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"20": {
"$type": "color",
"$value": "{alias.palette.yellow.20}",
"name": "20",
"originalValue": "{alias.palette.yellow.20}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "20",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"30": {
"$type": "color",
"$value": "{alias.palette.yellow.30}",
"name": "30",
"originalValue": "{alias.palette.yellow.30}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "30",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"35": {
"$type": "color",
"$value": "{alias.palette.yellow.35}",
"name": "35",
"originalValue": "{alias.palette.yellow.35}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "35",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"40": {
"$type": "color",
"$value": "{alias.palette.yellow.40}",
"name": "40",
"originalValue": "{alias.palette.yellow.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "40",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"45": {
"$type": "color",
"$value": "{alias.palette.yellow.45}",
"name": "45",
"originalValue": "{alias.palette.yellow.45}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "45",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"50": {
"$type": "color",
"$value": "{alias.palette.yellow.50}",
"name": "50",
"originalValue": "{alias.palette.yellow.50}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "50",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"55": {
"$type": "color",
"$value": "{alias.palette.yellow.55}",
"name": "55",
"originalValue": "{alias.palette.yellow.55}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "55",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"60": {
"$type": "color",
"$value": "{alias.palette.yellow.60}",
"name": "60",
"originalValue": "{alias.palette.yellow.60}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "60",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"65": {
"$type": "color",
"$value": "{alias.palette.yellow.65}",
"name": "65",
"originalValue": "{alias.palette.yellow.65}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "65",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"70": {
"$type": "color",
"$value": "{alias.palette.yellow.70}",
"name": "70",
"originalValue": "{alias.palette.yellow.70}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "70",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"80": {
"$type": "color",
"$value": "{alias.palette.yellow.80}",
"name": "80",
"originalValue": "{alias.palette.yellow.80}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "80",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"85": {
"$type": "color",
"$value": "{alias.palette.yellow.85}",
"name": "85",
"originalValue": "{alias.palette.yellow.85}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "85",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"90": {
"$type": "color",
"$value": "{alias.palette.yellow.90}",
"name": "90",
"originalValue": "{alias.palette.yellow.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "90",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
},
"95": {
"$type": "color",
"$value": "{alias.palette.yellow.95}",
"name": "95",
"originalValue": "{alias.palette.yellow.95}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "95",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill",
"stroke"
]
}
}
}
},
"s": {
"alert": {
"font": {
"weight": {
"$type": "fontWeight",
"$value": "{slds.g.font.weight.6}",
"$description": "Alert font weight",
"name": "weight",
"originalValue": "{slds.g.font.weight.6}",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "weight",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-weight"
]
}
},
"close": {
"button": {
"hover": {
"$type": "color",
"$value": "{slds.g.color.on.surface.3}",
"$description": "Alert close button hover state",
"name": "hover",
"originalValue": "{slds.g.color.on.surface.3}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "hover",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
}
},
"avatar": {
"radius": {
"border": {
"$type": "dimension",
"$value": "{slds.g.radius.border.circle}",
"$description": "Avatar default border radius",
"name": "border",
"originalValue": "{slds.g.radius.border.circle}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-radius"
]
}
}
},
"backdrop": {
"color": {
"background": {
"$type": "color",
"$value": "color-mix(in oklab, var(--slds-g-color-palette-neutral-20),transparent 20%)",
"$extensions": {
"com.salesforce-ux.mode": {
"dark": {
"$value": "color-mix(in oklab, var(--slds-g-color-palette-neutral-95),transparent 20%)"
}
}
},
"$description": "Backdrop color",
"name": "background",
"originalValue": "color-mix(in oklab, var(--slds-g-color-palette-neutral-20),transparent 20%)",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "background",
"themeOwned": true,
"cssProperties": [
"background-color"
]
}
}
},
"button": {
"color": {
"$type": "color",
"$value": "{slds.g.color.accent.2}",
"$description": "Text color for non-brand and non-feedback button family",
"name": "color",
"originalValue": "{slds.g.color.accent.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"shadow": {
"focus": {
"$type": "shadow",
"$value": "0 0 0 2px var(--slds-g-color-surface-1), 0 0 0 4px var(--slds-g-color-brand-base-15)",
"$description": "Focus border color of neutral buttons",
"name": "focus",
"originalValue": "0 0 0 2px var(--slds-g-color-surface-1), 0 0 0 4px var(--slds-g-color-brand-base-15)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "focus",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"focus-inverse": {
"$type": "shadow",
"$value": "0 0 0 2px var(--slds-g-color-brand-base-15), 0 0 0 4px var(--slds-g-color-surface-1)",
"$description": "Focus border color of inverse buttons",
"name": "focus-inverse",
"originalValue": "0 0 0 2px var(--slds-g-color-brand-base-15), 0 0 0 4px var(--slds-g-color-surface-1)",
"type": "shadow",
"category": "",
"scope": "inverse",
"namespace": "focus",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"active": {
"$type": "shadow",
"$value": "2px 2px 5px 0px rgba(0, 0, 0, 0.08) inset, 0px 0.5px 2px 0px rgba(0, 0, 0, 0.35) inset, 0px 1px 0px 0px rgba(0, 0, 0, 0.15) inset",
"$description": "Active border color of neutral buttons",
"name": "active",
"originalValue": "2px 2px 5px 0px rgba(0, 0, 0, 0.08) inset, 0px 0.5px 2px 0px rgba(0, 0, 0, 0.35) inset, 0px 1px 0px 0px rgba(0, 0, 0, 0.15) inset",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "active",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"brand": {
"shadow": {
"hover": {
"$type": "shadow",
"$value": "0 2px 0 0 light-dark(var(--slds-g-color-brand-base-20), var(--slds-g-color-brand-base-70))",
"$description": "Hover shadow for brand buttons",
"name": "hover",
"originalValue": "0 2px 0 0 light-dark(var(--slds-g-color-brand-base-20), var(--slds-g-color-brand-base-70))",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "hover",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"transform": {
"hover": {
"$type": "string",
"$value": "translateY(-2px)",
"$description": "Transform button to animate vertical movement on hover",
"name": "hover",
"originalValue": "translateY(-2px)",
"type": "string",
"category": "",
"scope": "",
"namespace": "hover",
"themeOwned": true,
"cssProperties": [
"transform"
]
}
}
},
"bordered": {
"shadow": {
"hover": {
"$type": "shadow",
"$value": "0 1.5px 0 0 light-dark(var(--slds-g-color-neutral-base-20), var(--slds-g-color-neutral-base-70))",
"$description": "Hover shadow for bordered buttons",
"name": "hover",
"originalValue": "0 1.5px 0 0 light-dark(var(--slds-g-color-neutral-base-20), var(--slds-g-color-neutral-base-70))",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "hover",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
},
"transform": {
"hover": {
"$type": "string",
"$value": "translateY(-1.5px)",
"$description": "Transform button to animate vertical movement on hover",
"name": "hover",
"originalValue": "translateY(-1.5px)",
"type": "string",
"category": "",
"scope": "",
"namespace": "hover",
"themeOwned": true,
"cssProperties": [
"transform"
]
}
}
},
"radius": {
"border": {
"$type": "dimension",
"$value": "{slds.g.radius.border.pill}",
"$description": "Default border radius for buttons",
"name": "border",
"originalValue": "{slds.g.radius.border.pill}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-radius"
]
}
},
"spacing": {
"inline": {
"$type": "dimension",
"$value": "{slds.g.spacing.4}",
"$description": "Inline/horizontal spacing of buttons",
"name": "inline",
"originalValue": "{slds.g.spacing.4}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "inline",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
}
}
},
"button-color-background": {
"$type": "color",
"$value": "{slds.g.color.surface.container.1}",
"$description": "Background of neutral buttons",
"name": "button-color-background",
"originalValue": "{slds.g.color.surface.container.1}",
"type": "color",
"syntax": "<color>",
"category": "background",
"scope": "color",
"namespace": "button",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"button-color-background-hover": {
"$type": "color",
"$value": "{slds.g.color.brand.base.90}",
"$description": "Hover background of neutral buttons",
"name": "button-color-background-hover",
"originalValue": "{slds.g.color.brand.base.90}",
"type": "color",
"syntax": "<color>",
"category": "background",
"scope": "color",
"namespace": "button",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"button-color-background-focus": {
"$type": "color",
"$value": "{slds.g.color.surface.container.2}",
"$description": "Focus background of neutral buttons",
"name": "button-color-background-focus",
"originalValue": "{slds.g.color.surface.container.2}",
"type": "color",
"syntax": "<color>",
"category": "background",
"scope": "color",
"namespace": "button",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"button-color-background-active": {
"$type": "color",
"$value": "{slds.g.color.surface.container.2}",
"$description": "Active background of neutral buttons",
"name": "button-color-background-active",
"originalValue": "{slds.g.color.surface.container.2}",
"type": "color",
"syntax": "<color>",
"category": "background",
"scope": "color",
"namespace": "button",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"button-color-border": {
"$type": "color",
"$value": "{slds.g.color.border.2}",
"$description": "Border color of neutral buttons",
"name": "button-color-border",
"originalValue": "{slds.g.color.border.2}",
"type": "color",
"syntax": "<color>",
"category": "border",
"scope": "color",
"namespace": "button",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"button-color-hover": {
"$type": "color",
"$value": "{slds.g.color.on.surface.3}",
"$description": "Hover text color of neutral buttons",
"name": "button-color-hover",
"originalValue": "{slds.g.color.on.surface.3}",
"type": "color",
"syntax": "<color>",
"category": "hover",
"scope": "color",
"namespace": "button",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"container": {
"color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.1}",
"$description": "Container text color",
"name": "color",
"originalValue": "{slds.g.color.on.surface.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"shadow": {
"$type": "shadow",
"$value": "none",
"$description": "Container shadow",
"name": "shadow",
"originalValue": "none",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "shadow",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"footer": {
"sizing": {
"border": {
"$type": "dimension",
"$value": "{slds.g.sizing.border.1}",
"$description": "Container border size",
"name": "border",
"originalValue": "{slds.g.sizing.border.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-width",
"width"
]
}
},
"color": {
"background": {
"$type": "color",
"$value": "{slds.g.color.surface.container.1}",
"$description": "Container footer background color",
"name": "background",
"originalValue": "{slds.g.color.surface.container.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"font": {
"align": {
"$type": "string",
"$value": "right",
"$description": "Container footer font alignment",
"name": "align",
"originalValue": "right",
"type": "string",
"category": "",
"scope": "",
"namespace": "align",
"themeOwned": true,
"cssProperties": [
"text-align"
]
},
"color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.2}",
"$description": "Container heading font color",
"name": "color",
"originalValue": "{slds.g.color.on.surface.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"sizing": {
"border": {
"$type": "dimension",
"$value": "0",
"$description": "Container border width",
"name": "border",
"originalValue": "0",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"themeOwned": true,
"cssProperties": [
"border-width",
"width"
]
}
},
"radius": {
"border": {
"$type": "dimension",
"$value": "{slds.g.radius.border.4}",
"$description": "Container border radius",
"name": "border",
"originalValue": "{slds.g.radius.border.4}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-radius"
]
}
},
"heading": {
"font": {
"color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.3}",
"$description": "Container heading font color",
"name": "color",
"originalValue": "{slds.g.color.on.surface.3}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"size": {
"$type": "dimension",
"$value": "{slds.g.font.scale.3}",
"$description": "Container heading font size",
"name": "size",
"originalValue": "{slds.g.font.scale.3}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "size",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"weight": {
"$type": "fontWeight",
"$value": "{slds.g.font.weight.4}",
"$description": "Container heading font weight",
"name": "weight",
"originalValue": "{slds.g.font.weight.4}",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "weight",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"align": {
"$type": "string",
"$value": "left",
"$description": "Container heading font alignment",
"name": "align",
"originalValue": "left",
"type": "string",
"category": "",
"scope": "",
"namespace": "align",
"themeOwned": true,
"cssProperties": [
"text-align"
]
}
}
},
"content": {
"color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.1}",
"$description": "Container content text color",
"name": "color",
"originalValue": "{slds.g.color.on.surface.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"container-color-border": {
"$type": "color",
"$value": "transparent",
"$description": "Container border color",
"name": "container-color-border",
"originalValue": "transparent",
"type": "color",
"syntax": "<color>",
"category": "border",
"scope": "color",
"namespace": "container",
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"container-heading-var-font-size": {
"$type": "dimension",
"$value": "{slds.g.font.scale.var.3}",
"$description": "Container heading variable font size",
"name": "container-heading-var-font-size",
"originalValue": "{slds.g.font.scale.var.3}",
"type": "dimension",
"syntax": "<length>",
"category": "var",
"scope": "heading",
"namespace": "container",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"header": {
"sizing": {
"height": {
"$type": "dimension",
"$value": {
"value": 3.125,
"unit": "rem"
},
"$description": "Header height",
"name": "height",
"originalValue": "3.125rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "height",
"themeOwned": true,
"cssProperties": [
"border-width",
"width"
]
}
}
},
"helptext": {
"color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.1}",
"$description": "Default color for helptext.",
"name": "color",
"originalValue": "{slds.g.color.on.surface.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"font": {
"size": {
"$type": "dimension",
"$value": "{slds.g.font.scale.neg.1}",
"$description": "Text size of help text that sits below a form control, if present.",
"name": "size",
"originalValue": "{slds.g.font.scale.neg.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "size",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
}
},
"spacing": {
"$type": "dimension",
"$value": "{slds.g.spacing.1}",
"$description": "Spacing between the helptext and the form control.",
"name": "spacing",
"originalValue": "{slds.g.spacing.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "spacing",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
}
},
"icon": {
"color": {
"foreground": {
"$type": "color",
"$value": "{slds.g.color.on.surface.1}",
"$description": "Fill color for icons. The default is utility icons.",
"name": "foreground",
"originalValue": "{slds.g.color.on.surface.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "foreground",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"radius": {
"border": {
"$type": "dimension",
"$value": "{slds.g.radius.border.circle}",
"$description": "Default border radius for icons.",
"name": "border",
"originalValue": "{slds.g.radius.border.circle}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-radius"
]
}
}
},
"input": {
"radius": {
"border": {
"$type": "dimension",
"$value": "{slds.g.radius.border.2}",
"$description": "Border radius for inputs",
"name": "border",
"originalValue": "{slds.g.radius.border.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"border-radius"
]
}
},
"color": {
"background": {
"$type": "color",
"$value": "{slds.g.color.surface.container.1}",
"$description": "Background color for inputs",
"name": "background",
"originalValue": "{slds.g.color.surface.container.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"background-disabled": {
"$type": "color",
"$value": "{slds.g.color.disabled.container.1}",
"$description": "Background color for inputs when disabled",
"name": "background-disabled",
"originalValue": "{slds.g.color.disabled.container.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "disabled",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"background-invalid": {
"$type": "color",
"$value": "{slds.g.color.error.container.1}",
"$description": "Background color for inputs when disabled",
"name": "background-invalid",
"originalValue": "{slds.g.color.error.container.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "invalid",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"border": {
"$type": "color",
"$value": "{slds.g.color.border.2}",
"$description": "Border color for inputs",
"name": "border",
"originalValue": "{slds.g.color.border.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"border-disabled": {
"$type": "color",
"$value": "{slds.g.color.border.disabled.1}",
"$description": "Disabled border color for input containers",
"name": "border-disabled",
"originalValue": "{slds.g.color.border.disabled.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "disabled",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"border-focus": {
"$type": "color",
"$value": "{slds.g.color.border.2}",
"$description": "Border color for inputs on focus.",
"name": "border-focus",
"originalValue": "{slds.g.color.border.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "focus",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"spacing": {
"$type": "dimension",
"$value": "{slds.g.spacing.2}",
"$description": "Spacing for inputs. Set as padding.",
"name": "spacing",
"originalValue": "{slds.g.spacing.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "spacing",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"shadow": {
"focus": {
"$type": "shadow",
"$value": "2px 2px 5px 0px rgba(0, 0, 0, 0.08) inset, 0px 0.5px 2px 0px rgba(0, 0, 0, 0.35) inset, 0px 1px 0px 0px rgba(0, 0, 0, 0.15) inset, 0 0 0 2px var(--slds-g-color-surface-1), 0 0 0 4px var(--slds-g-color-brand-base-15)",
"$description": "Box shadow for inputs on focus.",
"name": "focus",
"originalValue": "2px 2px 5px 0px rgba(0, 0, 0, 0.08) inset, 0px 0.5px 2px 0px rgba(0, 0, 0, 0.35) inset, 0px 1px 0px 0px rgba(0, 0, 0, 0.15) inset, 0 0 0 2px var(--slds-g-color-surface-1), 0 0 0 4px var(--slds-g-color-brand-base-15)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "focus",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"invalid": {
"$type": "shadow",
"$value": "none",
"$description": "Box shadow for inputs on focus.",
"name": "invalid",
"originalValue": "none",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "invalid",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
},
"input-color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.2}",
"$description": "Text color for inputs",
"name": "input-color",
"originalValue": "{slds.g.color.on.surface.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "color",
"namespace": "input",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"input-color-disabled": {
"$type": "color",
"$value": "{slds.g.color.on.disabled.1}",
"$description": "Disabled text color for input content",
"name": "input-color-disabled",
"originalValue": "{slds.g.color.on.disabled.1}",
"type": "color",
"syntax": "<color>",
"category": "disabled",
"scope": "color",
"namespace": "input",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"input-color-invalid": {
"$type": "color",
"$value": "{slds.g.color.error.1}",
"$description": "Text color for inputs when disabled",
"name": "input-color-invalid",
"originalValue": "{slds.g.color.error.1}",
"type": "color",
"syntax": "<color>",
"category": "invalid",
"scope": "color",
"namespace": "input",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"label": {
"color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.2}",
"$description": "Text color for form labels",
"name": "color",
"originalValue": "{slds.g.color.on.surface.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"font": {
"size": {
"$type": "dimension",
"$value": "{slds.g.font.size.base}",
"$description": "Font size for form labels",
"name": "size",
"originalValue": "{slds.g.font.size.base}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "size",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"weight": {
"$type": "fontWeight",
"$value": "{slds.g.font.weight.6}",
"$description": "Default font weight for input labels.",
"name": "weight",
"originalValue": "{slds.g.font.weight.6}",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "weight",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-weight"
]
}
},
"spacing": {
"$type": "dimension",
"$value": "{slds.g.spacing.2}",
"$description": "Spacing between the label and the input",
"name": "spacing",
"originalValue": "{slds.g.spacing.2}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "spacing",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
},
"spacing-gap": {
"$type": "dimension",
"$value": "{slds.g.spacing.1}",
"$description": "Default gap spacing for input labels.",
"name": "spacing-gap",
"originalValue": "{slds.g.spacing.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "gap",
"namespace": "spacing",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
}
},
"link": {
"color": {
"$type": "color",
"$value": "{slds.g.color.accent.2}",
"$description": "Default color for links",
"name": "color",
"originalValue": "{slds.g.color.accent.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-hover": {
"$type": "color",
"$value": "{slds.g.color.accent.3}",
"$description": "Default color for links on hover",
"name": "color-hover",
"originalValue": "{slds.g.color.accent.3}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "hover",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-focus": {
"$type": "color",
"$value": "{slds.g.color.accent.3}",
"$description": "Default color for links on focus",
"name": "color-focus",
"originalValue": "{slds.g.color.accent.3}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "focus",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-active": {
"$type": "color",
"$value": "{slds.g.color.accent.3}",
"$description": "Default color for links on active",
"name": "color-active",
"originalValue": "{slds.g.color.accent.3}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "active",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"outline": {
"color": {
"$type": "color",
"$value": "{slds.g.color.brand.base.15}",
"$description": "Default outline color for links on focus",
"name": "color",
"originalValue": "{slds.g.color.brand.base.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"mark": {
"color": {
"foreground-checked": {
"$type": "color",
"$value": "{slds.g.color.on.accent.1}",
"$description": "Color of checkmarks",
"name": "foreground-checked",
"originalValue": "{slds.g.color.on.accent.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "checked",
"namespace": "foreground",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"background": {
"$type": "color",
"$value": "{slds.g.color.surface.container.1}",
"$description": "Color of checkmark background unchecked",
"name": "background",
"originalValue": "{slds.g.color.surface.container.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"background-checked": {
"$type": "color",
"$value": "{slds.g.color.accent.container.1}",
"$description": "Color of background checkmarks are on",
"name": "background-checked",
"originalValue": "{slds.g.color.accent.container.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "checked",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"foreground-invalid": {
"$type": "color",
"$value": "{slds.g.color.error.base.100}",
"$description": "Color of background checkmarks are on",
"name": "foreground-invalid",
"originalValue": "{slds.g.color.error.base.100}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "invalid",
"namespace": "foreground",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"background-invalid": {
"$type": "color",
"$value": "{slds.g.color.error.base.40}",
"$description": "Color of background checkmarks are on",
"name": "background-invalid",
"originalValue": "{slds.g.color.error.base.40}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "invalid",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"shadow": {
"focus": {
"$type": "shadow",
"$value": "0 0 0 2px var(--slds-g-color-surface-1), 0 0 0 4px var(--slds-g-color-brand-base-15)",
"$description": "Box shadow for checked inputs on focus.",
"name": "focus",
"originalValue": "0 0 0 2px var(--slds-g-color-surface-1), 0 0 0 4px var(--slds-g-color-brand-base-15)",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "focus",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"checked": {
"$type": "shadow",
"$value": "0px 1px 0px 0px rgba(0, 0, 0, 0.08) inset, 0px 0.5px 2px 0px rgba(0, 0, 0, 0.08) inset, 2px 2px 5px 0px rgba(0, 0, 0, 0.08) inset",
"$description": "Box shadow for checked inputs when checked.",
"name": "checked",
"originalValue": "0px 1px 0px 0px rgba(0, 0, 0, 0.08) inset, 0px 0.5px 2px 0px rgba(0, 0, 0, 0.08) inset, 2px 2px 5px 0px rgba(0, 0, 0, 0.08) inset",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "checked",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
},
"menu": {
"item": {
"color": {
"background": {
"active": {
"$type": "color",
"$value": "{slds.g.color.brand.base.90}",
"$description": "Active background color for menu/listbox items",
"name": "active",
"originalValue": "{slds.g.color.brand.base.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "active",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"active": {
"$type": "color",
"$value": "{slds.g.color.accent.1}",
"$description": "Active text color for menu/listbox items",
"name": "active",
"originalValue": "{slds.g.color.accent.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "active",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
}
},
"navigation": {
"color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.1}",
"$description": "Default color for tabs",
"name": "color",
"originalValue": "{slds.g.color.on.surface.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-active": {
"$type": "color",
"$value": "{slds.g.color.accent.3}",
"$description": "Default color for tabs",
"name": "color-active",
"originalValue": "{slds.g.color.accent.3}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "active",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-hover": {
"$type": "color",
"$value": "{slds.g.color.brand.base.15}",
"$description": "Default color for tabs",
"name": "color-hover",
"originalValue": "{slds.g.color.brand.base.15}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "hover",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-background": {
"$type": "color",
"$value": "{slds.g.color.surface.container.1}",
"$description": "Default color for tabs",
"name": "color-background",
"originalValue": "{slds.g.color.surface.container.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "background",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-background-active": {
"$type": "color",
"$value": "{slds.g.color.surface.container.1}",
"$description": "Default color for tabs",
"name": "color-background-active",
"originalValue": "{slds.g.color.surface.container.1}",
"type": "color",
"syntax": "<color>",
"category": "active",
"scope": "background",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-background-hover": {
"$type": "color",
"$value": "{slds.g.color.brand.base.90}",
"$description": "Default color for tabs",
"name": "color-background-hover",
"originalValue": "{slds.g.color.brand.base.90}",
"type": "color",
"syntax": "<color>",
"category": "hover",
"scope": "background",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-border": {
"$type": "color",
"$value": "{slds.g.color.border.1}",
"$description": "Default border color for tabs",
"name": "color-border",
"originalValue": "{slds.g.color.border.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "border",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-border-hover": {
"$type": "color",
"$value": "{slds.g.color.brand.base.15}",
"$description": "Default border color for tabs",
"name": "color-border-hover",
"originalValue": "{slds.g.color.brand.base.15}",
"type": "color",
"syntax": "<color>",
"category": "hover",
"scope": "border",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"sizing": {
"border-hover": {
"$type": "dimension",
"$value": {
"value": 3,
"unit": "px"
},
"$description": "Default border color for tabs",
"name": "border-hover",
"originalValue": "3px",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "hover",
"namespace": "border",
"themeOwned": true,
"cssProperties": [
"border-width",
"width"
]
},
"border-active": {
"$type": "dimension",
"$value": {
"value": 3,
"unit": "px"
},
"$description": "Default border color for tabs",
"name": "border-active",
"originalValue": "3px",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "active",
"namespace": "border",
"themeOwned": true,
"cssProperties": [
"border-width",
"width"
]
},
"height": {
"$type": "dimension",
"$value": {
"value": 2.5,
"unit": "rem"
},
"$description": "Default height for tabs",
"name": "height",
"originalValue": "2.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "height",
"themeOwned": true,
"cssProperties": [
"border-width",
"width"
]
}
},
"font": {
"weight": {
"$type": "fontWeight",
"$value": "600",
"$description": "Default border color for tabs",
"name": "weight",
"originalValue": "600",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "weight",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"weight-active": {
"$type": "fontWeight",
"$value": "600",
"$description": "Default border color for tabs",
"name": "weight-active",
"originalValue": "600",
"type": "fontWeight",
"category": "",
"scope": "active",
"namespace": "weight",
"themeOwned": true,
"cssProperties": [
"font-weight"
]
},
"lineheight": {
"$type": "dimension",
"$value": {
"value": 2.5,
"unit": "rem"
},
"$description": "Default lineheight for tabs",
"name": "lineheight",
"originalValue": "2.5rem",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "lineheight",
"themeOwned": true,
"cssProperties": [
"line-height"
]
}
}
},
"pageheader": {
"color": {
"background": {
"$type": "color",
"$value": "{slds.g.color.surface.container.2}",
"$description": "Background color of all page header",
"name": "background",
"originalValue": "{slds.g.color.surface.container.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"row": {
"color": {
"background": {
"$type": "color",
"$value": "{slds.g.color.surface.container.2}",
"$description": "Background color of all page header rows",
"name": "background",
"originalValue": "{slds.g.color.surface.container.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"radius": {
"border": {
"$type": "dimension",
"$value": "0",
"$description": "Border radius for all page headers",
"name": "border",
"originalValue": "0",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"themeOwned": true,
"cssProperties": [
"border-radius"
]
}
},
"title": {
"font": {
"size": {
"$type": "dimension",
"$value": "{slds.g.font.scale.5}",
"$description": "Font-size of all page header titles",
"name": "size",
"originalValue": "{slds.g.font.scale.5}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "size",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-size"
]
},
"weight": {
"$type": "fontWeight",
"$value": "{slds.g.font.weight.4}",
"$description": "Font-weight of all page header titles",
"name": "weight",
"originalValue": "{slds.g.font.weight.4}",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "weight",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-weight"
]
}
}
},
"sizing": {
"border": {
"$type": "dimension",
"$value": "0",
"$description": "Border width for all page headers",
"name": "border",
"originalValue": "0",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "border",
"themeOwned": true,
"cssProperties": [
"border-width",
"width"
]
}
},
"shadow": {
"$type": "shadow",
"$value": "none",
"$description": "Box shadow for all page headers",
"name": "shadow",
"originalValue": "none",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "shadow",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
},
"action": {
"bottom": {
"spacing": {
"$type": "dimension",
"$value": "{slds.g.spacing.1}",
"$description": "bottom spacing for pageheader action.",
"name": "spacing",
"originalValue": "{slds.g.spacing.1}",
"type": "dimension",
"syntax": "<length>",
"category": "",
"scope": "",
"namespace": "spacing",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"padding",
"margin",
"top",
"right",
"bottom",
"left"
]
}
}
}
},
"pill": {
"color": {
"background": {
"hover": {
"$type": "color",
"$value": "{slds.g.color.brand.base.90}",
"$description": "Hover background color for pills",
"name": "hover",
"originalValue": "{slds.g.color.brand.base.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "hover",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
}
},
"table": {
"color": {
"$type": "color",
"$value": "{slds.g.color.neutral.base.0}",
"$description": "Text/icon color for the table",
"name": "color",
"originalValue": "{slds.g.color.neutral.base.0}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"header": {
"color": {
"background": {
"$type": "color",
"$value": "{slds.g.color.surface.container.2}",
"$description": "Background color for the table header",
"name": "background",
"originalValue": "{slds.g.color.surface.container.2}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"background-hover": {
"$type": "color",
"$value": "{slds.g.color.surface.container.3}",
"$description": "Background color for the table header cells on hover",
"name": "background-hover",
"originalValue": "{slds.g.color.surface.container.3}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "hover",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"background-selected": {
"$type": "color",
"$value": "{slds.g.color.surface.container.1}",
"$description": "Background color for the table cells on active/selected",
"name": "background-selected",
"originalValue": "{slds.g.color.surface.container.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "selected",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"font": {
"weight": {
"$type": "fontWeight",
"$value": "{slds.g.font.weight.6}",
"$description": "Font weight for the table header",
"name": "weight",
"originalValue": "{slds.g.font.weight.6}",
"type": "fontWeight",
"category": "",
"scope": "",
"namespace": "weight",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"font-weight"
]
}
}
},
"resize": {
"color": {
"$type": "color",
"$value": "{slds.g.color.border.1}",
"$description": "Color of the resize handle on table columns",
"name": "color",
"originalValue": "{slds.g.color.border.1}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"color-active": {
"$type": "color",
"$value": "{slds.g.color.accent.3}",
"$description": "Active color of the resize handle on table columns",
"name": "color-active",
"originalValue": "{slds.g.color.accent.3}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "active",
"namespace": "color",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
},
"row": {
"color": {
"background-selected": {
"$type": "color",
"$value": "{slds.g.color.brand.base.90}",
"$description": "Background color of the selected table row",
"name": "background-selected",
"originalValue": "{slds.g.color.brand.base.90}",
"type": "color",
"syntax": "<color>",
"category": "",
"scope": "selected",
"namespace": "background",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
},
"border-selected-hover": {
"$type": "color",
"$value": "{slds.g.color.border.accent.2}",
"$description": "Border color of the selected table row on hover",
"name": "border-selected-hover",
"originalValue": "{slds.g.color.border.accent.2}",
"type": "color",
"syntax": "<color>",
"category": "hover",
"scope": "selected",
"namespace": "border",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
},
"cell": {
"shadow": {
"selected": {
"$type": "shadow",
"$value": "var(--slds-g-color-brand-base-15) 0 0 0 2px inset",
"$description": "Box shadow of the selected table cell",
"name": "selected",
"originalValue": "var(--slds-g-color-brand-base-15) 0 0 0 2px inset",
"type": "shadow",
"category": "",
"scope": "",
"namespace": "selected",
"themeOwned": true,
"cssProperties": [
"box-shadow"
]
}
}
}
},
"table-header-color": {
"$type": "color",
"$value": "{slds.g.color.on.surface.1}",
"$description": "Text/icon color for the table header",
"name": "table-header-color",
"originalValue": "{slds.g.color.on.surface.1}",
"type": "color",
"syntax": "<color>",
"category": "color",
"scope": "header",
"namespace": "table",
"inherits": true,
"themeOwned": true,
"cssProperties": [
"background-color",
"color",
"border-color",
"fill"
]
}
}
}
}