Ocre to HSL — Color Code

#c69c04
Format Value
HEX #c69c04
RGB rgb(198, 156, 4)
HSL hsl(47, 96%, 39.6%)
CMYK cmyk(0%, 21.2%, 98%, 22.4%)
HSV hsv(47, 98%, 77.6%)

ocre color harmonies

Tints & shades of ocre

Tints (lighter)

#cba51b #d0ae32 #d6b748 #dbc05f #e0c976 #e5d28d #eadba4 #efe4bb #f5edd1 #faf6e8

Shades (darker)

#b48e04 #a28003 #907103 #7e6303 #6c5502 #5a4702 #483901 #362b01 #241c01 #120e00

Contrast & accessibility

The quick brown fox

On white · 2.57:1 · Fail

The quick brown fox

On black · 8.16:1 · AAA

Recommended text color: #000000

Use ocre in code

CSS color: #c69c04;
SCSS $color: #c69c04;
Tailwind bg-[#c69c04]
Swift UIColor(red: 0.776, green: 0.612, blue: 0.016, alpha: 1)
Android Color.parseColor("#c69c04")
Flutter Color(0xFFC69C04)

Colors similar to ocre

Browse all Yellow colors →

What is the HSL code for ocre?

The CSS color ocre in HSL format is hsl(47, 96%, 39.6%). Use this value directly in CSS, SVG, and most design tools.

How do I use ocre in CSS?

To apply ocre in CSS:

  • Text color: color: hsl(47, 96%, 39.6%);
  • Background: background-color: hsl(47, 96%, 39.6%);
  • Border: border-color: hsl(47, 96%, 39.6%);

What are all the color format values for ocre?

FormatValue
HEX#c69c04
RGBrgb(198, 156, 4)
HSLhsl(47, 96%, 39.6%)
CMYKcmyk(0%, 21.2%, 98%, 22.4%)

How do I convert ocre to HSL?

Select ocre from the color name list in our color converter. The HSL value — hsl(47, 96%, 39.6%) — appears instantly alongside HEX, RGB, HSL and CMYK.

What color family does ocre belong to?

ocre belongs to the yellow color family. It is a medium, vivid color with HSL values: hue 47°, saturation 96%, lightness 39.6%.

How do I create lighter and darker shades of ocre?

Lighter variant (lightness 54.6%): #faca1c. Darker variant (lightness 24.6%): #7b6103. These values are computed by adjusting HSL lightness ±15% while keeping the same hue and saturation.

What is HSL used for?

HSL describes colors by hue (0–360°), saturation (0–100%) and lightness (0–100%). It is more intuitive for designers — easy to create lighter, darker or less saturated variants of any color.