Gold

#EDE92C

Yellow

Color Codes

All color formats for development

HEX
#EDE92C
RGB
rgb(237, 233, 44)
HSL
hsl(59, 84%, 55%)
OKLCH
oklch(0.908 0.187 108.3)
CMYK
cmyk(0%, 2%, 81%, 7%)

Accessibility

WCAG contrast compliance

On White Background

1.29:1

AA AAA

On Black Background

16.29:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FEFE
100
#FCFC
200
#FAF9
300
#F6F4
400
#F1EE
500
#EDE9
600
#CECB
700
#A4A2
800
#7574
900
#4B4A
950
#2F2E

Shades

Darker variations

1#E8E514
2#CECB12
3#B5B210
4#9B980D
5#817F0B
6#676609
7#4D4C07
8#343304
9#1A1902

Tints

Lighter variations

1#EEEC41
2#F0EE56
3#F2F06B
4#F4F280
5#F6F495
6#F8F6AB
7#F9F9C0
8#FBFBD5
9#FDFDEA

Tones

Muted variations

1#E3E035
2#D9D73F
3#D0CD49
4#C6C452
5#BCBB5C
6#B3B266
7#A9A86F
8#A09F79
9#969683

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FEFE
#FEFEF1
BackgroundsSubtle highlightsCard backgrounds
100
FCFC
#FCFCDE
Light backgroundsTable row hoverSkeleton loading
200
FAF9
#FAF9C2
Secondary backgroundsInput backgroundsDividers
300
F6F4
#F6F493
BordersInactive statesPlaceholder text
400
F1EE
#F1EE5B
Disabled statesSecondary iconsMuted text
500
EDE9
#EDE92C
Primary brand colorCTAsActive elementsLinks
600
CECB
#CECB12
Hover statesFocus ringsPrimary buttons hover
700
A4A2
#A4A20E
Active/pressed statesDark mode accentsSecondary text
800
7574
#75740A
Text on light backgroundsHeadingsStrong borders
900
4B4A
#4B4A07
Primary textHigh emphasis contentDark headings
950
2F2E
#2F2E04
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --gold-50: #FEFEF1;
  --gold-100: #FCFCDE;
  --gold-200: #FAF9C2;
  --gold-300: #F6F493;
  --gold-400: #F1EE5B;
  --gold-500: #EDE92C;
  --gold-600: #CECB12;
  --gold-700: #A4A20E;
  --gold-800: #75740A;
  --gold-900: #4B4A07;
  --gold-950: #2F2E04;
}
Generate More ShadesCreate PaletteConvert Color