Token Catalog

Material Design 3 "Color" tokens: Palettes

Browse tokens

See more values

Compare token values by selecting another context.

More contexts
Audience

Token
Baseline palette
Baseline – Primary
Baseline – Primary tokens
TokenValue
Primary 100md.ref.palette.primary100
#FFFFFF
Primary 99md.ref.palette.primary99
#FFFBFE
Primary 98md.ref.palette.primary98
#FEF7FF
Primary 95md.ref.palette.primary95
#F6EDFF
Primary 90md.ref.palette.primary90
#EADDFF
Primary 80md.ref.palette.primary80
#D0BCFF
Primary 70md.ref.palette.primary70
#B69DF8
Primary 60md.ref.palette.primary60
#9A82DB
Primary 50md.ref.palette.primary50
#7F67BE
Primary 40md.ref.palette.primary40
#6750A4
Primary 30md.ref.palette.primary30
#4F378B
Primary 20md.ref.palette.primary20
#381E72
Primary 10md.ref.palette.primary10
#21005D
Primary 0md.ref.palette.primary0
#000000
Baseline – Secondary
Baseline – Secondary tokens
TokenValue
Secondary 100md.ref.palette.secondary100
#FFFFFF
Secondary 99md.ref.palette.secondary99
#FFFBFE
Secondary 98md.ref.palette.secondary98
#FEF7FF
Secondary 95md.ref.palette.secondary95
#F6EDFF
Secondary 90md.ref.palette.secondary90
#E8DEF8
Secondary 80md.ref.palette.secondary80
#CCC2DC
Secondary 70md.ref.palette.secondary70
#B0A7C0
Secondary 60md.ref.palette.secondary60
#958DA5
Secondary 50md.ref.palette.secondary50
#7A7289
Secondary 40md.ref.palette.secondary40
#625B71
Secondary 30md.ref.palette.secondary30
#4A4458
Secondary 20md.ref.palette.secondary20
#332D41
Secondary 10md.ref.palette.secondary10
#1D192B
Secondary 0md.ref.palette.secondary0
#000000
Baseline – Tertiary
Baseline – Tertiary tokens
TokenValue
Tertiary 100md.ref.palette.tertiary100
#FFFFFF
Tertiary 99md.ref.palette.tertiary99
#FFFBFA
Tertiary 98md.ref.palette.tertiary98
#FFF8F8
Tertiary 95md.ref.palette.tertiary95
#FFECF1
Tertiary 90md.ref.palette.tertiary90
#FFD8E4
Tertiary 80md.ref.palette.tertiary80
#EFB8C8
Tertiary 70md.ref.palette.tertiary70
#D29DAC
Tertiary 60md.ref.palette.tertiary60
#B58392
Tertiary 50md.ref.palette.tertiary50
#986977
Tertiary 40md.ref.palette.tertiary40
#7D5260
Tertiary 30md.ref.palette.tertiary30
#633B48
Tertiary 20md.ref.palette.tertiary20
#492532
Tertiary 10md.ref.palette.tertiary10
#31111D
Tertiary 0md.ref.palette.tertiary0
#000000
Baseline – Error
Baseline – Error tokens
TokenValue
Error 100md.ref.palette.error100
#FFFFFF
Error 99md.ref.palette.error99
#FFFBF9
Error 98md.ref.palette.error98
#FFF8F7
Error 95md.ref.palette.error95
#FCEEEE
Error 90md.ref.palette.error90
#F9DEDC
Error 80md.ref.palette.error80
#F2B8B5
Error 70md.ref.palette.error70
#EC928E
Error 60md.ref.palette.error60
#E46962
Error 50md.ref.palette.error50
#DC362E
Error 40md.ref.palette.error40
#B3261E
Error 30md.ref.palette.error30
#8C1D18
Error 20md.ref.palette.error20
#601410
Error 10md.ref.palette.error10
#410E0B
Error 0md.ref.palette.error0
#000000
Baseline – Neutral
Baseline – Neutral tokens
TokenValue
Neutral 100md.ref.palette.neutral100
#FFFFFF
Neutral 99md.ref.palette.neutral99
#FFFBFF
Neutral 98md.ref.palette.neutral98
#FEF7FF
Neutral 96md.ref.palette.neutral96
#F7F2FA
Neutral 95md.ref.palette.neutral95
#F5EFF7
Neutral 94md.ref.palette.neutral94
#F3EDF7
Neutral 92md.ref.palette.neutral92
#ECE6F0
Neutral 90md.ref.palette.neutral90
#E6E0E9
Neutral 87md.ref.palette.neutral87
#DED8E1
Neutral 80md.ref.palette.neutral80
#CAC5CD
Neutral 70md.ref.palette.neutral70
#AEA9B1
Neutral 60md.ref.palette.neutral60
#938F96
Neutral 50md.ref.palette.neutral50
#79767D
Neutral 40md.ref.palette.neutral40
#605D64
Neutral 30md.ref.palette.neutral30
#48464C
Neutral 24md.ref.palette.neutral24
#3B383E
Neutral 22md.ref.palette.neutral22
#36343B
Neutral 20md.ref.palette.neutral20
#322F35
Neutral 17md.ref.palette.neutral17
#2B2930
Neutral 12md.ref.palette.neutral12
#211F26
Neutral 10md.ref.palette.neutral10
#1D1B20
Neutral 6md.ref.palette.neutral6
#141218
Neutral 4md.ref.palette.neutral4
#0F0D13
Neutral 0md.ref.palette.neutral0
#000000
Baseline – Neutral variant
Baseline – Neutral variant tokens
TokenValue
Neutral Variant 100md.ref.palette.neutral-variant100
#FFFFFF
Neutral Variant 99md.ref.palette.neutral-variant99
#FFFBFE
Neutral Variant 98md.ref.palette.neutral-variant98
#FDF7FF
Neutral Variant 95md.ref.palette.neutral-variant95
#F5EEFA
Neutral Variant 90md.ref.palette.neutral-variant90
#E7E0EC
Neutral Variant 80md.ref.palette.neutral-variant80
#CAC4D0
Neutral Variant 70md.ref.palette.neutral-variant70
#AEA9B4
Neutral Variant 60md.ref.palette.neutral-variant60
#938F99
Neutral Variant 50md.ref.palette.neutral-variant50
#79747E
Neutral Variant 40md.ref.palette.neutral-variant40
#605D66
Neutral Variant 30md.ref.palette.neutral-variant30
#49454F
Neutral Variant 20md.ref.palette.neutral-variant20
#322F37
Neutral Variant 10md.ref.palette.neutral-variant10
#1D1A22
Neutral Variant 0md.ref.palette.neutral-variant0
#000000
Static palette
Static – Black white
Static – Black white tokens
TokenValue
Whitemd.ref.palette.white
#FFFFFF
Blackmd.ref.palette.black
#000000
Static – Blue
Static – Blue tokens
TokenValue
Blue 100md.ref.palette.blue100
#FFFFFF
Blue 98md.ref.palette.blue98
#F5FAFF
Blue 95md.ref.palette.blue95
#E7F2FF
Blue 90md.ref.palette.blue90
#D0E4FF
Blue 80md.ref.palette.blue80
#A1C9FF
Blue 70md.ref.palette.blue70
#76ACFF
Blue 60md.ref.palette.blue60
#4E8FF8
Blue 50md.ref.palette.blue50
#3271EA
Blue 40md.ref.palette.blue40
#1157CE
Blue 30md.ref.palette.blue30
#04409F
Blue 20md.ref.palette.blue20
#012C6F
Blue 10md.ref.palette.blue10
#001944
Blue 0md.ref.palette.blue0
#000000
Static – Yellow
Static – Yellow tokens
TokenValue
Yellow 100md.ref.palette.yellow100
#FFFFFF
Yellow 98md.ref.palette.yellow98
#FFFADE
Yellow 95md.ref.palette.yellow95
#FFF2B4
Yellow 90md.ref.palette.yellow90
#FFE07C
Yellow 80md.ref.palette.yellow80
#FCBD00
Yellow 70md.ref.palette.yellow70
#EF9800
Yellow 60md.ref.palette.yellow60
#D37B00
Yellow 50md.ref.palette.yellow50
#B16300
Yellow 40md.ref.palette.yellow40
#8F4E06
Yellow 30md.ref.palette.yellow30
#6D3A01
Yellow 20md.ref.palette.yellow20
#4D2600
Yellow 10md.ref.palette.yellow10
#2F1400
Yellow 0md.ref.palette.yellow0
#000000
Static – Red
Static – Red tokens
TokenValue
Red 100md.ref.palette.red100
#FFFFFF
Red 98md.ref.palette.red98
#FFF8F8
Red 95md.ref.palette.red95
#FFECEE
Red 90md.ref.palette.red90
#FFDADC
Red 80md.ref.palette.red80
#FFB3AE
Red 70md.ref.palette.red70
#FF8983
Red 60md.ref.palette.red60
#F55E57
Red 50md.ref.palette.red50
#DB372D
Red 40md.ref.palette.red40
#B3251E
Red 30md.ref.palette.red30
#8A1A16
Red 20md.ref.palette.red20
#60150F
Red 10md.ref.palette.red10
#3A0907
Red 0md.ref.palette.red0
#000000
Static – Purple
Static – Purple tokens
TokenValue
Purple 100md.ref.palette.purple100
#FFFFFF
Purple 98md.ref.palette.purple98
#FDF8FF
Purple 95md.ref.palette.purple95
#F7ECFE
Purple 90md.ref.palette.purple90
#EEDCFE
Purple 80md.ref.palette.purple80
#D9BAFD
Purple 70md.ref.palette.purple70
#C597FF
Purple 60md.ref.palette.purple60
#AD72FF
Purple 50md.ref.palette.purple50
#9254EA
Purple 40md.ref.palette.purple40
#7438D2
Purple 30md.ref.palette.purple30
#5629A4
Purple 20md.ref.palette.purple20
#400B84
Purple 10md.ref.palette.purple10
#280255
Purple 0md.ref.palette.purple0
#000000
Static – Blue variant
Static – Blue variant tokens
TokenValue
Blue Variant 100md.ref.palette.blue-variant100
#FFFFFF
Blue Variant 98md.ref.palette.blue-variant98
#F4FAFF
Blue Variant 95md.ref.palette.blue-variant95
#E0F4FF
Blue Variant 90md.ref.palette.blue-variant90
#BDE9FF
Blue Variant 80md.ref.palette.blue-variant80
#67D4FF
Blue Variant 70md.ref.palette.blue-variant70
#00BBEA
Blue Variant 60md.ref.palette.blue-variant60
#009DC9
Blue Variant 50md.ref.palette.blue-variant50
#0081A8
Blue Variant 40md.ref.palette.blue-variant40
#006788
Blue Variant 30md.ref.palette.blue-variant30
#004D68
Blue Variant 20md.ref.palette.blue-variant20
#003549
Blue Variant 10md.ref.palette.blue-variant10
#001F2D
Blue Variant 0md.ref.palette.blue-variant0
#000000
Static – Cyan
Static – Cyan tokens
TokenValue
Cyan 100md.ref.palette.cyan100
#FFFFFF
Cyan 98md.ref.palette.cyan98
#F0FBFF
Cyan 95md.ref.palette.cyan95
#D8F6FF
Cyan 90md.ref.palette.cyan90
#ACEDFF
Cyan 80md.ref.palette.cyan80
#60D5F3
Cyan 70md.ref.palette.cyan70
#00BBDF
Cyan 60md.ref.palette.cyan60
#009EBB
Cyan 50md.ref.palette.cyan50
#00839B
Cyan 40md.ref.palette.cyan40
#00687C
Cyan 30md.ref.palette.cyan30
#004E5D
Cyan 20md.ref.palette.cyan20
#003641
Cyan 10md.ref.palette.cyan10
#001F26
Cyan 0md.ref.palette.cyan0
#000000
Static – Grey
Static – Grey tokens
TokenValue
Grey 100md.ref.palette.grey100
#FFFFFF
Grey 98md.ref.palette.grey98
#F9F9F9
Grey 95md.ref.palette.grey95
#F2F2F2
Grey 90md.ref.palette.grey90
#E3E3E3
Grey 80md.ref.palette.grey80
#C7C7C7
Grey 70md.ref.palette.grey70
#ABABAB
Grey 60md.ref.palette.grey60
#919191
Grey 50md.ref.palette.grey50
#777777
Grey 40md.ref.palette.grey40
#5E5E5E
Grey 30md.ref.palette.grey30
#474747
Grey 20md.ref.palette.grey20
#303030
Grey 10md.ref.palette.grey10
#1B1B1C
Grey 0md.ref.palette.grey0
#000000
Static – Green
Static – Green tokens
TokenValue
Green 100md.ref.palette.green100
#FFFFFF
Green 98md.ref.palette.green98
#F2FCEF
Green 95md.ref.palette.green95
#DDF8D8
Green 90md.ref.palette.green90
#BEEFBB
Green 80md.ref.palette.green80
#80DA88
Green 70md.ref.palette.green70
#44C265
Green 60md.ref.palette.green60
#1AA64A
Green 50md.ref.palette.green50
#128937
Green 40md.ref.palette.green40
#006C35
Green 30md.ref.palette.green30
#00522C
Green 20md.ref.palette.green20
#00381F
Green 10md.ref.palette.green10
#002110
Green 0md.ref.palette.green0
#000000
Static – Grey variant
Static – Grey variant tokens
TokenValue
Grey Variant 100md.ref.palette.grey-variant100
#FFFFFF
Grey Variant 98md.ref.palette.grey-variant98
#F7FAF7
Grey Variant 95md.ref.palette.grey-variant95
#EFF2EF
Grey Variant 90md.ref.palette.grey-variant90
#E1E3E1
Grey Variant 80md.ref.palette.grey-variant80
#C4C7C5
Grey Variant 70md.ref.palette.grey-variant70
#A9ACAA
Grey Variant 60md.ref.palette.grey-variant60
#8E918F
Grey Variant 50md.ref.palette.grey-variant50
#747775
Grey Variant 40md.ref.palette.grey-variant40
#5C5F5E
Grey Variant 30md.ref.palette.grey-variant30
#444746
Grey Variant 20md.ref.palette.grey-variant20
#2D312F
Grey Variant 10md.ref.palette.grey-variant10
#191D1C
Grey Variant 0md.ref.palette.grey-variant0
#000000
Static – Orange
Static – Orange tokens
TokenValue
Orange 100md.ref.palette.orange100
#FFFFFF
Orange 98md.ref.palette.orange98
#FFF8F4
Orange 95md.ref.palette.orange95
#FFEDE1
Orange 90md.ref.palette.orange90
#FFDCC3
Orange 80md.ref.palette.orange80
#FFB683
Orange 70md.ref.palette.orange70
#FF8D41
Orange 60md.ref.palette.orange60
#E86E00
Orange 50md.ref.palette.orange50
#C05A01
Orange 40md.ref.palette.orange40
#9A4600
Orange 30md.ref.palette.orange30
#753403
Orange 20md.ref.palette.orange20
#522302
Orange 10md.ref.palette.orange10
#321200
Orange 0md.ref.palette.orange0
#000000
Static – Pink
Static – Pink tokens
TokenValue
Pink 100md.ref.palette.pink100
#FFFFFF
Pink 98md.ref.palette.pink98
#FFF7FC
Pink 95md.ref.palette.pink95
#FFECF6
Pink 90md.ref.palette.pink90
#FFD8EF
Pink 80md.ref.palette.pink80
#FFAEE4
Pink 70md.ref.palette.pink70
#FF7DD2
Pink 60md.ref.palette.pink60
#F94AAB
Pink 50md.ref.palette.pink50
#DC258D
Pink 40md.ref.palette.pink40
#B60D6E
Pink 30md.ref.palette.pink30
#8D0053
Pink 20md.ref.palette.pink20
#620438
Pink 10md.ref.palette.pink10
#3D0023
Pink 0md.ref.palette.pink0
#000000