Werte

Alle Primitives und Semantics Variablen inklusive Wert, im gleichen Stil wie die Variablen-Seite.

Werte-Dateien

Primitives Farben (tokens/primitives/_colors.scss)

Indigo (11)

#50adbb

#4ca1af

#4895a3

#448897

#407c8b

#3c7080

#386374

#345768

#304a5c

#2c3e50

#283244

Indigolight (11)

#f4fafa

#eaf4f6

#ddedf0

#cde5e9

#bbdce2

#a9d3da

#94c8d1

#7fbdc8

#6db4c0

#5babb8

#4ca1af

Velvet (11)

#f8f8f6

#f2f2f2

#e9e9e6

#e1e0db

#d8d7d0

#d0cec4

#c7c4b9

#beb2a0

#b6aaa1

#ada996

#a4a08b

Bronze (11)

#9b8470

#8e735b

#847054

#79664d

#6f5d45

#64543d

#5a4b36

#4f412e

#453826

#3c2a21

#341d17

Ocean (11)

#306c6c

#2c5364

#284d5c

#254555

#22404d

#1f3a46

#1c333e

#162d36

#13262f

#0f2027

#0b1a1f

Oceanlight (11)

#f4f9fa

#e5eff4

#d3e4ec

#bdd6e2

#a2c7d6

#88b7cb

#6ba4be

#4d92b0

#427c96

#36677c

#2c5364

Sky (11)

#2d5b81

#294678

#26416e

#233a66

#20365c

#1d3154

#1a2b4a

#142640

#122038

#0e1b2e

#0a1625

Skylight (11)

#f4f6fb

#e4ebf6

#d2ddef

#bbcce7

#a0b8de

#86a3d5

#678dcb

#4976c0

#3b65ab

#325590

#294778

Emerald (11)

#7fbd95

#71b280

#69aa7a

#619f6d

#589360

#508957

#4a8e6c

#407a67

#3a6b63

#134e5e

#094353

Mocha (11)

#bb9d96

#b79891

#b39c8c

#ae8e88

#aa8983

#a6857e

#a18079

#9d7b75

#987670

#94716b

#906c66

Charcoal (11)

#4a4c4f

#414345

#3d3f42

#393b3e

#35373a

#323437

#2e3033

#2b2c30

#27292c

#232529

#1f2125

Charcoallight (11)

#f7f7f8

#ececed

#dedfe0

#cdcecf

#b9bbbd

#a5a7aa

#8e9195

#787b7f

#65686b

#525557

#414345

Gray (11)

#ffffff

#f5f5f5

#cbcbcb

#a1a1a2

#757679

#4a4c4f

#323437

#1f2125

#171b1b

#0f1012

#000000

Champagne (11)

#fdefd2

#fceabb

#fce3a4

#fbdd8c

#fbd675

#fad05e

#fac946

#f9c22f

#f9bc17

#f8b500

#f8ae00

Crimson (11)

#a25145

#9a4d42

#92493f

#8a443b

#824038

#7a3c34

#723731

#6a332e

#622e2a

#5a2a27

#522624

Crimsonlight (11)

#faf5f4

#f5eae9

#efdcda

#e8ccc8

#dfb9b4

#d6a69f

#cc9088

#c27a70

#b9675b

#ad564a

#9a4d42

Primitives Abstaende (tokens/primitives/_spaces.scss)

Space-Skala (14)

0.25rem

4px

0.5rem

8px

0.75rem

12px

1rem

16px

1.5rem

24px

2rem

32px

2.5rem

40px

3rem

48px

3.5rem

56px

4rem

64px

4.5rem

72px

5rem

80px

5.5rem

88px

6rem

96px

Primitives Radius (tokens/primitives/_radius.scss)

Radius-Skala (7)

0.0625rem

1px

0.125rem

2px

0.25rem

4px

0.375rem

6px

0.75rem

12px

1.125rem

18px

1.5rem

24px

Primitives Typografie (tokens/primitives/_typographie.scss)

Textgroessen (5)

12px

16px

18px

22px

28px

Semantics Farben (tokens/semantics/_colors.scss)

Indigo (11)

#50adbb

Semantischer Alias von $indigo050

#4ca1af

Semantischer Alias von $indigo100

#4895a3

Semantischer Alias von $indigo200

#448897

Semantischer Alias von $indigo300

#407c8b

Semantischer Alias von $indigo400

#3c7080

Semantischer Alias von $indigo500

#386374

Semantischer Alias von $indigo600

#345768

Semantischer Alias von $indigo700

#304a5c

Semantischer Alias von $indigo800

#2c3e50

Semantischer Alias von $indigo900

#283244

Semantischer Alias von $indigo950

Indigolight (11)

#f4fafa

Semantischer Alias von $indigolight050

