#F7E166 Hex Color
Online color picker to view shades, tints, color codes, and complementary colors
This high-saturation yellow brings an immediate sense of urgency and warmth to a design. Because #f7e166 is so intense, it works best as a 10% accent rather than a dominant background color. It pairs unexpectedly well with deep charcoal grays to create high-contrast, readable text. Use the hex code #f7e166 sparingly to highlight sale items, buttons, or critical call-to-action elements in your interface.
Questions about #f7e166
What is #f7e166 in RGB, HSL and CMYK?
In RGB, #f7e166 is rgb(247, 225, 102), in HSL hsl(51, 90%, 68%) and in CMYK 0%, 9%, 59%, 3%.
What colors pair well with #f7e166 in a design?
#f7e166 pairs best with deep neutrals like charcoal or dark gray, which provide the necessary contrast to make the yellow readable. Avoid pairing it with other high-intensity brights, as they often create visual fatigue and compete for attention on the screen.
Should I use #f7e166 as a background color?
Avoid using #f7e166 as a dominant background color because its high intensity can strain the eyes and make text difficult to read. It functions much better as a targeted accent, such as for notification badges, primary buttons, or specific highlights that need to pop.
Is #f7e166 readable on white or black?
#f7e166 has a 1.31:1 contrast ratio on white and 15.91: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.