Tailwind v4

By RubenPublished on Mar 7, 2026
2
Views
0
Remixes

test

Text Colours
Hide TC1 text colour
Hide TC2 text colour
AA+All colours meet at least AA, with some AAA.
Accessibility Rating
AAA: all colours meet AAA.AA+: mix of AA and AAA.AA: all colours meet AA.Partial fail: some colours fail AA.Fail: all colours fail AA.
Enable Dark mode
slate
#F8FAFC
#F1F5F9
#E2E8F0
#CAD5E2
#90A1B9
#62748E
#45556C
#314158
#1D293D
#0F172B
#020618
AAA
AAA
AAA
AAA
AAA
AA
AAA
AAA
AAA
AAA
AAA
gray
#F9FAFB
#F3F4F6
#E5E7EB
#D1D5DC
#99A1AF
#6A7282
#4A5565
#364153
#1E2939
#101828
#030712
AAA
AAA
AAA
AAA
AAA
AA
AAA
AAA
AAA
AAA
AAA
zinc
#FAFAFA
#F4F4F5
#E4E4E7
#D4D4D8
#9F9FA9
#71717B
#52525C
#3F3F46
#27272A
#18181B
#09090B
AAA
AAA
AAA
AAA
AAA
AA
AAA
AAA
AAA
AAA
AAA
neutral
#FAFAFA
#F5F5F5
#E5E5E5
#D4D4D4
#A1A1A1
#737373
#525252
#404040
#262626
#171717
#0A0A0A
AAA
AAA
AAA
AAA
AAA
AA
AAA
AAA
AAA
AAA
AAA
stone
#FAFAF9
#F5F5F4
#E7E5E4
#D6D3D1
#A6A09B
#79716B
#57534D
#44403B
#292524
#1C1917
#0C0A09
AAA
AAA
AAA
AAA
AAA
AA
AAA
AAA
AAA
AAA
AAA
mauve
#FAFAFA
#F3F1F3
#E7E4E7
#D7D0D7
#A89EA9
#79697B
#594C5B
#463947
#2A212C
#1D161E
#0C090C
AAA
AAA
AAA
AAA
AAA
AA
AAA
AAA
AAA
AAA
AAA
olive
#FBFBF9
#F4F4F0
#E8E8E3
#D8D8D0
#ABAB9C
#7C7C67
#5B5B4B
#474739
#2B2B22
#1D1D16
#0C0C09
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
AAA
mist
#F9FBFB
#F1F3F3
#E3E7E8
#D0D6D8
#9CA8AB
#67787C
#4B585B
#394447
#22292B
#161B1D
#090B0C
AAA
AAA
AAA
AAA
AAA
AA
AAA
AAA
AAA
AAA
AAA
taupe
#FBFAF9
#F3F1F1
#E8E4E3
#D8D2D0
#ABA09C
#7C6D67
#5B4F4B
#473C39
#2B2422
#1D1816
#0C0A09
AAA
AAA
AAA
AAA
AAA
AA
AAA
AAA
AAA
AAA
AAA
red
#FEF2F2
#FFE2E2
#FFC9C9
#FFA2A2
#FF6467
#FB2C36
#E7000B
#C10007
#9F0712
#82181A
#460809
AAA
AAA
AAA
AAA
AAA
AA
AA
AA
AAA
AAA
AAA
orange
#FFF7ED
#FFEDD4
#FFD6A7
#FFB86A
#FF8904
#FF6900
#F54900
#CA3500
#9F2D00
#7E2A0C
#441306
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
amber
#FFFBEB
#FEF3C6
#FEE685
#FFD230
#FFB900
#FE9A00
#E17100
#BB4D00
#973C00
#7B3306
#461901
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
yellow
#FEFCE8
#FEF9C2
#FFF085
#FFDF20
#FDC700
#F0B100
#D08700
#A65F00
#894B00
#733E0A
#432004
AAA
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
lime
#F7FEE7
#ECFCCA
#D8F999
#BBF451
#9AE600
#7CCF00
#5EA500
#497D00
#3C6300
#35530E
#192E03
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
green
#F0FDF4
#DCFCE7
#B9F8CF
#7BF1A8
#05DF72
#00C950
#00A63E
#008236
#016630
#0D542B
#032E15
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
emerald
#ECFDF5
#D0FAE5
#A4F4CF
#5EE9B5
#00D492
#00BC7D
#009966
#007A55
#006045
#004F3B
#002C22
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
teal
#F0FDFA
#CBFBF1
#96F7E4
#46ECD5
#00D5BE
#00BBA7
#009689
#00786F
#005F5A
#0B4F4A
#022F2E
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
cyan
#ECFEFF
#CEFAFE
#A2F4FD
#53EAFD
#00D3F2
#00B8DB
#0092B8
#007595
#005F78
#104E64
#053345
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
sky
#F0F9FF
#DFF2FE
#B8E6FE
#74D4FF
#00BCFF
#00A6F4
#0084D1
#0069A8
#00598A
#024A70
#052F4A
AAA
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
blue
#EFF6FF
#DBEAFE
#BEDBFF
#8EC5FF
#51A2FF
#2B7FFF
#155DFC
#1447E6
#193CB8
#1C398E
#162456
AAA
AAA
AAA
AAA
AAA
AA
AA
AA
AAA
AAA
AAA
indigo
#EEF2FF
#E0E7FF
#C6D2FF
#A3B3FF
#7C86FF
#615FFF
#4F39F6
#432DD7
#372AAC
#312C85
#1E1A4D
AAA
AAA
AAA
AAA
AA
AA
AA
AAA
AAA
AAA
AAA
violet
#F5F3FF
#EDE9FE
#DDD6FF
#C4B4FF
#A684FF
#8E51FF
#7F22FE
#7008E7
#5D0EC0
#4D179A
#2F0D68
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
AAA
purple
#FAF5FF
#F3E8FF
#E9D4FF
#DAB2FF
#C27AFF
#AD46FF
#9810FA
#8200DB
#6E11B0
#59168B
#3C0366
AAA
AAA
AAA
AAA
AAA
AA
AA
AAA
AAA
AAA
AAA
fuchsia
#FDF4FF
#FAE8FF
#F6CFFF
#F4A8FF
#ED6AFF
#E12AFB
#C800DE
#A800B7
#8A0194
#721378
#4B004F
AAA
AAA
AAA
AAA
AAA
AA
AA
AA
AAA
AAA
AAA
pink
#FDF2F8
#FCE7F3
#FCCEE8
#FDA5D5
#FB64B6
#F6339A
#E60076
#C6005C
#A3004C
#861043
#510424
AAA
AAA
AAA
AAA
AAA
AA
AA
AA
AAA
AAA
AAA
rose
#FFF1F2
#FFE4E6
#FFCCD3
#FFA1AD
#FF637E
#FF2056
#EC003F
#C70036
#A50036
#8B0836
#4D0218
AAA
AAA
AAA
AAA
AAA
AA
AA
AA
AAA
AAA
AAA