#eaf4f6

Semantischer Alias von $indigolight100

#ddedf0

Semantischer Alias von $indigolight200

#cde5e9

Semantischer Alias von $indigolight300

#bbdce2

Semantischer Alias von $indigolight400

#a9d3da

Semantischer Alias von $indigolight500

#94c8d1

Semantischer Alias von $indigolight600

#7fbdc8

Semantischer Alias von $indigolight700

#6db4c0

Semantischer Alias von $indigolight800

#5babb8

Semantischer Alias von $indigolight900

#4ca1af

Semantischer Alias von $indigolight950

Velvet (11)

#f8f8f6

Semantischer Alias von $velvet050

#f2f2f2

Semantischer Alias von $velvet100

#e9e9e6

Semantischer Alias von $velvet200

#e1e0db

Semantischer Alias von $velvet300

#d8d7d0

Semantischer Alias von $velvet400

#d0cec4

Semantischer Alias von $velvet500

#c7c4b9

Semantischer Alias von $velvet600

#beb2a0

Semantischer Alias von $velvet700

#b6aaa1

Semantischer Alias von $velvet800

#ada996

Semantischer Alias von $velvet900

#a4a08b

Semantischer Alias von $velvet950

Bronze (11)

#9b8470

Semantischer Alias von $bronze050

#8e735b

Semantischer Alias von $bronze100

#847054

Semantischer Alias von $bronze200

#79664d

Semantischer Alias von $bronze300

#6f5d45

Semantischer Alias von $bronze400

#64543d

Semantischer Alias von $bronze500

#5a4b36

Semantischer Alias von $bronze600

#4f412e

Semantischer Alias von $bronze700

#453826

Semantischer Alias von $bronze800

#3c2a21

Semantischer Alias von $bronze900

#341d17

Semantischer Alias von $bronze950

Ocean (11)

#306c6c

Semantischer Alias von $ocean050

#2c5364

Semantischer Alias von $ocean100

#284d5c

Semantischer Alias von $ocean200

#254555

Semantischer Alias von $ocean300

#22404d

Semantischer Alias von $ocean400

#1f3a46

Semantischer Alias von $ocean500

#1c333e

Semantischer Alias von $ocean600

#162d36

Semantischer Alias von $ocean700

#13262f

Semantischer Alias von $ocean800

#0f2027

Semantischer Alias von $ocean900

#0b1a1f

Semantischer Alias von $ocean950

Oceanlight (11)

#f4f9fa

Semantischer Alias von $oceanlight050

#e5eff4

Semantischer Alias von $oceanlight100

#d3e4ec

Semantischer Alias von $oceanlight200

#bdd6e2

Semantischer Alias von $oceanlight300

#a2c7d6

Semantischer Alias von $oceanlight400

#88b7cb

Semantischer Alias von $oceanlight500

#6ba4be

Semantischer Alias von $oceanlight600

#4d92b0

Semantischer Alias von $oceanlight700

#427c96

Semantischer Alias von $oceanlight800

#36677c

Semantischer Alias von $oceanlight900

#2c5364

Semantischer Alias von $oceanlight950

Sky (11)

#2d5b81

Semantischer Alias von $sky050

#294678

Semantischer Alias von $sky100

#26416e

Semantischer Alias von $sky200

#233a66

Semantischer Alias von $sky300

#20365c

Semantischer Alias von $sky400

#1d3154

Semantischer Alias von $sky500

#1a2b4a

Semantischer Alias von $sky600

#142640

Semantischer Alias von $sky700

#122038

Semantischer Alias von $sky800

#0e1b2e

Semantischer Alias von $sky900

#0a1625

Semantischer Alias von $sky950

Skylight (11)

#f4f6fb

Semantischer Alias von $skylight050

#e4ebf6

Semantischer Alias von $skylight100

#d2ddef

Semantischer Alias von $skylight200

#bbcce7

Semantischer Alias von $skylight300

#a0b8de

Semantischer Alias von $skylight400

#86a3d5

Semantischer Alias von $skylight500

#678dcb

Semantischer Alias von $skylight600

#4976c0

Semantischer Alias von $skylight700

#3b65ab

Semantischer Alias von $skylight800

#325590

Semantischer Alias von $skylight900

#294778

Semantischer Alias von $skylight950

Emerald (11)

#7fbd95

Semantischer Alias von $emerald050

#71b280

Semantischer Alias von $emerald100

#69aa7a

Semantischer Alias von $emerald200

#619f6d

Semantischer Alias von $emerald300

#589360

Semantischer Alias von $emerald400

#508957

Semantischer Alias von $emerald500

#4a8e6c

Semantischer Alias von $emerald600

#407a67

Semantischer Alias von $emerald700

#3a6b63

Semantischer Alias von $emerald800

