Токены
Дизайн-токены — это набор базовых переменных визуального языка: отступы, цвет, типографика, стиль элементов, представленный в виде текстовых данных. Токены используют вместо жестко запрограммированных значений, чтобы было легко управлять визуальным стилем и обеспечивать единство во всех продуктах.
Что это?
Дизайн-токены интегрированы в библиотеку компонентов. Они охватывают разные цветовые темы, состояния компонентов и многое другое. Название цветов и типографики в наших библиотеках в Figma соответствуют названию токена в репозитории. Это упрощает разработку: например, если изменить цвет в репозитории, он изменится в нескольких продуктах.
Использование
Дизайн-токены собраны в один json файл, который дизайнеры при необходимости обновляют и передают разработчикам в удобном для них формате.
Токены для разработки
elements-height-L
elements-height-M
elements-height-S
elements-height-XS
elements-height-XXS
elements-height-XXXS
elements-height-XXXS
48px
40px
32px
24px
16px
12px
8px
elements-spacing-gap-x0
elements-spacing-gap-x0,25
elements-spacing-gap-x0,5
elements-spacing-gap-x1
elements-spacing-gap-x1,5
elements-spacing-gap-x2
elements-spacing-gap-x2,5
elements-spacing-gap-x3
elements-spacing-gap-x3,5
elements-spacing-gap-x4
elements-spacing-gap-x4,5
elements-spacing-gap-x5
elements-spacing-gap-x5,5
elements-spacing-gap-x6
elements-spacing-gap-x6,5
elements-spacing-gap-x7
elements-spacing-gap-x7,5
elements-spacing-gap-x8
elements-spacing-gap-x8,5
elements-spacing-gap-x9
elements-spacing-gap-x9,5
elements-spacing-gap-x10
0px
2px
4px
8px
12px
16px
20px
24px
28px
32px
36px
40px
44px
48px
52px
56px
60px
64px
68px
72px
76px
80px
Элементы (Elements)
Отступы (между внутренними элементами)
Размер
Отступы (паддинги)
elements-spacing-padding-x0
elements-spacing-padding-x0,25
elements-spacing-padding-x0,5
elements-spacing-padding-x1
elements-spacing-padding-x1,5
elements-spacing-padding-x2
elements-spacing-padding-x2,5
elements-spacing-padding-x3
elements-spacing-padding-x3,5
elements-spacing-padding-x4
elements-spacing-padding-x4,5
elements-spacing-padding-x5
elements-spacing-padding-x5,5
elements-spacing-padding-x6
elements-spacing-padding-x6,5
elements-spacing-padding-x7
elements-spacing-padding-x7,5
elements-spacing-padding-x8
elements-spacing-padding-x8,5
elements-spacing-padding-x9
elements-spacing-padding-x9,5
elements-spacing-padding-x10
0px
2px
4px
8px
12px
16px
20px
24px
28px
32px
36px
40px
44px
48px
52px
56px
60px
64px
68px
72px
76px
80px
Отступы внешние (марджины)
elements-spacing-margin-x0
elements-spacing-margin-x0,25
elements-spacing-margin-x0,5
elements-spacing-margin-x0,75
elements-spacing-margin-x1
elements-spacing-margin-x1,5
elements-spacing-margin-x2
elements-spacing-margin-x2,5
elements-spacing-margin-x3
elements-spacing-margin-x3,5
elements-spacing-margin-x4
elements-spacing-margin-x4,5
elements-spacing-margin-x5
elements-spacing-margin-x5,5
elements-spacing-margin-x6
elements-spacing-margin-x6,5
elements-spacing-margin-x7
elements-spacing-margin-x7,5
elements-spacing-margin-x8
elements-spacing-margin-x8,5
elements-spacing-margin-x9
elements-spacing-margin-x9,5
elements-spacing-margin-x10
0px
2px
4px
6px
8px
12px
16px
20px
24px
28px
32px
36px
40px
44px
48px
52px
56px
60px
64px
68px
72px
76px
80px
Типографика (Desktop)
Style:
Families:
Weight:
Lineheight:
Size:
Letterspacing:
font-style-desktop-h1
Heading 1
font-style-desktop-h2
Heading 2
font-style-desktop-h3
Heading 3
font-style-desktop-h4
Heading 4
font-style-desktop-h5
Heading 5
font-style-desktop-h6
Heading 6
font-style-desktop-body-xL-bold
body xl bold
font-style-desktop-body-xL
body xl
font-style-desktop-body-L-bold
Body L Bold
font-style-desktop-body-L
Body L
font-style-desktop-body-m-bold
Body M Bold
font-style-desktop-body-m
Body M
font-style-desktop-body-s-bold
Body S Bold
font-style-desktop-body-s
Body S
font-style-desktop-body-xs-bold
Body XS Bold
font-style-desktop-body-xs
Body XS
font-families-Body
Golos
font-families-Accent
ALS Gorizont
font-weight-0
(400) Regular
font-weight-1
(500) Medium
font-weight-2
(600) DemiBold
font-weight-3
(700) Bold
font-lineheight-2
16
font-lineheight-2,5
20
font-lineheight-2,75
22
font-lineheight-3
24
font-lineheight-3,25
26
font-lineheight-3,5
28
font-lineheight-4
32
font-lineheight-4,5
36
font-lineheight-4,75
38
font-lineheight-5
40
font-lineheight-5,75
46
font-lineheight-6
48
font-lineheight-6,25
50
font-lineheight-7
56
font-lineheight-7,5
60
font-size-1,5
12
font-size-1,75
14
font-size-2
16
font-size-2,25
18
font-size-2,5
20
font-size-2,75
22
font-size-3
24
font-size-3,25
26
font-size-3,5
28
font-size-3,75
30
font-size-4,5
36
font-size-5,5
44
font-size-5
40
font-size-6,25
50
font-letterspacing-0
0
font-letterspacing-1
0.4
Типографика (Tablet)
Style:
font-style-tablet-h1
Heading 1
font-style-tablet-h2
Heading 2
font-style-tablet-h3
Heading 3
font-style-tablet-h4
Heading 4
font-style-tablet-h5
Heading 5
font-style-tablet-h6
Heading 6
font-style-tablet-body-xL-bold
body xl bold
font-style-tablet-body-xL
body xl
font-style-tablet-body-L-bold
Body L Bold
font-style-tablet-body-L
Body L
font-style-tablet-body-m-bold
Body M Bold
font-style-tablet-body-m
Body M
font-style-tablet-body-s-bold
Body S Bold
font-style-tablet-body-s
Body S
font-style-tablet-body-xs-bold
Body XS Bold
font-style-tablet-body-xs
Body XS
Типографика (Mobile)
Style:
font-style-mobile-h1
Heading 1
font-style-mobile-h2
Heading 2
font-style-mobile-h3
Heading 3
font-style-mobile-h4
Heading 4
font-style-mobile-h5
Heading 5
font-style-mobile-h6
Heading 6
font-style-mobile-body-xL-bold
body xl bold
font-style-mobile-body-xL
body xl
font-style-mobile-body-L-bold
Body L Bold
font-style-mobile-body-L
Body L
font-style-mobile-body-m-bold
Body M Bold
font-style-mobile-body-m
Body M
font-style-mobile-body-s-bold
Body S Bold
font-style-mobile-body-s
Body S
font-style-mobile-body-xs-bold
Body XS Bold
font-style-mobile-body-xs
Body XS
Обводка (Border)
border-width-x0
0
border-width-thin
1
border-width-bold
2
Радиус:
border-radius-x0
0px
border-radius-x0.5
4px
border-radius-x1
8px
border-radius-x2
16px
border-radius-x3
24px
border-radius-x4
32px
border-radius-x5
40px
border-radius-x6
48px
border-radius-x7
56px
border-radius-x8
64px
border-radius-x9
72px
border-radius-x10
80px
border-radius-round
99999999px
Толщина
day-base-static-status-positive
day-base-static-status-negative
day-base-static-status-warning
day-base-static-status-info
#3AA981
#DD4C1E
#EDBB3A
#526ED3
day-base-static-text&icons-10
day-base-static-text&icons-20
day-base-static-text&icons-30
day-base-static-text&icons-40
day-base-static-text&icons-50
day-base-static-text&icons-60
day-base-static-text&icons-70
day-base-static-text&icons-80
day-base-static-text&icons-90
#000000
#37394B
rgba(27,31,59,0.8)
rgba(27,31,59,0.6)
rgba(27,31,59,0.4)
rgba(27,31,59,0.24)
rgba(255,255,255,0.4)
rgba(255,255,255,0.7)
#FFFFFF
Static (Day)
Text & Icons
Bg & Stroke
day-base-static-bg&stroke-10
day-base-static-bg&stroke-20
day-base-static-bg&stroke-30
day-base-static-bg&stroke-40
day-base-static-bg&stroke-50
day-base-static-bg&stroke-60
day-base-static-bg&stroke-70
day-base-static-bg&stroke-80
day-base-static-bg&stroke-90
#FFFFFF
#F6F6F6
#EDEDED
#D7D7D7
#B0B0B0
#959595
#808080
#333333
#000000
Dynamic (Day)
day-base-dynamic-buttonstroke
day-base-dynamic-buttonstroke-hover
day-base-dynamic-buttonstroke-active
rgba(0,0,0,0.4)
rgba(67,68,78,0.4)
#000000
Buttonstroke
Transparent
day-base-dynamic-transparent
day-base-dynamic-transparent-hover
day-base-dynamic-transparent-active
rgba(0,0,0,0.04)
rgba(0,0,0,0.08)
rgba(0,0,0,0.1)
Link
day-base-dynamic-link
day-base-dynamic-link-hover
day-base-dynamic-link-active
day-base-dynamic-link-visited
#254DDD
#4065EE
#163BBF
#254DDD
Status
night-base-static-status-positive
night-base-static-status-negative
night-base-static-status-warning
night-base-static-status-info
#4ACE67
#EE6C42
#F6D935
#4167ED
night-base-static-text&icons-10
night-base-static-text&icons-20
night-base-static-text&icons-30
night-base-static-text&icons-40
night-base-static-text&icons-50
night-base-static-text&icons-60
night-base-static-text&icons-70
night-base-static-text&icons-80
night-base-static-text&icons-90
#FFFFFF
rgba(255,255,255,0.9)
rgba(255,255,255,0.8)
rgba(255,255,255,0.6)
rgba(255,255,255,0.4)
rgba(255,255,255,0.24)
#C7C9CC
#9299A2
#333333
Static (Night)
Text & Icons
Bg & Stroke
night-base-static-bg&stroke-10
night-base-static-bg&stroke-20
night-base-static-bg&stroke-30
night-base-static-bg&stroke-40
night-base-static-bg&stroke-50
night-base-static-bg&stroke-60
night-base-static-bg&stroke-70
night-base-static-bg&stroke-80
night-base-static-bg&stroke-90
#000000
#333333
#5C636B
#9299A2
#C7C9CC
#DDDFE0
#EAECEE
#F6F7F8
#FFFFFF
Dynamic (Night)
night-base-dynamic-buttonstroke
night-base-dynamic-buttonstroke-hover
night-base-dynamic-buttonstroke-active
rgba(255,255,255,0.7)
rgba(255,255,255,0.4)
#FFFFFF
Buttonstroke
Transparent
night-base-dynamic-transparent
night-base-dynamic-transparent-hover
night-base-dynamic-transparent-active
rgba(255,255,255,0.1)
rgba(255,255,255,0.14)
rgba(255,255,255,0.18)
Link
night-base-dynamic-link
night-base-dynamic-link-hover
night-base-dynamic-link-active
night-base-dynamic-link-visited
#7C96F4
#A1B4F9
#6279CE
#7C96F4
Status
day-primary-black-default
day-primary-black-hover
day-primary-black-active
#000000
#43444E
#2E314A
day-primary-red-default
day-primary-red-hover
day-primary-red-active
#F93F37
#FF5F58
#D2342D
Primary
Red
Cyan
day-primary-cyan-default
day-primary-cyan-hover
day-primary-cyan-active
#3CADC9
#1E8CA8
#2C7C90
Orange
Yellow
day-primary-orange-default
day-primary-orange-hover
day-primary-orange-active
#F68300
#FFA135
#D2620C
Black
Green
day-primary-green-default
day-primary-green-hover
day-primary-green-active
#8FB904
#A4D404
#7C9F03
Pink
day-primary-pink-default
day-primary-pink-hover
day-primary-pink-active
#F84EFA
#F16FF2
#CC25CD
Violet
day-primary-violet-default
day-primary-violet-hover
day-primary-violet-active
#7F00FF
#9635F6
#5D00BB
Blue
day-primary-blue-default
day-primary-blue-hover
day-primary-blue-active
#0B68FE
#428AFF
#2E61B4
day-primary-yellow-default
day-primary-yellow-hover
day-primary-yellow-active
#EDDC00
#E3D200
#CCB800
night-primary-white-default
night-primary-white-hover
night-primary-white-active
#FFFFFF
#B7BFCB
#8C94A0
night-primary-red-default
night-primary-red-hover
night-primary-red-active
#FF4C41
#FF5F58
#FF7F7A
Primary
Red
Cyan
night-primary-cyan-default
night-primary-cyan-hover
night-primary-cyan-active
#17CAF6
#90EBFF
#26B4D7
Orange
Yellow
night-primary-orange-default
night-primary-orange-hover
night-primary-orange-active
#FFBA33
#FBCE78
#D9A644
White
Green
night-primary-green-default
night-primary-green-hover
night-primary-green-active
#CAFD00
#E6FF82
#9DC500
Pink
night-primary-pink-default
night-primary-pink-hover
night-primary-pink-active
#CD23CF
#DD38DF
#EB52ED
Violet
night-primary-violet-default
night-primary-violet-hover
night-primary-violet-active
#973EF1
#A168DA
#A579D1
Blue
night-primary-blue-default
night-primary-blue-hover
night-primary-blue-active
#2072F8
#3E85F8
#5592F3
night-primary-yellow-default
night-primary-yellow-hover
night-primary-yellow-active
#FFFF33
#FEFE9C
#F5DD04
day-secondary-red-light-10
day-secondary-red-light-20
day-secondary-red-light-30
day-secondary-red-light-40
day-secondary-red-light-50
day-secondary-red-light-60
day-secondary-red-light-70
day-secondary-red-light-80
#FEEBEB
#FED9D7
#FDC5C3
#FDB2AF
#FC9F9B
#FB8C87
#FB7974
#FA655F
Secondary (Day)
Red Dark
Red Light
day-secondary-red-dark-10
day-secondary-red-dark-20
day-secondary-red-dark-30
day-secondary-red-dark-40
day-secondary-red-dark-50
day-secondary-red-dark-60
day-secondary-red-dark-70
day-secondary-red-dark-80
#E52B23
#D1170F
#BD0300
#A90000
#950000
#810000
#6D0000
#590000
Violet Dark
Violet Light
day-secondary-violet-light-10
day-secondary-violet-light-20
day-secondary-violet-light-30
day-secondary-violet-light-40
day-secondary-violet-light-50
day-secondary-violet-light-60
day-secondary-violet-light-70
day-secondary-violet-light-80
#F2E6FF
#E5CCFF
#D8B2FF
#CC99FF
#BF7FFF
#B266FF
#A64DFF
#9933FF
day-secondary-violet-dark-10
day-secondary-violet-dark-20
day-secondary-violet-dark-30
day-secondary-violet-dark-40
day-secondary-violet-dark-50
day-secondary-violet-dark-60
day-secondary-violet-dark-70
day-secondary-violet-dark-80
#7200E6
#6600CC
#5900B2
#4C0099
#400080
#330066
#26004D
#190033
Blue Dark
Blue Light
day-secondary-blue-light-10
day-secondary-blue-light-20
day-secondary-blue-light-30
day-secondary-blue-light-40
day-secondary-blue-light-50
day-secondary-blue-light-60
day-secondary-blue-light-70
day-secondary-blue-light-80
#E6EFFE
#CEE1FF
#B5D1FE
#9DC3FF
#85B3FE
#6DA4FE
#5596FF
#3C86FE
day-secondary-blue-dark-10
day-secondary-blue-dark-20
day-secondary-blue-dark-30
day-secondary-blue-dark-40
day-secondary-blue-dark-50
day-secondary-blue-dark-60
day-secondary-blue-dark-70
day-secondary-blue-dark-80
#0A5EE5
#0955CC
#084BB2
#074299
#063980
#053066
#04264D
#031C33
Cyan Dark
Cyan Light
day-secondary-cyan-light-10
day-secondary-cyan-light-20
day-secondary-cyan-light-30
day-secondary-cyan-light-40
day-secondary-cyan-light-50
day-secondary-cyan-light-60
day-secondary-cyan-light-70
day-secondary-cyan-light-80
#E5F9FE
#CCF4FE
#B2EEFD
#99E9FD
#80E3FC
#67DEFC
#4EDAFD
#34D4FC
day-secondary-cyan-dark-10
day-secondary-cyan-dark-20
day-secondary-cyan-dark-30
day-secondary-cyan-dark-40
day-secondary-cyan-dark-50
day-secondary-cyan-dark-60
day-secondary-cyan-dark-70
day-secondary-cyan-dark-80
#01B4E2
#019FCC
#018AB2
#017599
#016080
#014B66
#01364D
#012133
Orange Dark
Orange Light
day-secondary-orange-light-10
day-secondary-orange-light-20
day-secondary-orange-light-30
day-secondary-orange-light-40
day-secondary-orange-light-50
day-secondary-orange-light-60
day-secondary-orange-light-70
day-secondary-orange-light-80
#FFF8EA
#FFF1D6
#FFEAC1
#FFE3AD
#FFDC98
#FFD585
#FFCF71
#FFC85C
day-secondary-orange-dark-10
day-secondary-orange-dark-20
day-secondary-orange-dark-30
day-secondary-orange-dark-40
day-secondary-orange-dark-50
day-secondary-orange-dark-60
day-secondary-orange-dark-70
day-secondary-orange-dark-80
#E6A72E
#CC9529
#B38324
#99711F
#805F1A
#664C14
#4D3A0F
#33280A
Pink Dark
Pink Light
day-secondary-pink-light-10
day-secondary-pink-light-20
day-secondary-pink-light-30
day-secondary-pink-light-40
day-secondary-pink-light-50
day-secondary-pink-light-60
day-secondary-pink-light-70
day-secondary-pink-light-80
#FEEDFE
#FEDCFE
#FDC9FD
#FCB8FD
#FBA6FC
#FB95FC
#FB84FC
#FA71FB
day-secondary-pink-dark-10
day-secondary-pink-dark-20
day-secondary-pink-dark-30
day-secondary-pink-dark-40
day-secondary-pink-dark-50
day-secondary-pink-dark-60
day-secondary-pink-dark-70
day-secondary-pink-dark-80
#DF47E1
#C640C8
#AD39AF
#943296
#7B2B7D
#622464
#491D4B
#301632
Green Dark
Green Light
day-secondary-green-light-10
day-secondary-green-light-20
day-secondary-green-light-30
day-secondary-green-light-40
day-secondary-green-light-50
day-secondary-green-light-60
day-secondary-green-light-70
day-secondary-green-light-80
#F9FEE6
#F4FECD
#EFFDB4
#EAFD9B
#E4FD82
#DFFD69
#DAFD51
#D5FC37
day-secondary-green-dark-10
day-secondary-green-dark-20
day-secondary-green-dark-30
day-secondary-green-dark-40
day-secondary-green-dark-50
day-secondary-green-dark-60
day-secondary-green-dark-70
day-secondary-green-dark-80
#B6E204
#A1C904
#8DBF04
#78A403
#648A03
#4F6F02
#3A5502
#263A01
Yellow Dark
Yellow Light
day-secondary-yellow-light-10
day-secondary-yellow-light-20
day-secondary-yellow-light-30
day-secondary-yellow-light-40
day-secondary-yellow-light-50
day-secondary-yellow-light-60
day-secondary-yellow-light-70
day-secondary-yellow-light-80
#FEFEE6
#FEFECE
#FDFDB6
#FDFD9E
#FCFC85
#FCFC6D
#FCFC56
#FBFB3D
day-secondary-yellow-dark-10
day-secondary-yellow-dark-20
day-secondary-yellow-dark-30
day-secondary-yellow-dark-40
day-secondary-yellow-dark-50
day-secondary-yellow-dark-60
day-secondary-yellow-dark-70
day-secondary-yellow-dark-80
#E1E10B
#C8C80A
#AFAF09
#969608
#7D7D07
#646406
#4B4B04
#323203
night-secondary-red-light-10
night-secondary-red-light-20
night-secondary-red-light-30
night-secondary-red-light-40
night-secondary-red-light-50
night-secondary-red-light-60
night-secondary-red-light-70
night-secondary-red-light-80
#FD5C53
#FC6D64
#FA7D76
#F98E87
#F79E98
#F6AEAA
#F5BFBB
#F3CFCD
Secondary (Night)
Red Dark
Red Light
night-secondary-red-dark-10
night-secondary-red-dark-20
night-secondary-red-dark-30
night-secondary-red-dark-40
night-secondary-red-dark-50
night-secondary-red-dark-60
night-secondary-red-dark-70
night-secondary-red-dark-80
#330F0D
#4C1713
#661E1A
#7F2620
#992E27
#B2352D
#CC3D34
#E5443A
Violet Dark
Violet Light
night-secondary-violet-light-10
night-secondary-violet-light-20
night-secondary-violet-light-30
night-secondary-violet-light-40
night-secondary-violet-light-50
night-secondary-violet-light-60
night-secondary-violet-light-70
night-secondary-violet-light-80
#942BFD
#9E41FC
#A857FA
#B36DF9
#BD83F7
#C798F6
#D1AEF5
#DCC4F3
night-secondary-violet-dark-10
night-secondary-violet-dark-20
night-secondary-violet-dark-30
night-secondary-violet-dark-40
night-secondary-violet-dark-50
night-secondary-violet-dark-60
night-secondary-violet-dark-70
night-secondary-violet-dark-80
#1C0433
#29064D
#370866
#450B80
#530D99
#600FB2
#6E11CC
#7C13E5
Blue Dark
Blue Light
night-secondary-blue-light-10
night-secondary-blue-light-20
night-secondary-blue-light-30
night-secondary-blue-light-40
night-secondary-blue-light-50
night-secondary-blue-light-60
night-secondary-blue-light-70
night-secondary-blue-light-80
#357FF7
#4A8CF6
#5E98F5
#73A5F5
#88B1F4
#9DBEF3
#B2CAF2
#C6D7F2
night-secondary-blue-dark-10
night-secondary-blue-dark-20
night-secondary-blue-dark-30
night-secondary-blue-dark-40
night-secondary-blue-dark-50
night-secondary-blue-dark-60
night-secondary-blue-dark-70
night-secondary-blue-dark-80
#061732
#0A224A
#0D2E63
#10397C
#134595
#1650AD
#1A5CC6
#1D67DF
Cyan Dark
Cyan Light
night-secondary-cyan-light-10
night-secondary-cyan-light-20
night-secondary-cyan-light-30
night-secondary-cyan-light-40
night-secondary-cyan-light-50
night-secondary-cyan-light-60
night-secondary-cyan-light-70
night-secondary-cyan-light-80
#2CCEF6
#42D1F5
#58D5F5
#6ED9F4
#83DDF3
#99E1F3
#AFE5F2
#C5E8F1
night-secondary-cyan-dark-10
night-secondary-cyan-dark-20
night-secondary-cyan-dark-30
night-secondary-cyan-dark-40
night-secondary-cyan-dark-50
night-secondary-cyan-dark-60
night-secondary-cyan-dark-70
night-secondary-cyan-dark-80
#052831
#073D4A
#095163
#0B657B
#0E7994
#108DAD
#12A1C5
#14B6DE
Orange Dark
Orange Light
night-secondary-orange-light-10
night-secondary-orange-light-20
night-secondary-orange-light-30
night-secondary-orange-light-40
night-secondary-orange-light-50
night-secondary-orange-light-60
night-secondary-orange-light-70
night-secondary-orange-light-80
#FDBF46
#FCC559
#FACA6C
#F9CF7F
#F7D591
#F6DAA4
#F5E0B7
#F3E5CA
night-secondary-orange-dark-10
night-secondary-orange-dark-20
night-secondary-orange-dark-30
night-secondary-orange-dark-40
night-secondary-orange-dark-50
night-secondary-orange-dark-60
night-secondary-orange-dark-70
night-secondary-orange-dark-80
#33250A
#4D380F
#664A14
#805D19
#996F1F
#B28224
#CC9529
#E5A72E
Pink Dark
Pink Light
night-secondary-pink-light-10
night-secondary-pink-light-20
night-secondary-pink-light-30
night-secondary-pink-light-40
night-secondary-pink-light-50
night-secondary-pink-light-60
night-secondary-pink-light-70
night-secondary-pink-light-80
#EA60EB
#EA70EC
#EB80EC
#EC90ED
#EDA0ED
#EDB0EE
#EEC0EE
#EFD0EF
night-secondary-pink-dark-10
night-secondary-pink-dark-20
night-secondary-pink-dark-30
night-secondary-pink-dark-40
night-secondary-pink-dark-50
night-secondary-pink-dark-60
night-secondary-pink-dark-70
night-secondary-pink-dark-80
#2F102F
#461846
#5D205E
#752875
#8C308D
#A338A4
#BA40BC
#D248D3
Green Dark
Green Light
night-secondary-green-light-10
night-secondary-green-light-20
night-secondary-green-light-30
night-secondary-green-light-40
night-secondary-green-light-50
night-secondary-green-light-60
night-secondary-green-light-70
night-secondary-green-light-80
#CEFC18
#D2FA30
#D6F948
#D9F860
#DDF678
#E1F590
#E5F4A8
#E8F3C0
night-secondary-green-dark-10
night-secondary-green-dark-20
night-secondary-green-dark-30
night-secondary-green-dark-40
night-secondary-green-dark-50
night-secondary-green-dark-60
night-secondary-green-dark-70
night-secondary-green-dark-80
#283300
#3D4C00
#516500
#657E00
#799800
#8EB100
#A2CA00
#B6E400
Yellow Dark
Yellow Light
night-secondary-yellow-light-10
night-secondary-yellow-light-20
night-secondary-yellow-light-30
night-secondary-yellow-light-40
night-secondary-yellow-light-50
night-secondary-yellow-light-60
night-secondary-yellow-light-70
night-secondary-yellow-light-80
#FDFD46
#FCFC59
#FAFA6C
#F9F97F
#F7F791
#F6F6A4
#F5F5B7
#F3F3CA
night-secondary-yellow-dark-10
night-secondary-yellow-dark-20
night-secondary-yellow-dark-30
night-secondary-yellow-dark-40
night-secondary-yellow-dark-50
night-secondary-yellow-dark-60
night-secondary-yellow-dark-70
night-secondary-yellow-dark-80
#33330A
#4D4D0F
#666614
#80801A
#99991F
#B2B224
#CCCC29
#E5E52E