#BA363A Color

#BA363A is rgb(186, 54, 58) in RGB and hsl(358, 55%, 47%) in HSL. The closest CSS named color is Brown. White text is most readable on this background.

#BA363A

HEX#BA363A

RGBrgb(186, 54, 58)

HSLhsl(358, 55%, 47%)

HSVhsv(358, 71%, 73%)

OKLCHoklch(53.2% 0.168 23.4)

CMYKcmyk(0%, 71%, 69%, 27%)

Text Contrast & Accessibility

WCAG contrast ratios for text on a #BA363A background. AA requires 4.5:1 for normal text and 3:1 for large text; AAA requires 7:1.

TextWhite text5.71:1AA normal ✓AA large ✓AAA normal ✗

TextBlack text3.68:1AA normal ✗AA large ✓AAA normal ✗

Color Harmonies

Colors that pair well with #BA363A based on color wheel relationships. Click any swatch for its full breakdown.

Base#BA363A Complementary#36BAB5 Analogous#BA367C Analogous#BA7336 Triadic#3ABA36 Triadic#363ABA

Tints & Shades

Lighter tints and darker shades of #BA363A, useful for hover states, backgrounds, and text variants.

Tints

#CA494D #D3696C #DB8487 #E3A0A2 #EBBCBD #F5DBDC

Shades

#A22F33 #8A282B #732124 #57191B #3F1214 #280B0C

Use #BA363A in Our Tools

Hex to RGB Hex to HSL Hex to CMYK Hex to Pantone RGBA to Hex