🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more
Socket
Book a DemoInstallSign in
Socket

@netlify/netlify-design-tokens

Package Overview
Dependencies
Maintainers
19
Versions
29
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@netlify/netlify-design-tokens - npm Package Compare versions

Comparing version

to
6.0.0-beta.4

178

dist/js/index.d.ts

@@ -1,90 +0,90 @@

export const ColorNeutralLight100 : string;
export const ColorNeutralLight200 : string;
export const ColorNeutralLight300 : string;
export const ColorNeutralLight400 : string;
export const ColorNeutralLight500 : string;
export const ColorNeutralLight600 : string;
export const ColorNeutralLight700 : string;
export const ColorNeutralLight800 : string;
export const ColorNeutralLight000 : string;
export const ColorNeutralDark100 : string;
export const ColorNeutralDark200 : string;
export const ColorNeutralDark300 : string;
export const ColorNeutralDark400 : string;
export const ColorNeutralDark500 : string;
export const ColorNeutralDark600 : string;
export const ColorNeutralDark700 : string;
export const ColorNeutralDark800 : string;
export const ColorNeutralDark900 : string;
export const ColorNeutralDark000 : string;
export const ColorTeal100 : string;
export const ColorTeal200 : string;
export const ColorTeal300 : string;
export const ColorTeal400 : string;
export const ColorTeal500 : string;
export const ColorTeal600 : string;
export const ColorTeal700 : string;
export const ColorTeal800 : string;
export const ColorTeal900 : string;
export const ColorTeal000 : string;
export const ColorGreen100 : string;
export const ColorGreen200 : string;
export const ColorGreen300 : string;
export const ColorGreen400 : string;
export const ColorGreen500 : string;
export const ColorGreen600 : string;
export const ColorGreen700 : string;
export const ColorGreen800 : string;
export const ColorGreen900 : string;
export const ColorGreen000 : string;
export const ColorGold100 : string;
export const ColorGold200 : string;
export const ColorGold300 : string;
export const ColorGold400 : string;
export const ColorGold500 : string;
export const ColorGold600 : string;
export const ColorGold700 : string;
export const ColorGold800 : string;
export const ColorGold900 : string;
export const ColorGold000 : string;
export const ColorRed100 : string;
export const ColorRed200 : string;
export const ColorRed300 : string;
export const ColorRed400 : string;
export const ColorRed500 : string;
export const ColorRed600 : string;
export const ColorRed700 : string;
export const ColorRed800 : string;
export const ColorRed900 : string;
export const ColorRed000 : string;
export const ColorPink100 : string;
export const ColorPink200 : string;
export const ColorPink300 : string;
export const ColorPink400 : string;
export const ColorPink500 : string;
export const ColorPink600 : string;
export const ColorPink700 : string;
export const ColorPink800 : string;
export const ColorPink900 : string;
export const ColorPink000 : string;
export const ColorPurple100 : string;
export const ColorPurple200 : string;
export const ColorPurple300 : string;
export const ColorPurple400 : string;
export const ColorPurple500 : string;
export const ColorPurple600 : string;
export const ColorPurple700 : string;
export const ColorPurple800 : string;
export const ColorPurple900 : string;
export const ColorPurple000 : string;
export const ColorBlue100 : string;
export const ColorBlue200 : string;
export const ColorBlue300 : string;
export const ColorBlue400 : string;
export const ColorBlue500 : string;
export const ColorBlue600 : string;
export const ColorBlue700 : string;
export const ColorBlue800 : string;
export const ColorBlue900 : string;
export const ColorBlue000 : string;
export const FacetsNeutralLight100 : string;
export const FacetsNeutralLight200 : string;
export const FacetsNeutralLight300 : string;
export const FacetsNeutralLight400 : string;
export const FacetsNeutralLight500 : string;
export const FacetsNeutralLight600 : string;
export const FacetsNeutralLight700 : string;
export const FacetsNeutralLight800 : string;
export const FacetsNeutralLight000 : string;
export const FacetsNeutralDark100 : string;
export const FacetsNeutralDark200 : string;
export const FacetsNeutralDark300 : string;
export const FacetsNeutralDark400 : string;
export const FacetsNeutralDark500 : string;
export const FacetsNeutralDark600 : string;
export const FacetsNeutralDark700 : string;
export const FacetsNeutralDark800 : string;
export const FacetsNeutralDark900 : string;
export const FacetsNeutralDark000 : string;
export const FacetsTeal100 : string;
export const FacetsTeal200 : string;
export const FacetsTeal300 : string;
export const FacetsTeal400 : string;
export const FacetsTeal500 : string;
export const FacetsTeal600 : string;
export const FacetsTeal700 : string;
export const FacetsTeal800 : string;
export const FacetsTeal900 : string;
export const FacetsTeal000 : string;
export const FacetsGreen100 : string;
export const FacetsGreen200 : string;
export const FacetsGreen300 : string;
export const FacetsGreen400 : string;
export const FacetsGreen500 : string;
export const FacetsGreen600 : string;
export const FacetsGreen700 : string;
export const FacetsGreen800 : string;
export const FacetsGreen900 : string;
export const FacetsGreen000 : string;
export const FacetsGold100 : string;
export const FacetsGold200 : string;
export const FacetsGold300 : string;
export const FacetsGold400 : string;
export const FacetsGold500 : string;
export const FacetsGold600 : string;
export const FacetsGold700 : string;
export const FacetsGold800 : string;
export const FacetsGold900 : string;
export const FacetsGold000 : string;
export const FacetsRed100 : string;
export const FacetsRed200 : string;
export const FacetsRed300 : string;
export const FacetsRed400 : string;
export const FacetsRed500 : string;
export const FacetsRed600 : string;
export const FacetsRed700 : string;
export const FacetsRed800 : string;
export const FacetsRed900 : string;
export const FacetsRed000 : string;
export const FacetsPink100 : string;
export const FacetsPink200 : string;
export const FacetsPink300 : string;
export const FacetsPink400 : string;
export const FacetsPink500 : string;
export const FacetsPink600 : string;
export const FacetsPink700 : string;
export const FacetsPink800 : string;
export const FacetsPink900 : string;
export const FacetsPink000 : string;
export const FacetsPurple100 : string;
export const FacetsPurple200 : string;
export const FacetsPurple300 : string;
export const FacetsPurple400 : string;
export const FacetsPurple500 : string;
export const FacetsPurple600 : string;
export const FacetsPurple700 : string;
export const FacetsPurple800 : string;
export const FacetsPurple900 : string;
export const FacetsPurple000 : string;
export const FacetsBlue100 : string;
export const FacetsBlue200 : string;
export const FacetsBlue300 : string;
export const FacetsBlue400 : string;
export const FacetsBlue500 : string;
export const FacetsBlue600 : string;
export const FacetsBlue700 : string;
export const FacetsBlue800 : string;
export const FacetsBlue900 : string;
export const FacetsBlue000 : string;
/** renamed from opacity0 from the app */

