Sienna

#6E4111

Orange

Color Codes

All color formats for development

HEX
#6E4111
RGB
rgb(110, 65, 17)
HSL
hsl(31, 73%, 25%)
OKLCH
oklch(0.421 0.086 62.3)
CMYK
cmyk(0%, 41%, 85%, 57%)

Accessibility

WCAG contrast compliance

On White Background

8.65:1

AA AAA

On Black Background

2.43:1

AA AAA
Run full accessibility check

Tailwind Scale

50-950 scale matching Tailwind CSS naming

50
#FDF8
100
#FAEE
200
#F6DF
300
#EFC6
400
#E7A8
500
#E08F
600
#C273
700
#9A5B
800
#6E41
900
#472A
950
#2C1A

Shades

Darker variations

1#633B0F
2#58340E
3#4D2E0C
4#42270A
5#372109
6#2C1A07
7#211405
8#160D03
9#0B0702

Tints

Lighter variations

1#8F5516
2#B0681C
3#D27C21
4#E08F38
5#E5A25A
6#EAB47B
7#F0C79C
8#F5DABD
9#FAECDE

Tones

Muted variations

1#6A4116
2#65411B
3#60411F
4#5C4124
5#574128
6#52402D
7#4E4032
8#494036
9#44403B

Usage Guidelines

Recommended use cases for each shade level

LevelColorTypical Use Cases
50
FDF8
#FDF8F2
BackgroundsSubtle highlightsCard backgrounds
100
FAEE
#FAEEE0
Light backgroundsTable row hoverSkeleton loading
200
F6DF
#F6DFC6
Secondary backgroundsInput backgroundsDividers
300
EFC6
#EFC69A
BordersInactive statesPlaceholder text
400
E7A8
#E7A865
Disabled statesSecondary iconsMuted text
500
E08F
#E08F38
Primary brand colorCTAsActive elementsLinks
600
C273
#C2731E
Hover statesFocus ringsPrimary buttons hover
700
9A5B
#9A5B18
Active/pressed statesDark mode accentsSecondary text
800
6E41
#6E4111
Text on light backgroundsHeadingsStrong borders
900
472A
#472A0B
Primary textHigh emphasis contentDark headings
950
2C1A
#2C1A07
Maximum contrast textDark mode backgrounds

Export Code

Copy ready-to-use code for your project

:root {
  --sienna-50: #FDF8F2;
  --sienna-100: #FAEEE0;
  --sienna-200: #F6DFC6;
  --sienna-300: #EFC69A;
  --sienna-400: #E7A865;
  --sienna-500: #E08F38;
  --sienna-600: #C2731E;
  --sienna-700: #9A5B18;
  --sienna-800: #6E4111;
  --sienna-900: #472A0B;
  --sienna-950: #2C1A07;
}
Generate More ShadesCreate PaletteConvert Color