Sienna

#A25E11

Orange

Color Codes

All color formats for development

HEX
#A25E11
RGB
rgb(162, 94, 17)
HSL
hsl(32, 81%, 35%)
OKLCH
oklch(0.548 0.121 61.6)
CMYK
cmyk(0%, 42%, 90%, 36%)

Accessibility

WCAG contrast compliance

On White Background

5.07:1

AA AAA

On Black Background

4.15:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FEF8
100
#FCEE
200
#F9E0
300
#F4C8
400
#EEAB
500
#E992
600
#CB76
700
#A25E
800
#7343
900
#4A2B
950
#2E1B

Shades

Darker variations

1#91550F
2#814B0E
3#71420C
4#61380A
5#512F08
6#412607
7#301C05
8#201303
9#100902

Tints

Lighter variations

1#C07014
2#DE8117
3#E9912D
4#ECA14B
5#EFB169
6#F2C087
7#F6D0A5
8#F9E0C3
9#FCEFE1

Tones

Muted variations

1#9A5E18
2#935D1F
3#8C5D27
4#855C2E
5#7D5C35
6#765B3C
7#6F5B44
8#685A4B
9#605A52

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FEF8
#FEF8F1
BackgroundsSubtle highlightsCard backgrounds
100
FCEE
#FCEEDF
Light backgroundsTable row hoverSkeleton loading
200
F9E0
#F9E0C3
Secondary backgroundsInput backgroundsDividers
300
F4C8
#F4C895
BordersInactive statesPlaceholder text
400
EEAB
#EEAB5D
Disabled statesSecondary iconsMuted text
500
E992
#E9922F
Primary brand colorCTAsActive elementsLinks
600
CB76
#CB7615
Hover statesFocus ringsPrimary buttons hover
700
A25E
#A25E11
Active/pressed statesDark mode accentsSecondary text
800
7343
#73430C
Text on light backgroundsHeadingsStrong borders
900
4A2B
#4A2B08
Primary textHigh emphasis contentDark headings
950
2E1B
#2E1B05
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sienna-50: #FEF8F1;
  --sienna-100: #FCEEDF;
  --sienna-200: #F9E0C3;
  --sienna-300: #F4C895;
  --sienna-400: #EEAB5D;
  --sienna-500: #E9922F;
  --sienna-600: #CB7615;
  --sienna-700: #A25E11;
  --sienna-800: #73430C;
  --sienna-900: #4A2B08;
  --sienna-950: #2E1B05;
}
Generate More ShadesCreate PaletteConvert Color