Khaki

#EDE65E

Yellow

Color Codes

All color formats for development

HEX
#EDE65E
RGB
rgb(237, 230, 94)
HSL
hsl(57, 80%, 65%)
OKLCH
oklch(0.905 0.155 106.3)
CMYK
cmyk(0%, 3%, 60%, 7%)

Accessibility

WCAG contrast compliance

On White Background

1.31:1

AA AAA

On Black Background

16.08:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FDFD
100
#FBFA
200
#F8F6
300
#F3EF
400
#EDE6
500
#E8DF
600
#CAC1
700
#A19A
800
#736E
900
#4946
950
#2E2C

Shades

Darker variations

1#EAE141
2#E7DD23
3#D1C817
4#B3AB14
5#958F11
6#77720D
7#5A560A
8#3C3907
9#1E1D03

Tints

Lighter variations

1#EFE96E
2#F1EB7E
3#F3EE8F
4#F4F09F
5#F6F3AF
6#F8F5BF
7#FAF8CF
8#FBFADF
9#FDFDEF

Tones

Muted variations

1#E6E065
2#DFD96D
3#D8D374
4#D1CC7B
5#C9C682
6#C2BF89
7#BBB990
8#B4B397
9#ADAC9F

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDFD
#FDFDF1
BackgroundsSubtle highlightsCard backgrounds
100
FBFA
#FBFADF
Light backgroundsTable row hoverSkeleton loading
200
F8F6
#F8F6C3
Secondary backgroundsInput backgroundsDividers
300
F3EF
#F3EF95
BordersInactive statesPlaceholder text
400
EDE6
#EDE65E
Disabled statesSecondary iconsMuted text
500
E8DF
#E8DF30
Primary brand colorCTAsActive elementsLinks
600
CAC1
#CAC116
Hover statesFocus ringsPrimary buttons hover
700
A19A
#A19A12
Active/pressed statesDark mode accentsSecondary text
800
736E
#736E0D
Text on light backgroundsHeadingsStrong borders
900
4946
#494608
Primary textHigh emphasis contentDark headings
950
2E2C
#2E2C05
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --khaki-50: #FDFDF1;
  --khaki-100: #FBFADF;
  --khaki-200: #F8F6C3;
  --khaki-300: #F3EF95;
  --khaki-400: #EDE65E;
  --khaki-500: #E8DF30;
  --khaki-600: #CAC116;
  --khaki-700: #A19A12;
  --khaki-800: #736E0D;
  --khaki-900: #494608;
  --khaki-950: #2E2C05;
}
Generate More ShadesCreate PaletteConvert Color