Skip to content

Commit

Permalink
Light theme commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@Akatori-Design
Akatori-Design committed Jan 18, 2024
1 parent 4c614c2 commit 2f00559
Showing 1 changed file with 131 additions and 47 deletions.
178 changes: 131 additions & 47 deletions src/figma/tokens.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -943,14 +943,24 @@
"type": "color"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of primary/default. (Example: label of primary button, check in a checkbox)",
"type": "color"
"value": "#ffffff",
"type": "color",
"description": "(white000: #FFFFFF) For elements used on top of primary/default. (Example: label of primary button, check in a checkbox)"
},
"disabled": {
"value": "#0376C980",
"description": "(blue500: #0376C9 50% opacity) [DEPRECATED] primary.disabled should be used for all disabled primary action components such as buttons or links",
"type": "color"
},
"default-hover": {
"value": "#0379ce",
"type": "color",
"description": "(#0379CE) For the \"hover\" state of interactive primary elements"
},
"default-pressed": {
"value": "#036db9",
"type": "color",
"description": "(#036DB9) For the \"pressed\" state of interactive primary elements"
}
},
"secondary": {
Expand Down Expand Up @@ -997,68 +1007,98 @@
"type": "color"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of error/default (Example: label of danger/critical button)",
"type": "color"
"value": "#ffffff",
"type": "color",
"description": "(white000: #FFFFFF) For elements used on top of error/default (Example: label of danger/critical button)"
},
"disabled": {
"value": "#D7384780",
"description": "(red500: #D73847 50% opacity) [DEPRECATED] error.disabled should be used for all disabled critical action components such as buttons",
"type": "color"
},
"default-hover": {
"value": "#cd4250",
"type": "color",
"description": "(#CD4250) For the \"hovered\" state of interactive danger/critical elements"
},
"default-pressed": {
"value": "#c63441",
"type": "color",
"description": "(#C63441) For the \"pressed\" state of interactive danger/critical elements"
}
},
"warning": {
"default": {
"value": "#F66A0A",
"description": "(orange500: #F66A0A) For low-mid level alert elements. Used for text, background, icon or border",
"type": "color"
"value": "#bf5208",
"type": "color",
"description": "(orange600: #BF5208) For low-mid level alert elements. Used for text, background, icon or border"
},
"alternative": {
"value": "#FFC70A",
"description": "(yellow600: #FFC70A) [DEPRECATED] warning.alternative should be used as an alternative to warning.default for things such as hover states",
"type": "color"
},
"muted": {
"value": "#FFD33D19",
"description": "(yellow500: #FFD33D 10% opacity) For lowest contrast background used in warning elements. (Example: notification background)",
"type": "color"
"value": "#bf520819",
"type": "color",
"description": "(orange600: #BF5208 10% opacity) For lowest contrast background used in warning elements. (Example: notification background)"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of warning/default. Used for text, icon or border",
"type": "color"
"value": "#ffffff",
"type": "color",
"description": "(white000: #FFFFFF) For elements used on top of warning/default. Used for text, icon or border"
},
"disabled": {
"value": "#FFD33D80",
"description": "(yellow500: #FFD33D 50% opacity) [DEPRECATED] warning.disabled should be used for all disabled component colors such as buttons",
"type": "color"
},
"default-hover": {
"value": "#c2540a",
"type": "color",
"description": "(#C2540A) For the \"hover\" state of warning elements"
},
"default-pressed": {
"value": "#a24507",
"type": "color",
"description": "(#A24507) For the \"pressed\" state of warning elements"
}
},
"success": {
"default": {
"value": "#28A745",
"description": "(green500: #28A745) For positive & good semantic elements. Used for text, background, icon or border",
"type": "color"
"value": "#1c8234",
"type": "color",
"description": "(green500: #1C8234) For positive & good semantic elements. Used for text, background, icon or border"
},
"alternative": {
"value": "#1E7E34",
"description": "(green600: #1E7E34) [DEPRECATED] (green600: #1E7E34) success.alternative should be used as an alternative to success.default for things such as hover states",
"type": "color"
},
"muted": {
"value": "#28A74519",
"description": "(green500: #28A74519 10% opacity) For lowest contrast background used in success semantic. (Example: notification background)",
"type": "color"
"value": "#1c823419",
"type": "color",
"description": "(green600: #1C8234 10% opacity) For lowest contrast background used in success semantic. (Example: notification background)"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of success/default. Used for text, icon or border",
"type": "color"
"value": "#ffffff",
"type": "color",
"description": "(white000: #FFFFFF) For elements used on top of success/default. Used for text, icon or border"
},
"disabled": {
"value": "#28A74580",
"description": "(green500: #28A745 50% opacity) [DEPRECATED] success.disabled should be used for all disabled success component colors such as buttons",
"type": "color"
},
"default-hover": {
"value": "#208838",
"type": "color",
"description": "(#208838) For the \"hover\" state of success elements"
},
"default-pressed": {
"value": "#1b7431",
"type": "color",
"description": "(#1B7431) For the \"pressed\" state of success elements"
}
},
"info": {
Expand All @@ -1078,9 +1118,9 @@
"type": "color"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of info/default. Used for text, icon or border",
"type": "color"
"value": "#ffffff",
"type": "color",
"description": "(white000: #FFFFFF) For elements used on top of info/default. Used for text, icon or border"
},
"disabled": {
"value": "#0376C980",
Expand Down Expand Up @@ -1338,14 +1378,24 @@
"type": "color"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of primary/default. (Example: label of primary button, check in a checkbox)",
"type": "color"
"value": "#141618",
"type": "color",
"description": "(grey900 : #141618) For elements used on top of primary/default. (Example: label of primary button, check in a checkbox)"
},
"disabled": {
"value": "#1098FC80",
"description": "(blue400: #1098FC) [DEPRECATED] primary.disabled should be used for all disabled primary action components such as buttons or links",
"type": "color"
},
"default-hover": {
"value": "#0092fa",
"type": "color",
"description": "(#0092FA) For the \"hover\" state of interactive primary elements"
},
"default-pressed": {
"value": "#54b6fc",
"type": "color",
"description": "(#54B6FC) For the \"hover\" state of interactive primary elements"
}
},
"secondary": {
Expand Down Expand Up @@ -1377,29 +1427,39 @@
},
"error": {
"default": {
"value": "#D73847",
"description": "(red500: #D73847) For high-level alert danger/critical elements. Used for text, background, icon or border",
"type": "color"
"value": "#ff5263",
"type": "color",
"description": "(#FF5263) For high-level alert danger/critical elements. Used for text, background, icon or border"
},
"alternative": {
"value": "#E06470",
"description": "(red400: #E06470) For the \"pressed\" state of interactive danger/critical elements",
"type": "color"
},
"muted": {
"value": "#D7384726",
"description": "(red500: #D73847 15% opacity) For lowest contrast background used in high-level alert danger/critical elements. (Example: notification background)",
"type": "color"
"value": "#ff526326",
"type": "color",
"description": "(#FF5263) 15% opacity) For lowest contrast background used in high-level alert danger/critical elements. (Example: notification background)"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of error/default (Example: label of danger/critical button)",
"type": "color"
"value": "#141618",
"type": "color",
"description": "(grey900: #141618) For elements used on top of error/default (Example: label of danger/critical button)"
},
"disabled": {
"value": "#D7384780",
"description": "(red500: #D73847 50% opacity) [DEPRECATED] error.disabled should be used for all disabled critical action components such as buttons",
"type": "color"
},
"default-hover": {
"value": "#ff4d58",
"type": "color",
"description": "FF4D58: For the \"hover\" state of interactive danger/critical elements"
},
"default-pressed": {
"value": "#f9868e",
"type": "color",
"description": "F9868E: For the \"hover\" state of interactive danger/critical elements"
}
},
"warning": {
Expand Down Expand Up @@ -1427,6 +1487,16 @@
"value": "#FFD33D80",
"description": "(yellow500: #FFD33D 50% opacity) [DEPRECATED] warning.disabled should be used for all disabled component colors such as buttons",
"type": "color"
},
"default-hover": {
"value": "#ffc60a",
"type": "color",
"description": "(#FFC60A): For warning with stronger contrast."
},
"default-pressed": {
"value": "#ffeaa3d1",
"type": "color",
"description": "(#FFEAA3): For the \"pressed\" state of low-mid level alert elements."
}
},
"success": {
Expand All @@ -1446,14 +1516,24 @@
"type": "color"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of success/default. Used for text, icon or border",
"type": "color"
"value": "#141618",
"type": "color",
"description": "(grey900 : #141618) For elements used on top of success/default. Used for text, icon or border"
},
"disabled": {
"value": "#28A74580",
"description": "(green500: #28A745 50% opacity) [DEPRECATED] success.disabled should be used for all disabled success component colors such as buttons",
"type": "color"
},
"default-hover": {
"value": "#05b82f",
"type": "color",
"description": "(#05B82F): For success with stronger contrast."
},
"default-pressed": {
"value": "#6aec88",
"type": "color",
"description": "(#6AEC88): For success with stronger contrast."
}
},
"info": {
Expand All @@ -1473,9 +1553,9 @@
"type": "color"
},
"inverse": {
"value": "#FCFCFC",
"description": "(white010: #FCFCFC) For elements used on top of info/default. Used for text, icon or border",
"type": "color"
"value": "#141618",
"type": "color",
"description": "(grey900: #141618) For elements used on top of info/default. Used for text, icon or border"
},
"disabled": {
"value": "#0376C980",
Expand Down Expand Up @@ -1605,6 +1685,10 @@
},
"$themes": [],
"$metadata": {
"tokenSetOrder": ["global", "light", "dark"]
"tokenSetOrder": [
"global",
"light",
"dark"
]
}
}
}

0 comments on commit 2f00559

Please sign in to comment.