Golden yellow to HSL — Color Code

#fec615
Format Value
HEX #fec615
RGB rgb(254, 198, 21)
HSL hsl(45.6, 99.1%, 53.9%)
CMYK cmyk(0%, 22%, 91.7%, 0.4%)
HSV hsv(45.6, 91.7%, 99.6%)

golden yellow color harmonies

Tints & shades of golden yellow

Tints (lighter)

#fecb2a #fed040 #fed655 #fedb6a #fee07f #ffe595 #ffeaaa #ffefbf #fff5d4 #fffaea

Shades (darker)

#e7b413 #d0a211 #b9900f #a27e0d #8b6c0b #735a0a #5c4808 #453606 #2e2404 #171202

Contrast & accessibility

The quick brown fox

On white · 1.58:1 · Fail

The quick brown fox

On black · 13.3:1 · AAA

Recommended text color: #000000

Use golden yellow in code

CSS color: #fec615;
SCSS $color: #fec615;
Tailwind bg-[#fec615]
Swift UIColor(red: 0.996, green: 0.776, blue: 0.082, alpha: 1)
Android Color.parseColor("#fec615")
Flutter Color(0xFFFEC615)

Colors similar to golden yellow

Browse all Yellow colors →

What is the HSL code for golden yellow?

The CSS color golden yellow in HSL format is hsl(45.6, 99.1%, 53.9%). Use this value directly in CSS, SVG, and most design tools.

How do I use golden yellow in CSS?

To apply golden yellow in CSS:

  • Text color: color: hsl(45.6, 99.1%, 53.9%);
  • Background: background-color: hsl(45.6, 99.1%, 53.9%);
  • Border: border-color: hsl(45.6, 99.1%, 53.9%);

What are all the color format values for golden yellow?

FormatValue
HEX#fec615
RGBrgb(254, 198, 21)
HSLhsl(45.6, 99.1%, 53.9%)
CMYKcmyk(0%, 22%, 91.7%, 0.4%)

How do I convert golden yellow to HSL?

Select golden yellow from the color name list in our color converter. The HSL value — hsl(45.6, 99.1%, 53.9%) — appears instantly alongside HEX, RGB, HSL and CMYK.

What color family does golden yellow belong to?

golden yellow belongs to the yellow color family. It is a medium, vivid color with HSL values: hue 45.6°, saturation 99.1%, lightness 53.9%.

How do I create lighter and darker shades of golden yellow?

Lighter variant (lightness 68.9%): #fed961. Darker variant (lightness 38.9%): #c59601. 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.