Brand - Main colors
Primary
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandPrimary10 | 10 | #000E33 | Color palettes / Brand / Primary / 10 | |
CdsColorBrandPrimary20 | 20 | #001C66 | Color palettes / Brand / Primary / 20 | |
CdsColorBrandPrimary30 | 30 | #002EAA | Color palettes / Brand / Primary / 30 | |
CdsColorBrandPrimary40 | 40 | #0038CC | Color palettes / Brand / Primary / 40 | |
CdsColorBrandPrimary50 | 50 | #0046FE | Color palettes / Brand / Primary / 50 | |
CdsColorBrandPrimary60 | 60 | #336BFF | Color palettes / Brand / Primary / 60 | |
CdsColorBrandPrimary70 | 70 | #6690FF | Color palettes / Brand / Primary / 70 | |
CdsColorBrandPrimary80 | 80 | #99B5FF | Color palettes / Brand / Primary / 80 | |
CdsColorBrandPrimary90 | 90 | #CCDAFF | Color palettes / Brand / Primary / 90 | |
CdsColorBrandPrimary95 | 95 | #E5EDFF | Color palettes / Brand / Primary / 95 | |
CdsColorBrandPrimary99 | 99 | #F7F9FE | Color palettes / Brand / Primary / 99 |
Secondary
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandSecondary10 | 10 | #88301C | Color palettes / Brand / Secondary / 10 | |
CdsColorBrandSecondary20 | 20 | #B13F24 | Color palettes / Brand / Secondary / 20 | |
CdsColorBrandSecondary30 | 30 | #CC492A | Color palettes / Brand / Secondary / 30 | |
CdsColorBrandSecondary40 | 40 | #E6502C | Color palettes / Brand / Secondary / 40 | |
CdsColorBrandSecondary50 | 50 | #FF5C35 | Color palettes / Brand / Secondary / 50 | |
CdsColorBrandSecondary60 | 60 | #FF8466 | Color palettes / Brand / Secondary / 60 | |
CdsColorBrandSecondary70 | 70 | #FEAE99 | Color palettes / Brand / Secondary / 70 | |
CdsColorBrandSecondary80 | 80 | #FED6CC | Color palettes / Brand / Secondary / 80 | |
CdsColorBrandSecondary90 | 90 | #FEEAE5 | Color palettes / Brand / Secondary / 90 | |
CdsColorBrandSecondary95 | 95 | #FBF2F0 | Color palettes / Brand / Secondary / 95 | |
CdsColorBrandSecondary99 | 99 | #FCF7F6 | Color palettes / Brand / Secondary / 99 |
Neutral
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandNeutral10 | 10 | #001D36 | Color palettes / Brand / Neutral / 10 | |
CdsColorBrandNeutral20 | 20 | #002C52 | Color palettes / Brand / Neutral / 20 | |
CdsColorBrandNeutral30 | 30 | #1A4163 | Color palettes / Brand / Neutral / 30 | |
CdsColorBrandNeutral40 | 40 | #335674 | Color palettes / Brand / Neutral / 40 | |
CdsColorBrandNeutral50 | 50 | #4D6B86 | Color palettes / Brand / Neutral / 50 | |
CdsColorBrandNeutral60 | 60 | #668097 | Color palettes / Brand / Neutral / 60 | |
CdsColorBrandNeutral70 | 70 | #8095A8 | Color palettes / Brand / Neutral / 70 | |
CdsColorBrandNeutral80 | 80 | #B3C0CB | Color palettes / Brand / Neutral / 80 | |
CdsColorBrandNeutral90 | 90 | #CCD4DC | Color palettes / Brand / Neutral / 90 | |
CdsColorBrandNeutral95 | 95 | #E6EAEE | Color palettes / Brand / Neutral / 95 | |
CdsColorBrandNeutral99 | 99 | #F7F8F9 | Color palettes / Brand / Neutral / 99 |
Brand - Additional colors
Bananabread
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandBananabread10 | 10 | #271900 | Color palettes / Brand / Bananabread / 10 | |
CdsColorBrandBananabread20 | 20 | #422C00 | Color palettes / Brand / Bananabread / 20 | |
CdsColorBrandBananabread30 | 30 | #5F4100 | Color palettes / Brand / Bananabread / 30 | |
CdsColorBrandBananabread40 | 40 | #7D5800 | Color palettes / Brand / Bananabread / 40 | |
CdsColorBrandBananabread50 | 50 | #9C6f02 | Color palettes / Brand / Bananabread / 50 | |
CdsColorBrandBananabread60 | 60 | #B98823 | Color palettes / Brand / Bananabread / 60 | |
CdsColorBrandBananabread70 | 70 | #D7A23D | Color palettes / Brand / Bananabread / 70 | |
CdsColorBrandBananabread80 | 80 | #FEC55C | Color palettes / Brand / Bananabread / 80 | |
CdsColorBrandBananabread90 | 90 | #FFDEA9 | Color palettes / Brand / Bananabread / 90 | |
CdsColorBrandBananabread95 | 95 | #FFEED8 | Color palettes / Brand / Bananabread / 95 | |
CdsColorBrandBananabread99 | 99 | #FFFBFF | Color palettes / Brand / Bananabread / 99 |
Blackberry
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandBlackberry10 | 10 | #001C3A | Color palettes / Brand / Blackberry / 10 | |
CdsColorBrandBlackberry20 | 20 | #00315F | Color palettes / Brand / Blackberry / 20 | |
CdsColorBrandBlackberry30 | 30 | #004480 | Color palettes / Brand / Blackberry / 30 | |
CdsColorBrandBlackberry40 | 40 | #2D5F9D | Color palettes / Brand / Blackberry / 40 | |
CdsColorBrandBlackberry50 | 50 | #4979B8 | Color palettes / Brand / Blackberry / 50 | |
CdsColorBrandBlackberry60 | 60 | #6492D3 | Color palettes / Brand / Blackberry / 60 | |
CdsColorBrandBlackberry70 | 70 | #7FADF0 | Color palettes / Brand / Blackberry / 70 | |
CdsColorBrandBlackberry80 | 80 | #A5C8FF | Color palettes / Brand / Blackberry / 80 | |
CdsColorBrandBlackberry90 | 90 | #D4E3FF | Color palettes / Brand / Blackberry / 90 | |
CdsColorBrandBlackberry95 | 95 | #EBF1FF | Color palettes / Brand / Blackberry / 95 | |
CdsColorBrandBlackberry99 | 99 | #FDFCFF | Color palettes / Brand / Blackberry / 99 |
Blueberry
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandBlueberry10 | 10 | #001B3D | Color palettes / Brand / Blueberry / 10 | |
CdsColorBrandBlueberry20 | 20 | #003063 | Color palettes / Brand / Blueberry / 20 | |
CdsColorBrandBlueberry30 | 30 | #00468C | Color palettes / Brand / Blueberry / 30 | |
CdsColorBrandBlueberry40 | 40 | #005DB7 | Color palettes / Brand / Blueberry / 40 | |
CdsColorBrandBlueberry50 | 50 | #0084FF | Color palettes / Brand / Blueberry / 50 | |
CdsColorBrandBlueberry60 | 60 | #3C90FF | Color palettes / Brand / Blueberry / 60 | |
CdsColorBrandBlueberry70 | 70 | #79ACFF | Color palettes / Brand / Blueberry / 70 | |
CdsColorBrandBlueberry80 | 80 | #A9C7FF | Color palettes / Brand / Blueberry / 80 | |
CdsColorBrandBlueberry90 | 90 | #D6E3FF | Color palettes / Brand / Blueberry / 90 | |
CdsColorBrandBlueberry95 | 95 | #ECF0FF | Color palettes / Brand / Blueberry / 95 | |
CdsColorBrandBlueberry99 | 99 | #FDFBFF | Color palettes / Brand / Blueberry / 99 |
Gingerbread
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandGingerbread10 | 10 | #331200 | Color palettes / Brand / Gingerbread / 10 | |
CdsColorBrandGingerbread20 | 20 | #542200 | Color palettes / Brand / Gingerbread / 20 | |
CdsColorBrandGingerbread30 | 30 | #773300 | Color palettes / Brand / Gingerbread / 30 | |
CdsColorBrandGingerbread40 | 40 | #9C4500 | Color palettes / Brand / Gingerbread / 40 | |
CdsColorBrandGingerbread50 | 50 | #BD5C19 | Color palettes / Brand / Gingerbread / 50 | |
CdsColorBrandGingerbread60 | 60 | #E67B38 | Color palettes / Brand / Gingerbread / 60 | |
CdsColorBrandGingerbread70 | 70 | #FE8E49 | Color palettes / Brand / Gingerbread / 70 | |
CdsColorBrandGingerbread80 | 80 | #FFB68E | Color palettes / Brand / Gingerbread / 80 | |
CdsColorBrandGingerbread90 | 90 | #FFDBCA | Color palettes / Brand / Gingerbread / 90 | |
CdsColorBrandGingerbread95 | 95 | #FFEDE5 | Color palettes / Brand / Gingerbread / 95 | |
CdsColorBrandGingerbread99 | 99 | #FFFBFF | Color palettes / Brand / Gingerbread / 99 |
Lychee
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandLychee10 | 10 | #2B1611 | Color palettes / Brand / Lychee / 10 | |
CdsColorBrandLychee20 | 20 | #432A25 | Color palettes / Brand / Lychee / 20 | |
CdsColorBrandLychee30 | 30 | #5B403A | Color palettes / Brand / Lychee / 30 | |
CdsColorBrandLychee40 | 40 | #755751 | Color palettes / Brand / Lychee / 40 | |
CdsColorBrandLychee50 | 50 | #907069 | Color palettes / Brand / Lychee / 50 | |
CdsColorBrandLychee60 | 60 | #AB8982 | Color palettes / Brand / Lychee / 60 | |
CdsColorBrandLychee70 | 70 | #C7A39B | Color palettes / Brand / Lychee / 70 | |
CdsColorBrandLychee80 | 80 | #EDC6BE | Color palettes / Brand / Lychee / 80 | |
CdsColorBrandLychee90 | 90 | #FFDAD3 | Color palettes / Brand / Lychee / 90 | |
CdsColorBrandLychee95 | 95 | #FFEDE9 | Color palettes / Brand / Lychee / 95 | |
CdsColorBrandLychee99 | 99 | #FFFBFF | Color palettes / Brand / Lychee / 99 |
Plum
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandPlum10 | 10 | #001946 | Color palettes / Brand / Plum / 10 | |
CdsColorBrandPlum20 | 20 | #152E61 | Color palettes / Brand / Plum / 20 | |
CdsColorBrandPlum30 | 30 | #2E4579 | Color palettes / Brand / Plum / 30 | |
CdsColorBrandPlum40 | 40 | #475D93 | Color palettes / Brand / Plum / 40 | |
CdsColorBrandPlum50 | 50 | #6076AD | Color palettes / Brand / Plum / 50 | |
CdsColorBrandPlum60 | 60 | #7A90C9 | Color palettes / Brand / Plum / 60 | |
CdsColorBrandPlum70 | 70 | #95ABE6 | Color palettes / Brand / Plum / 70 | |
CdsColorBrandPlum80 | 80 | #B1C5FF | Color palettes / Brand / Plum / 80 | |
CdsColorBrandPlum90 | 90 | #DAE2FF | Color palettes / Brand / Plum / 90 | |
CdsColorBrandPlum95 | 95 | #EEF0FF | Color palettes / Brand / Plum / 95 | |
CdsColorBrandPlum99 | 99 | #FEFBFF | Color palettes / Brand / Plum / 99 |
Tomato
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorBrandTomato10 | 10 | #3D0700 | Color palettes / Brand / Tomato / 10 | |
CdsColorBrandTomato20 | 20 | #621100 | Color palettes / Brand / Tomato / 20 | |
CdsColorBrandTomato30 | 30 | #8A1C00 | Color palettes / Brand / Tomato / 30 | |
CdsColorBrandTomato40 | 40 | #B52701 | Color palettes / Brand / Tomato / 40 | |
CdsColorBrandTomato50 | 50 | #D8411C | Color palettes / Brand / Tomato / 50 | |
CdsColorBrandTomato60 | 60 | #FF5C35 | Color palettes / Brand / Tomato / 60 | |
CdsColorBrandTomato70 | 70 | #FF8B6E | Color palettes / Brand / Tomato / 70 | |
CdsColorBrandTomato80 | 80 | #FFB4A3 | Color palettes / Brand / Tomato / 80 | |
CdsColorBrandTomato90 | 90 | #FFDAD2 | Color palettes / Brand / Tomato / 90 | |
CdsColorBrandTomato95 | 95 | #FFEDE9 | Color palettes / Brand / Tomato / 95 | |
CdsColorBrandTomato99 | 99 | #FFFBFF | Color palettes / Brand / Tomato / 99 |
Extended - Semantic colors
Blue (Information)
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedBlue10 | 10 | #001944 | Color palettes / Extended / Blue / 10 | |
CdsColorExtendedBlue20 | 20 | #002D6D | Color palettes / Extended / Blue / 20 | |
CdsColorExtendedBlue30 | 30 | #004299 | Color palettes / Extended / Blue / 30 | |
CdsColorExtendedBlue40 | 40 | #155AC1 | Color palettes / Extended / Blue / 40 | |
CdsColorExtendedBlue50 | 50 | #3B73DC | Color palettes / Extended / Blue / 50 | |
CdsColorExtendedBlue60 | 60 | #598EF8 | Color palettes / Extended / Blue / 60 | |
CdsColorExtendedBlue70 | 70 | #84AAFF | Color palettes / Extended / Blue / 70 | |
CdsColorExtendedBlue80 | 80 | #AFC6FF | Color palettes / Extended / Blue / 80 | |
CdsColorExtendedBlue90 | 90 | #D9E2FF | Color palettes / Extended / Blue / 90 | |
CdsColorExtendedBlue95 | 95 | #EDF0FF | Color palettes / Extended / Blue / 95 | |
CdsColorExtendedBlue99 | 99 | #FEFBFF | Color palettes / Extended / Blue / 99 |
Strawberry (Critical)
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedStrawberry10 | 10 | #410008 | Color palettes / Extended / Strawberry / 10 | |
CdsColorExtendedStrawberry20 | 20 | #680013 | Color palettes / Extended / Strawberry / 20 | |
CdsColorExtendedStrawberry30 | 30 | #92001F | Color palettes / Extended / Strawberry / 30 | |
CdsColorExtendedStrawberry40 | 40 | #BC0E2E | Color palettes / Extended / Strawberry / 40 | |
CdsColorExtendedStrawberry50 | 50 | #E03043 | Color palettes / Extended / Strawberry / 50 | |
CdsColorExtendedStrawberry60 | 60 | #FF525D | Color palettes / Extended / Strawberry / 60 | |
CdsColorExtendedStrawberry70 | 70 | #FF8889 | Color palettes / Extended / Strawberry / 70 | |
CdsColorExtendedStrawberry80 | 80 | #FFB3B2 | Color palettes / Extended / Strawberry / 80 | |
CdsColorExtendedStrawberry90 | 90 | #FFDAD9 | Color palettes / Extended / Strawberry / 90 | |
CdsColorExtendedStrawberry95 | 95 | #FFEDEC | Color palettes / Extended / Strawberry / 95 | |
CdsColorExtendedStrawberry99 | 99 | #FFFBFF | Color palettes / Extended / Strawberry / 99 |
Orange (Warning)
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedOrange10 | 10 | #2C1600 | Color palettes / Extended / Orange / 10 | |
CdsColorExtendedOrange20 | 20 | #4A2800 | Color palettes / Extended / Orange / 20 | |
CdsColorExtendedOrange30 | 30 | #693C00 | Color palettes / Extended / Orange / 30 | |
CdsColorExtendedOrange40 | 40 | #8B5000 | Color palettes / Extended / Orange / 40 | |
CdsColorExtendedOrange50 | 50 | #AE6600 | Color palettes / Extended / Orange / 50 | |
CdsColorExtendedOrange60 | 60 | #D27C00 | Color palettes / Extended / Orange / 60 | |
CdsColorExtendedOrange70 | 70 | #F79300 | Color palettes / Extended / Orange / 70 | |
CdsColorExtendedOrange80 | 80 | #FFB870 | Color palettes / Extended / Orange / 80 | |
CdsColorExtendedOrange90 | 90 | #FFDCBE | Color palettes / Extended / Orange / 90 | |
CdsColorExtendedOrange95 | 95 | #FFEEE1 | Color palettes / Extended / Orange / 95 | |
CdsColorExtendedOrange99 | 99 | #FFFBFF | Color palettes / Extended / Orange / 99 |
Green (Success)
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedGreen10 | 10 | #072100 | Color palettes / Extended / Green / 10 | |
CdsColorExtendedGreen20 | 20 | #103900 | Color palettes / Extended / Green / 20 | |
CdsColorExtendedGreen30 | 30 | #1F5106 | Color palettes / Extended / Green / 30 | |
CdsColorExtendedGreen40 | 40 | #376A1F | Color palettes / Extended / Green / 40 | |
CdsColorExtendedGreen50 | 50 | #4F8436 | Color palettes / Extended / Green / 50 | |
CdsColorExtendedGreen60 | 60 | #689F4D | Color palettes / Extended / Green / 60 | |
CdsColorExtendedGreen70 | 70 | #81BA64 | Color palettes / Extended / Green / 70 | |
CdsColorExtendedGreen80 | 80 | #9CD67D | Color palettes / Extended / Green / 80 | |
CdsColorExtendedGreen90 | 90 | #B7F396 | Color palettes / Extended / Green / 90 | |
CdsColorExtendedGreen95 | 95 | #CDFFB0 | Color palettes / Extended / Green / 95 | |
CdsColorExtendedGreen99 | 99 | #F7FFEC | Color palettes / Extended / Green / 99 |
Extended - Additional colors
Blue Grey
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedBlueGrey10 | 10 | #001F2A | Color palettes / Extended / Blue Grey / 10 | |
CdsColorExtendedBlueGrey20 | 20 | #163440 | Color palettes / Extended / Blue Grey / 20 | |
CdsColorExtendedBlueGrey30 | 30 | #2E4B57 | Color palettes / Extended / Blue Grey / 30 | |
CdsColorExtendedBlueGrey40 | 40 | #466270 | Color palettes / Extended / Blue Grey / 40 | |
CdsColorExtendedBlueGrey50 | 50 | #5E7B89 | Color palettes / Extended / Blue Grey / 50 | |
CdsColorExtendedBlueGrey60 | 60 | #7895A4 | Color palettes / Extended / Blue Grey / 60 | |
CdsColorExtendedBlueGrey70 | 70 | #92B0BF | Color palettes / Extended / Blue Grey / 70 | |
CdsColorExtendedBlueGrey80 | 80 | #ADCBDB | Color palettes / Extended / Blue Grey / 80 | |
CdsColorExtendedBlueGrey90 | 90 | #C9E7F7 | Color palettes / Extended / Blue Grey / 90 | |
CdsColorExtendedBlueGrey95 | 95 | #E0F4FF | Color palettes / Extended / Blue Grey / 95 | |
CdsColorExtendedBlueGrey99 | 99 | #FAFCFF | Color palettes / Extended / Blue Grey / 99 |
Brown
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedBrown10 | 10 | #2E150B | Color palettes / Extended / Brown / 10 | |
CdsColorExtendedBrown20 | 20 | #46291E | Color palettes / Extended / Brown / 20 | |
CdsColorExtendedBrown30 | 30 | #603F33 | Color palettes / Extended / Brown / 30 | |
CdsColorExtendedBrown40 | 40 | #7A5649 | Color palettes / Extended / Brown / 40 | |
CdsColorExtendedBrown50 | 50 | #956E60 | Color palettes / Extended / Brown / 50 | |
CdsColorExtendedBrown60 | 60 | #B18779 | Color palettes / Extended / Brown / 60 | |
CdsColorExtendedBrown70 | 70 | #CEA192 | Color palettes / Extended / Brown / 70 | |
CdsColorExtendedBrown80 | 80 | #EBBCAC | Color palettes / Extended / Brown / 80 | |
CdsColorExtendedBrown90 | 90 | #FFDBCF | Color palettes / Extended / Brown / 90 | |
CdsColorExtendedBrown95 | 95 | #FFEDE7 | Color palettes / Extended / Brown / 95 | |
CdsColorExtendedBrown99 | 99 | #FFFBFF | Color palettes / Extended / Brown / 99 |
Cyan
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedCyan10 | 10 | #001F25 | Color palettes / Extended / Cyan / 10 | |
CdsColorExtendedCyan20 | 20 | #00363E | Color palettes / Extended / Cyan / 20 | |
CdsColorExtendedCyan30 | 30 | #004E59 | Color palettes / Extended / Cyan / 30 | |
CdsColorExtendedCyan40 | 40 | #006876 | Color palettes / Extended / Cyan / 40 | |
CdsColorExtendedCyan50 | 50 | #008394 | Color palettes / Extended / Cyan / 50 | |
CdsColorExtendedCyan60 | 60 | #009FB4 | Color palettes / Extended / Cyan / 60 | |
CdsColorExtendedCyan70 | 70 | #00BCD4 | Color palettes / Extended / Cyan / 70 | |
CdsColorExtendedCyan80 | 80 | #44D8F1 | Color palettes / Extended / Cyan / 80 | |
CdsColorExtendedCyan90 | 90 | #A1EFFF | Color palettes / Extended / Cyan / 90 | |
CdsColorExtendedCyan95 | 95 | #D4F7FF | Color palettes / Extended / Cyan / 95 | |
CdsColorExtendedCyan99 | 99 | #F7FDFF | Color palettes / Extended / Cyan / 99 |
Deep Orange
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedDeepOrange10 | 10 | #3B0900 | Color palettes / Extended / Deep Orange / 10 | |
CdsColorExtendedDeepOrange20 | 20 | #5F1500 | Color palettes / Extended / Deep Orange / 20 | |
CdsColorExtendedDeepOrange30 | 30 | #862200 | Color palettes / Extended / Deep Orange / 30 | |
CdsColorExtendedDeepOrange40 | 40 | #B02F00 | Color palettes / Extended / Deep Orange / 40 | |
CdsColorExtendedDeepOrange50 | 50 | #DB3E03 | Color palettes / Extended / Deep Orange / 50 | |
CdsColorExtendedDeepOrange60 | 60 | #FF5722 | Color palettes / Extended / Deep Orange / 60 | |
CdsColorExtendedDeepOrange70 | 70 | #FF8B69 | Color palettes / Extended / Deep Orange / 70 | |
CdsColorExtendedDeepOrange80 | 80 | #FFB5A0 | Color palettes / Extended / Deep Orange / 80 | |
CdsColorExtendedDeepOrange90 | 90 | #FFDBD1 | Color palettes / Extended / Deep Orange / 90 | |
CdsColorExtendedDeepOrange95 | 95 | #FFEDE8 | Color palettes / Extended / Deep Orange / 95 | |
CdsColorExtendedDeepOrange99 | 99 | #FFFBFF | Color palettes / Extended / Deep Orange / 99 |
Deep Purple
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedDeepPurple10 | 10 | #250059 | Color palettes / Extended / Deep Purple / 10 | |
CdsColorExtendedDeepPurple20 | 20 | #3F008D | Color palettes / Extended / Deep Purple / 20 | |
CdsColorExtendedDeepPurple30 | 30 | #5727A7 | Color palettes / Extended / Deep Purple / 30 | |
CdsColorExtendedDeepPurple40 | 40 | #6F43C0 | Color palettes / Extended / Deep Purple / 40 | |
CdsColorExtendedDeepPurple50 | 50 | #895EDB | Color palettes / Extended / Deep Purple / 50 | |
CdsColorExtendedDeepPurple60 | 60 | #A378F8 | Color palettes / Extended / Deep Purple / 60 | |
CdsColorExtendedDeepPurple70 | 70 | #BB99FF | Color palettes / Extended / Deep Purple / 70 | |
CdsColorExtendedDeepPurple80 | 80 | #D3BBFF | Color palettes / Extended / Deep Purple / 80 | |
CdsColorExtendedDeepPurple90 | 90 | #EBDDFF | Color palettes / Extended / Deep Purple / 90 | |
CdsColorExtendedDeepPurple95 | 95 | #F7EDFF | Color palettes / Extended / Deep Purple / 95 | |
CdsColorExtendedDeepPurple99 | 99 | #FFFBFF | Color palettes / Extended / Deep Purple / 99 |
Grey
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedGrey0 | 0 | #000000 | Color palettes / Extended / Grey / 0 (black) | |
CdsColorExtendedGrey10 | 10 | #1B1B1B | Color palettes / Extended / Grey / 10 | |
CdsColorExtendedGrey20 | 20 | #303030 | Color palettes / Extended / Grey / 20 | |
CdsColorExtendedGrey30 | 30 | #474747 | Color palettes / Extended / Grey / 30 | |
CdsColorExtendedGrey40 | 40 | #5E5E5E | Color palettes / Extended / Grey / 40 | |
CdsColorExtendedGrey50 | 50 | #777777 | Color palettes / Extended / Grey / 50 | |
CdsColorExtendedGrey60 | 60 | #919191 | Color palettes / Extended / Grey / 60 | |
CdsColorExtendedGrey70 | 70 | #ABABAB | Color palettes / Extended / Grey / 70 | |
CdsColorExtendedGrey80 | 80 | #C6C6C6 | Color palettes / Extended / Grey / 80 | |
CdsColorExtendedGrey90 | 90 | #E2E2E2 | Color palettes / Extended / Grey / 90 | |
CdsColorExtendedGrey95 | 95 | #F1F1F1 | Color palettes / Extended / Grey / 95 | |
CdsColorExtendedGrey99 | 99 | #FCFCFC | Color palettes / Extended / Grey / 99 | |
CdsColorExtendedGrey100 | 100 | #FFFFFF | Color palettes / Extended / Grey / 100 (white) |
Pink
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedPink10 | 10 | #400014 | Color palettes / Extended / Pink / 10 | |
CdsColorExtendedPink20 | 20 | #660025 | Color palettes / Extended / Pink / 20 | |
CdsColorExtendedPink30 | 30 | #900038 | Color palettes / Extended / Pink / 30 | |
CdsColorExtendedPink40 | 40 | #BC004B | Color palettes / Extended / Pink / 40 | |
CdsColorExtendedPink50 | 50 | #E61A61 | Color palettes / Extended / Pink / 50 | |
CdsColorExtendedPink60 | 60 | #FF4E7C | Color palettes / Extended / Pink / 60 | |
CdsColorExtendedPink70 | 70 | #FF869D | Color palettes / Extended / Pink / 70 | |
CdsColorExtendedPink80 | 80 | #FFB2BE | Color palettes / Extended / Pink / 80 | |
CdsColorExtendedPink90 | 90 | #FFD9DE | Color palettes / Extended / Pink / 90 | |
CdsColorExtendedPink95 | 95 | #FFECEE | Color palettes / Extended / Pink / 95 | |
CdsColorExtendedPink99 | 99 | #FFFBFF | Color palettes / Extended / Pink / 99 |
Yellow
Token name | Tone | Hex value | Figma style | |
---|---|---|---|---|
CdsColorExtendedYellow10 | 10 | #231B00 | Color palettes / Extended / Yellow / 10 | |
CdsColorExtendedYellow20 | 20 | #3C2F00 | Color palettes / Extended / Yellow / 20 | |
CdsColorExtendedYellow30 | 30 | #564500 | Color palettes / Extended / Yellow / 30 | |
CdsColorExtendedYellow40 | 40 | #725C03 | Color palettes / Extended / Yellow / 40 | |
CdsColorExtendedYellow50 | 50 | #8D7520 | Color palettes / Extended / Yellow / 50 | |
CdsColorExtendedYellow60 | 60 | #A88E38 | Color palettes / Extended / Yellow / 60 | |
CdsColorExtendedYellow70 | 70 | #C5A94F | Color palettes / Extended / Yellow / 70 | |
CdsColorExtendedYellow80 | 80 | #E2C468 | Color palettes / Extended / Yellow / 80 | |
CdsColorExtendedYellow90 | 90 | #FFE081 | Color palettes / Extended / Yellow / 90 | |
CdsColorExtendedYellow95 | 95 | #FFF0C9 | Color palettes / Extended / Yellow / 95 | |
CdsColorExtendedYellow99 | 99 | #FFFBFF | Color palettes / Extended / Yellow / 99 |