#F5B22C Hex Color
Online color picker to view shades, tints, color codes, and complementary colors
A high-saturation golden orange, #f5b22c packs enough visual weight to demand attention in any layout. Its warm intensity makes it ideal for bold accents or call-to-action buttons. Because it carries such energy, avoid using it as a dominant background. Black text remains readable on this hex code, maintaining an 11.3:1 contrast ratio. Use it alongside deep, cool grays to balance its natural warmth.
Questions about #f5b22c
What is #f5b22c in RGB, HSL and CMYK?
In RGB, #f5b22c is rgb(245, 178, 44), in HSL hsl(40, 91%, 57%) and in CMYK 0%, 27%, 82%, 4%.
How should I use #f5b22c in my UI design?
Use #f5b22c sparingly as an accent for call-to-action buttons or highlights where you need to draw the eye. Because of its intensity, applying it to large backgrounds often overwhelms the interface, so balance it with neutral or cool-toned colors to maintain a clean and readable layout.
What colors pair well with #f5b22c for a balanced palette?
This golden orange looks best when paired with deep, desaturated tones like charcoal to ground its energy. You can also create a harmonious look by pairing it with navy to provide a sophisticated visual balance that prevents the color from feeling too chaotic or overwhelming.
Is #f5b22c readable on white or black?
#f5b22c has a 1.86:1 contrast ratio on white and 11.28:1 on black. WCAG asks for 4.5:1 for body text and 3:1 for large text, so on white it is too faint for text and on black it works for body text. Try other pairs in the contrast checker.