Hex Color #224778 - Custom Color

Color Codes

HEX

#224778

RGB

rgb(34, 71, 120)

HSL

hsl(214, 56%, 30%)

CMYK

cmyk(72%, 41%, 0%, 53%)

HSV

hsv(214, 72%, 47%)

Color Name

Custom Color

Color Variations

Color Harmonies

Analogous

#227277 #224777 #272277

Triadic

#224777 #772247 #477722

Split Complementary

#224777 #772722 #727722

Tetradic (Square)

#224777 #772272 #775222 #227727

Complementary

#224778 #775222

Accessibility

WCAG Contrast Ratios

Text on White Background

Sample Text

Contrast Ratio: 9.37:1

Pass - WCAG AA (Normal Text)

Pass - WCAG AAA (Normal Text)

Text on Black Background

Sample Text

Contrast Ratio: 2.24:1

Fail - WCAG AA (Normal Text)

Fail - WCAG AAA (Normal Text)

Recommended Text Color

For best readability on this background color, use white text.

Color in Use

Card with colored border

Background with 20% opacity

CSS Code

.element {

background-color: #224778;

color: #224778;

border-color: #224778;

}

Tailwind CSS (with arbitrary values)

bg-[#224778]

text-[#224778]

border-[#224778]

// Example usage: