About Ant Design
Ant Design defines a refined palette where each hue carries ten steps (1 to 10); step 6 is the brand color, such as #1677FF for blue. The @ant-design/colors package generates accessible scales.
How to use
Call generate("#1677FF") to produce a 10-step scale, or import presetPrimaryColors. Map steps to component states like hover and active.
Official documentation ↗
Red
#F5222D
Shades
1 #FFF 2 #FFC 3 #FFA 4 #FF7 5 #FF4 6 #F52 7 #CF1 8 #A80 9 #820 10 #5C0
Volcano
#FA541C
Shades
1 #FFF 2 #FFD 3 #FFB 4 #FF9 5 #FF7 6 #FA5 7 #D43 8 #AD2 9 #871 10 #610
Orange
#FA8C16
Shades
1 #FFF 2 #FFE 3 #FFD 4 #FFC 5 #FFA 6 #FA8 7 #D46 8 #AD4 9 #873 10 #612
Gold
#FAAD14
Shades
1 #FFF 2 #FFF 3 #FFE 4 #FFD 5 #FFC 6 #FAA 7 #D48 8 #AD6 9 #874 10 #613
Yellow
#FADB14
Shades
1 #FEF 2 #FFF 3 #FFF 4 #FFF 5 #FFE 6 #FAD 7 #D4B 8 #AD8 9 #876 10 #614
Lime
#A0D911
Shades
1 #FCF 2 #F4F 3 #EAF 4 #D3F 5 #BAE 6 #A0D 7 #7CB 8 #5B8 9 #3F6 10 #254
Green
#52C41A
Shades
1 #F6F 2 #D9F 3 #B7E 4 #95D 5 #73D 6 #52C 7 #389 8 #237 9 #135 10 #092
Cyan
#13C2C2
Shades
1 #E6F 2 #B5F 3 #87E 4 #5CD 5 #36C 6 #13C 7 #089 8 #006 9 #004 10 #002
Blue
#1677FF
Shades
1 #E6F 2 #BAE 3 #91C 4 #69B 5 #409 6 #167 7 #095 8 #003 9 #002 10 #001
Geekblue
#2F54EB
Shades
1 #F0F 2 #D6E 3 #ADC 4 #85A 5 #597 6 #2F5 7 #1D3 8 #102 9 #061 10 #030
Purple
#722ED1
Shades
1 #F9F 2 #EFD 3 #D3A 4 #B37 5 #925 6 #722 7 #531 8 #391 9 #220 10 #120
Magenta
#EB2F96
Shades
1 #FFF 2 #FFD 3 #FFA 4 #FF8 5 #F75 6 #EB2 7 #C41 8 #9E1 9 #780 10 #520
Grey
#666666
Shades
1 #A6A 2 #999 3 #8C8 4 #808 5 #737 6 #666 7 #404 8 #1A1 9 #000 10 #000
No matching colors
Source: Ant Design · @ant-design/colors 7.2.1