#134e5e

Semantischer Alias von $emerald900

#094353

Semantischer Alias von $emerald950

Mocha (11)

#bb9d96

Semantischer Alias von $mocha050

#b79891

Semantischer Alias von $mocha100

#b39c8c

Semantischer Alias von $mocha200

#ae8e88

Semantischer Alias von $mocha300

#aa8983

Semantischer Alias von $mocha400

#a6857e

Semantischer Alias von $mocha500

#a18079

Semantischer Alias von $mocha600

#9d7b75

Semantischer Alias von $mocha700

#987670

Semantischer Alias von $mocha800

#94716b

Semantischer Alias von $mocha900

#906c66

Semantischer Alias von $mocha950

Charcoal (11)

#4a4c4f

Semantischer Alias von $charcoal050

#414345

Semantischer Alias von $charcoal100

#3d3f42

Semantischer Alias von $charcoal200

#393b3e

Semantischer Alias von $charcoal300

#35373a

Semantischer Alias von $charcoal400

#323437

Semantischer Alias von $charcoal500

#2e3033

Semantischer Alias von $charcoal600

#2b2c30

Semantischer Alias von $charcoal700

#27292c

Semantischer Alias von $charcoal800

#232529

Semantischer Alias von $charcoal900

#1f2125

Semantischer Alias von $charcoal950

Charcoallight (11)

#f7f7f8

Semantischer Alias von $charcoallight050

#ececed

Semantischer Alias von $charcoallight100

#dedfe0

Semantischer Alias von $charcoallight200

#cdcecf

Semantischer Alias von $charcoallight300

#b9bbbd

Semantischer Alias von $charcoallight400

#a5a7aa

Semantischer Alias von $charcoallight500

#8e9195

Semantischer Alias von $charcoallight600

#787b7f

Semantischer Alias von $charcoallight700

#65686b

Semantischer Alias von $charcoallight800

#525557

Semantischer Alias von $charcoallight900

#414345

Semantischer Alias von $charcoallight950

Gray (11)

#ffffff

Semantischer Alias von $gray050

#f5f5f5

Semantischer Alias von $gray100

#cbcbcb

Semantischer Alias von $gray200

#a1a1a2

Semantischer Alias von $gray300

#757679

Semantischer Alias von $gray400

#4a4c4f

Semantischer Alias von $gray500

#323437

Semantischer Alias von $gray600

#1f2125

Semantischer Alias von $gray700

#171b1b

Semantischer Alias von $gray800

#0f1012

Semantischer Alias von $gray900

#000000

Semantischer Alias von $gray950

Champagne (11)

#fdefd2

Semantischer Alias von $champagne050

#fceabb

Semantischer Alias von $champagne100

#fce3a4

Semantischer Alias von $champagne200

#fbdd8c

Semantischer Alias von $champagne300

#fbd675

Semantischer Alias von $champagne400

#fad05e

Semantischer Alias von $champagne500

#fac946

Semantischer Alias von $champagne600

#f9c22f

Semantischer Alias von $champagne700

#f9bc17

Semantischer Alias von $champagne800

#f8b500

Semantischer Alias von $champagne900

#f8ae00

Semantischer Alias von $champagne950

Crimson (11)

#a25145

Semantischer Alias von $crimson050

#9a4d42

Semantischer Alias von $crimson100

#92493f

Semantischer Alias von $crimson200

#8a443b

Semantischer Alias von $crimson300

#824038

Semantischer Alias von $crimson400

#7a3c34

Semantischer Alias von $crimson500

#723731

Semantischer Alias von $crimson600

#6a332e

Semantischer Alias von $crimson700

#622e2a

Semantischer Alias von $crimson800

#5a2a27

Semantischer Alias von $crimson900

#522624

Semantischer Alias von $crimson950

Crimsonlight (12)

#faf5f4

Semantischer Alias von $crimsonlight050

#f5eae9

Semantischer Alias von $crimsonlight100

#efdcda

Semantischer Alias von $crimsonlight200

#e8ccc8

Semantischer Alias von $crimsonlight300

#dfb9b4

Semantischer Alias von $crimsonlight400

#d6a69f

Semantischer Alias von $crimsonlight500

#cc9088

Semantischer Alias von $crimsonlight600

#c27a70

Semantischer Alias von $crimsonlight700

#b9675b

Semantischer Alias von $crimsonlight800

#ad564a

Semantischer Alias von $crimsonlight900

#9a4d42

Semantischer Alias von $crimsonlight950

#9a4d42

Semantischer Alias von $crimsonlight950

Semantics Abstaende (tokens/semantics/_spaces.scss)

Space-Ebenen (9)

p.$space02

p.$space05

p.$space07

p.$space10

p.$space15

p.$space20

p.$space30

p.$space40

p.$space60