@@ -91,0 +91,0 @@ export const EffectOpacity0 : number;

module.exports = {
"color": {
"facets": {
"neutral": {

@@ -12,5 +12,5 @@ "light": {

},
"name": "ColorNeutralLight100",
"name": "FacetsNeutralLight100",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -21,3 +21,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -35,5 +35,5 @@ "light",

},
"name": "ColorNeutralLight200",
"name": "FacetsNeutralLight200",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -44,3 +44,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -58,5 +58,5 @@ "light",

},
"name": "ColorNeutralLight300",
"name": "FacetsNeutralLight300",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -67,3 +67,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -81,5 +81,5 @@ "light",

},
"name": "ColorNeutralLight400",
"name": "FacetsNeutralLight400",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -90,3 +90,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -104,5 +104,5 @@ "light",

},
"name": "ColorNeutralLight500",
"name": "FacetsNeutralLight500",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -113,3 +113,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -127,5 +127,5 @@ "light",

},
"name": "ColorNeutralLight600",
"name": "FacetsNeutralLight600",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -136,3 +136,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -150,5 +150,5 @@ "light",

},
"name": "ColorNeutralLight700",
"name": "FacetsNeutralLight700",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -159,3 +159,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -173,5 +173,5 @@ "light",

},
"name": "ColorNeutralLight800",
"name": "FacetsNeutralLight800",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -182,3 +182,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -196,5 +196,5 @@ "light",

},
"name": "ColorNeutralLight000",
"name": "FacetsNeutralLight000",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -205,3 +205,3 @@ "item": "light",

