Olive

#AD8005

Orange

Color Codes

All color formats for development

HEX
#AD8005
RGB
rgb(173, 128, 5)
HSL
hsl(44, 94%, 35%)
OKLCH
oklch(0.627 0.128 83.5)
CMYK
cmyk(0%, 26%, 97%, 32%)

Accessibility

WCAG contrast compliance

On White Background

3.58:1

AA AAA

On Black Background

5.87:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FFFB
100
#FEF5
200
#FDEC
300
#FBDE
400
#FACD
500
#F8BF
600
#DAA1
700
#AD80
800
#7C5C
900
#4F3B
950
#3125

Shades

Darker variations

1#9C7405
2#8B6704
3#795A04
4#684D03
5#574003
6#453302
7#342702
8#231A01
9#110D01

Tints

Lighter variations

1#CD9806
2#EDB007
3#F8BE1E
4#F9C73E
5#FAD05E
6#FBDA7E
7#FCE39F
8#FDECBF
9#FEF6DF

Tones

Muted variations

1#A57C0E
2#9C7916
3#94751F
4#8C7127
5#836D2F
6#7B6938
7#726540
8#6A6148
9#625D51

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FFFB
#FFFBF0
BackgroundsSubtle highlightsCard backgrounds
100
FEF5
#FEF5DC
Light backgroundsTable row hoverSkeleton loading
200
FDEC
#FDECBF
Secondary backgroundsInput backgroundsDividers
300
FBDE
#FBDE8D
BordersInactive statesPlaceholder text
400
FACD
#FACD52
Disabled statesSecondary iconsMuted text
500
F8BF
#F8BF20
Primary brand colorCTAsActive elementsLinks
600
DAA1
#DAA107
Hover statesFocus ringsPrimary buttons hover
700
AD80
#AD8005
Active/pressed statesDark mode accentsSecondary text
800
7C5C
#7C5C04
Text on light backgroundsHeadingsStrong borders
900
4F3B
#4F3B02
Primary textHigh emphasis contentDark headings
950
3125
#312502
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --olive-50: #FFFBF0;
  --olive-100: #FEF5DC;
  --olive-200: #FDECBF;
  --olive-300: #FBDE8D;
  --olive-400: #FACD52;
  --olive-500: #F8BF20;
  --olive-600: #DAA107;
  --olive-700: #AD8005;
  --olive-800: #7C5C04;
  --olive-900: #4F3B02;
  --olive-950: #312502;
}
Generate More ShadesCreate PaletteConvert Color