#B20D30 Hex Color
Online color picker to view shades, tints, color codes, and complementary colors
This saturated, intense crimson commands immediate attention. Its heavy, dark saturation makes it risky for large backgrounds, where it can easily overwhelm the eye. Instead, use #b20d30 as a bold accent for calls to action or UI elements where you need high impact. Because it offers strong contrast against white text, it ensures excellent readability for buttons and small graphic details.
Questions about #b20d30
What is #b20d30 in RGB, HSL and CMYK?
In RGB, #b20d30 is rgb(178, 13, 48), in HSL hsl(347, 86%, 37%) and in CMYK 0%, 93%, 73%, 30%. Browse more shades of red with names and hex codes.
How should I use #b20d30 in UI design?
#b20d30 functions best as a high-contrast accent color for interactive elements like buttons, notification badges, or error states. Avoid using this heavy, saturated crimson as a large background color, as it tends to overwhelm the eye and fatigue the user.
What colors pair well with #b20d30?
Because #b20d30 carries significant visual weight, it pairs effectively with neutral tones like light gray or crisp white to maintain readability. For more sophisticated palettes, consider combining it with charcoal to ground the intensity while allowing the red to pop.
Is #b20d30 readable on white or black?
#b20d30 has a 7.01:1 contrast ratio on white and 2.99:1 on black. WCAG asks for 4.5:1 for body text and 3:1 for large text, so on white it works for body text and on black it is too faint for text. Try other pairs in the contrast checker.