"path": [
"color",
"facets",
"neutral",

@@ -221,5 +221,5 @@ "light",

},
"name": "ColorNeutralDark100",
"name": "FacetsNeutralDark100",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -230,3 +230,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -244,5 +244,5 @@ "dark",

},
"name": "ColorNeutralDark200",
"name": "FacetsNeutralDark200",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -253,3 +253,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -267,5 +267,5 @@ "dark",

},
"name": "ColorNeutralDark300",
"name": "FacetsNeutralDark300",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -276,3 +276,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -290,5 +290,5 @@ "dark",

},
"name": "ColorNeutralDark400",
"name": "FacetsNeutralDark400",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -299,3 +299,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -313,5 +313,5 @@ "dark",

},
"name": "ColorNeutralDark500",
"name": "FacetsNeutralDark500",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -322,3 +322,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -336,5 +336,5 @@ "dark",

},
"name": "ColorNeutralDark600",
"name": "FacetsNeutralDark600",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -345,3 +345,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -359,5 +359,5 @@ "dark",

},
"name": "ColorNeutralDark700",
"name": "FacetsNeutralDark700",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -368,3 +368,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -382,5 +382,5 @@ "dark",

},
"name": "ColorNeutralDark800",
"name": "FacetsNeutralDark800",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -391,3 +391,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -405,5 +405,5 @@ "dark",

},
"name": "ColorNeutralDark900",
"name": "FacetsNeutralDark900",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -414,3 +414,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -428,5 +428,5 @@ "dark",

},
"name": "ColorNeutralDark000",
"name": "FacetsNeutralDark000",
"attributes": {
"category": "color",
"category": "facets",
"type": "neutral",

@@ -437,3 +437,3 @@ "item": "dark",

"path": [
"color",
"facets",
"neutral",

@@ -454,5 +454,5 @@ "dark",

},
"name": "ColorTeal100",
"name": "FacetsTeal100",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -462,3 +462,3 @@ "item": "100"

"path": [
"color",
"facets",
"teal",

@@ -475,5 +475,5 @@ "100"

},
"name": "ColorTeal200",
"name": "FacetsTeal200",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -483,3 +483,3 @@ "item": "200"

"path": [
"color",
"facets",
"teal",

@@ -496,5 +496,5 @@ "200"

},
"name": "ColorTeal300",
"name": "FacetsTeal300",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -504,3 +504,3 @@ "item": "300"

"path": [
"color",
"facets",
"teal",

@@ -517,5 +517,5 @@ "300"

},
"name": "ColorTeal400",
"name": "FacetsTeal400",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -525,3 +525,3 @@ "item": "400"

"path": [
"color",
"facets",
"teal",

@@ -538,5 +538,5 @@ "400"

},
"name": "ColorTeal500",
"name": "FacetsTeal500",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -546,3 +546,3 @@ "item": "500"

"path": [
"color",
"facets",
"teal",

@@ -559,5 +559,5 @@ "500"

},
"name": "ColorTeal600",
"name": "FacetsTeal600",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -567,3 +567,3 @@ "item": "600"

"path": [
"color",
"facets",
"teal",

@@ -580,5 +580,5 @@ "600"

},
"name": "ColorTeal700",
"name": "FacetsTeal700",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -588,3 +588,3 @@ "item": "700"

"path": [
"color",
"facets",
"teal",

@@ -601,5 +601,5 @@ "700"

},
"name": "ColorTeal800",
"name": "FacetsTeal800",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -609,3 +609,3 @@ "item": "800"

"path": [
"color",
"facets",
"teal",

@@ -622,5 +622,5 @@ "800"

},
"name": "ColorTeal900",
"name": "FacetsTeal900",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -630,3 +630,3 @@ "item": "900"

"path": [
"color",
"facets",
"teal",

@@ -643,5 +643,5 @@ "900"

},
"name": "ColorTeal000",
"name": "FacetsTeal000",
"attributes": {
"category": "color",
"category": "facets",
"type": "teal",

@@ -651,3 +651,3 @@ "item": "000"

"path": [
"color",
"facets",
"teal",

@@ -666,5 +666,5 @@ "000"

},
"name": "ColorGreen100",
"name": "FacetsGreen100",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -674,3 +674,3 @@ "item": "100"

"path": [
"color",
"facets",
"green",

@@ -687,5 +687,5 @@ "100"

},
"name": "ColorGreen200",
"name": "FacetsGreen200",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -695,3 +695,3 @@ "item": "200"

"path": [
"color",
"facets",
"green",

@@ -708,5 +708,5 @@ "200"

},
"name": "ColorGreen300",
"name": "FacetsGreen300",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -716,3 +716,3 @@ "item": "300"

"path": [
"color",
"facets",
"green",

@@ -729,5 +729,5 @@ "300"

},
"name": "ColorGreen400",
"name": "FacetsGreen400",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -737,3 +737,3 @@ "item": "400"

"path": [
"color",
"facets",
"green",

@@ -750,5 +750,5 @@ "400"

},
"name": "ColorGreen500",
"name": "FacetsGreen500",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -758,3 +758,3 @@ "item": "500"

"path": [
"color",
"facets",
"green",

@@ -771,5 +771,5 @@ "500"

},
"name": "ColorGreen600",
"name": "FacetsGreen600",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -779,3 +779,3 @@ "item": "600"

"path": [
"color",
"facets",
"green",

@@ -792,5 +792,5 @@ "600"

},
"name": "ColorGreen700",
"name": "FacetsGreen700",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -800,3 +800,3 @@ "item": "700"

"path": [
"color",
"facets",
"green",

@@ -813,5 +813,5 @@ "700"

},
"name": "ColorGreen800",
"name": "FacetsGreen800",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -821,3 +821,3 @@ "item": "800"

"path": [
"color",
"facets",
"green",

@@ -834,5 +834,5 @@ "800"

},
"name": "ColorGreen900",
"name": "FacetsGreen900",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -842,3 +842,3 @@ "item": "900"

"path": [
"color",
"facets",
"green",

@@ -855,5 +855,5 @@ "900"

},
"name": "ColorGreen000",
"name": "FacetsGreen000",
"attributes": {
"category": "color",
"category": "facets",
"type": "green",

@@ -863,3 +863,3 @@ "item": "000"

"path": [
"color",
"facets",
"green",

@@ -878,5 +878,5 @@ "000"

},
"name": "ColorGold100",
"name": "FacetsGold100",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -886,3 +886,3 @@ "item": "100"

"path": [
"color",
"facets",
"gold",

@@ -899,5 +899,5 @@ "100"

},
"name": "ColorGold200",
"name": "FacetsGold200",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -907,3 +907,3 @@ "item": "200"

"path": [
"color",
"facets",
"gold",

@@ -920,5 +920,5 @@ "200"

},
"name": "ColorGold300",
"name": "FacetsGold300",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -928,3 +928,3 @@ "item": "300"

"path": [
"color",
"facets",
"gold",

@@ -941,5 +941,5 @@ "300"

},
"name": "ColorGold400",
"name": "FacetsGold400",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -949,3 +949,3 @@ "item": "400"

"path": [
"color",
"facets",
"gold",

@@ -962,5 +962,5 @@ "400"

},
"name": "ColorGold500",
"name": "FacetsGold500",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -970,3 +970,3 @@ "item": "500"

"path": [
"color",
"facets",
"gold",

@@ -983,5 +983,5 @@ "500"

},
"name": "ColorGold600",
"name": "FacetsGold600",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -991,3 +991,3 @@ "item": "600"

"path": [
"color",
"facets",
"gold",

@@ -1004,5 +1004,5 @@ "600"

},
"name": "ColorGold700",
"name": "FacetsGold700",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -1012,3 +1012,3 @@ "item": "700"

"path": [
"color",
"facets",
"gold",

@@ -1025,5 +1025,5 @@ "700"

},
"name": "ColorGold800",
"name": "FacetsGold800",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -1033,3 +1033,3 @@ "item": "800"

"path": [
"color",
"facets",
"gold",

@@ -1046,5 +1046,5 @@ "800"

},
"name": "ColorGold900",
"name": "FacetsGold900",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -1054,3 +1054,3 @@ "item": "900"

"path": [
"color",
"facets",
"gold",

@@ -1067,5 +1067,5 @@ "900"

},
"name": "ColorGold000",
"name": "FacetsGold000",
"attributes": {
"category": "color",
"category": "facets",
"type": "gold",

@@ -1075,3 +1075,3 @@ "item": "000"

"path": [
"color",
"facets",
"gold",

@@ -1090,5 +1090,5 @@ "000"

},
"name": "ColorRed100",
"name": "FacetsRed100",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1098,3 +1098,3 @@ "item": "100"

"path": [
"color",
"facets",
"red",

@@ -1111,5 +1111,5 @@ "100"

},
"name": "ColorRed200",
"name": "FacetsRed200",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1119,3 +1119,3 @@ "item": "200"

"path": [
"color",
"facets",
"red",

@@ -1132,5 +1132,5 @@ "200"

},
"name": "ColorRed300",
"name": "FacetsRed300",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1140,3 +1140,3 @@ "item": "300"

"path": [
"color",
"facets",
"red",

@@ -1153,5 +1153,5 @@ "300"

},
"name": "ColorRed400",
"name": "FacetsRed400",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1161,3 +1161,3 @@ "item": "400"

"path": [
"color",
"facets",
"red",

@@ -1174,5 +1174,5 @@ "400"

},
"name": "ColorRed500",
"name": "FacetsRed500",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1182,3 +1182,3 @@ "item": "500"

"path": [
"color",
"facets",
"red",

@@ -1195,5 +1195,5 @@ "500"

},
"name": "ColorRed600",
"name": "FacetsRed600",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1203,3 +1203,3 @@ "item": "600"

"path": [
"color",
"facets",
"red",

@@ -1216,5 +1216,5 @@ "600"

},
"name": "ColorRed700",
"name": "FacetsRed700",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1224,3 +1224,3 @@ "item": "700"

"path": [
"color",
"facets",
"red",

@@ -1237,5 +1237,5 @@ "700"

},
"name": "ColorRed800",
"name": "FacetsRed800",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1245,3 +1245,3 @@ "item": "800"

"path": [
"color",
"facets",
"red",

@@ -1258,5 +1258,5 @@ "800"

},
"name": "ColorRed900",
"name": "FacetsRed900",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1266,3 +1266,3 @@ "item": "900"

"path": [
"color",
"facets",
"red",

@@ -1279,5 +1279,5 @@ "900"

},
"name": "ColorRed000",
"name": "FacetsRed000",
"attributes": {
"category": "color",
"category": "facets",
"type": "red",

@@ -1287,3 +1287,3 @@ "item": "000"

"path": [
"color",
"facets",
"red",

@@ -1302,5 +1302,5 @@ "000"

},
"name": "ColorPink100",
"name": "FacetsPink100",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1310,3 +1310,3 @@ "item": "100"

"path": [
"color",
"facets",
"pink",

@@ -1323,5 +1323,5 @@ "100"

},
"name": "ColorPink200",
"name": "FacetsPink200",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1331,3 +1331,3 @@ "item": "200"

"path": [
"color",
"facets",
"pink",

@@ -1344,5 +1344,5 @@ "200"

},
"name": "ColorPink300",
"name": "FacetsPink300",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1352,3 +1352,3 @@ "item": "300"

"path": [
"color",
"facets",
"pink",

@@ -1365,5 +1365,5 @@ "300"

},
"name": "ColorPink400",
"name": "FacetsPink400",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1373,3 +1373,3 @@ "item": "400"

"path": [
"color",
"facets",
"pink",

@@ -1386,5 +1386,5 @@ "400"

},
"name": "ColorPink500",
"name": "FacetsPink500",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1394,3 +1394,3 @@ "item": "500"

"path": [
"color",
"facets",
"pink",

@@ -1407,5 +1407,5 @@ "500"

},
"name": "ColorPink600",
"name": "FacetsPink600",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1415,3 +1415,3 @@ "item": "600"

"path": [
"color",
"facets",
"pink",

@@ -1428,5 +1428,5 @@ "600"

},
"name": "ColorPink700",
"name": "FacetsPink700",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1436,3 +1436,3 @@ "item": "700"

"path": [
"color",
"facets",
"pink",

@@ -1449,5 +1449,5 @@ "700"

},
"name": "ColorPink800",
"name": "FacetsPink800",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1457,3 +1457,3 @@ "item": "800"

"path": [
"color",
"facets",
"pink",

@@ -1470,5 +1470,5 @@ "800"

},
"name": "ColorPink900",
"name": "FacetsPink900",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1478,3 +1478,3 @@ "item": "900"

"path": [
"color",
"facets",
"pink",

@@ -1491,5 +1491,5 @@ "900"

},
"name": "ColorPink000",
"name": "FacetsPink000",
"attributes": {
"category": "color",
"category": "facets",
"type": "pink",

@@ -1499,3 +1499,3 @@ "item": "000"

"path": [
"color",
"facets",
"pink",

@@ -1514,5 +1514,5 @@ "000"

},
"name": "ColorPurple100",
"name": "FacetsPurple100",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1522,3 +1522,3 @@ "item": "100"

"path": [
"color",
"facets",
"purple",

@@ -1535,5 +1535,5 @@ "100"

},
"name": "ColorPurple200",
"name": "FacetsPurple200",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1543,3 +1543,3 @@ "item": "200"

"path": [
"color",
"facets",
"purple",

@@ -1556,5 +1556,5 @@ "200"

},
"name": "ColorPurple300",
"name": "FacetsPurple300",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1564,3 +1564,3 @@ "item": "300"

"path": [
"color",
"facets",
"purple",

@@ -1577,5 +1577,5 @@ "300"

},
"name": "ColorPurple400",
"name": "FacetsPurple400",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1585,3 +1585,3 @@ "item": "400"

"path": [
"color",
"facets",
"purple",

@@ -1598,5 +1598,5 @@ "400"

},
"name": "ColorPurple500",
"name": "FacetsPurple500",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1606,3 +1606,3 @@ "item": "500"

"path": [
"color",
"facets",
"purple",

@@ -1619,5 +1619,5 @@ "500"

},
"name": "ColorPurple600",
"name": "FacetsPurple600",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1627,3 +1627,3 @@ "item": "600"

"path": [
"color",
"facets",
"purple",

@@ -1640,5 +1640,5 @@ "600"

},
"name": "ColorPurple700",
"name": "FacetsPurple700",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1648,3 +1648,3 @@ "item": "700"

"path": [
"color",
"facets",
"purple",

@@ -1661,5 +1661,5 @@ "700"

},
"name": "ColorPurple800",
"name": "FacetsPurple800",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1669,3 +1669,3 @@ "item": "800"

"path": [
"color",
"facets",
"purple",

@@ -1682,5 +1682,5 @@ "800"

},
"name": "ColorPurple900",
"name": "FacetsPurple900",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1690,3 +1690,3 @@ "item": "900"

"path": [
"color",
"facets",
"purple",

@@ -1703,5 +1703,5 @@ "900"

},
"name": "ColorPurple000",
"name": "FacetsPurple000",
"attributes": {
"category": "color",
"category": "facets",
"type": "purple",

@@ -1711,3 +1711,3 @@ "item": "000"

"path": [
"color",
"facets",
"purple",

@@ -1726,5 +1726,5 @@ "000"

},
"name": "ColorBlue100",
"name": "FacetsBlue100",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1734,3 +1734,3 @@ "item": "100"

"path": [
"color",
"facets",
"blue",

@@ -1747,5 +1747,5 @@ "100"

},
"name": "ColorBlue200",
"name": "FacetsBlue200",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1755,3 +1755,3 @@ "item": "200"

"path": [
"color",
"facets",
"blue",

@@ -1768,5 +1768,5 @@ "200"

},
"name": "ColorBlue300",
"name": "FacetsBlue300",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1776,3 +1776,3 @@ "item": "300"

"path": [
"color",
"facets",
"blue",

@@ -1789,5 +1789,5 @@ "300"

},
"name": "ColorBlue400",
"name": "FacetsBlue400",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1797,3 +1797,3 @@ "item": "400"

"path": [
"color",
"facets",
"blue",

@@ -1810,5 +1810,5 @@ "400"

},
"name": "ColorBlue500",
"name": "FacetsBlue500",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1818,3 +1818,3 @@ "item": "500"

"path": [
"color",
"facets",
"blue",

@@ -1831,5 +1831,5 @@ "500"

},
"name": "ColorBlue600",
"name": "FacetsBlue600",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1839,3 +1839,3 @@ "item": "600"

"path": [
"color",
"facets",
"blue",

@@ -1852,5 +1852,5 @@ "600"

},
"name": "ColorBlue700",
"name": "FacetsBlue700",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1860,3 +1860,3 @@ "item": "700"

"path": [
"color",
"facets",
"blue",

@@ -1873,5 +1873,5 @@ "700"

},
"name": "ColorBlue800",
"name": "FacetsBlue800",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1881,3 +1881,3 @@ "item": "800"

"path": [
"color",
"facets",
"blue",

@@ -1894,5 +1894,5 @@ "800"

},
"name": "ColorBlue900",
"name": "FacetsBlue900",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1902,3 +1902,3 @@ "item": "900"

"path": [
"color",
"facets",
"blue",

@@ -1915,5 +1915,5 @@ "900"

},
"name": "ColorBlue000",
"name": "FacetsBlue000",
"attributes": {
"category": "color",
"category": "facets",
"type": "blue",

@@ -1923,3 +1923,3 @@ "item": "000"

"path": [
"color",
"facets",
"blue",

@@ -1926,0 +1926,0 @@ "000"

{
"color": {
"facets": {
"neutral": {

@@ -4,0 +4,0 @@ "light": {

{
"color": {
"facets": {
"neutral": {

@@ -4,0 +4,0 @@ "light": {

{
"name": "@netlify/netlify-design-tokens",
"version": "6.0.0-beta.3",
"version": "6.0.0-beta.4",
"private": false,

@@ -5,0 +5,0 @@ "description": "Netlify's design tokens for sharing across products and repos",

@@ -15,20 +15,53 @@ # Netlify Design Tokens [![NPM version](https://img.shields.io/npm/v/@netlify/netlify-design-tokens.svg)](https://npmjs.com/@netlify/netlify-design-tokens)

Basic usage:
```css
@import '@netlify/netlify-design-tokens/dist/css/colors';
@import '@netlify/netlify-design-tokens/dist/css/colors.css';
.myComponent {
color: var(--color-teal-200);
}
```
Global dark mode support:
```css
@import '@netlify/netlify-design-tokens/dist/css/colors.css';
:root {
--colorBlack: var(--color-black-default);
--colorTeal: var(--facets-teal-200);
}
@media (prefers-color-scheme: dark) {
:root {
--colorTeal: var(--facets-teal-500);
}
}
.myComponent {
color: var(--colorTeal);
}
```
### SCSS
Alternatively, use the `rgb(<color> / <alpha>)` notation to vary color opacity:
```scss
@import '@netlify/netlify-design-tokens/dist/scss/colors';
```css
@import '@netlify/netlify-design-tokens/dist/css/facets.tailwind.css';
:root {
--colorTeal: var(--facetsTeal200);
}
$black: $color-black-default;
@media (prefers-color-scheme: dark) {
:root {
--colorTeal: var(--facetsTeal200);
}
}
.myComponent {
color: rgb(var(--colorTeal) / 50%);
}
```
### Javascript
### JavaScript

@@ -38,3 +71,3 @@ ```js

const black = tokens.color.black.default;
const teal = tokens.facets.teal.500;
```

Sorry, the diff of this file is not supported yet