IG

#E83341

#C62362

#FFFFFF

#9D129E

#F4AB3F

Actions

Explore the palette in different formats, and actions.

Colors overview

Orange

Purple

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#e83341	rgb(232, 51, 65)	hsl(360 80% 55%)	oklab(61% 0.2 0.08)	oklch(61% 0.21 23)	color(display-p3 0.84 0.27 0.28)
	#c62362	rgb(198, 35, 98)	hsl(340 70% 46%)	oklab(55% 0.2 0.02)	oklch(55% 0.2 4.5)	color(display-p3 0.71 0.21 0.38)
	#ffffff	rgb(255, 255, 255)	hsl(none 0% 100%)	oklab(100% 0 0)	oklch(100% 0 none)	color(display-p3 1 1 1)
	#9d129e	rgb(157, 18, 158)	hsl(300 80% 35%)	oklab(49% 0.18 -0.12)	oklch(49% 0.22 330)	color(display-p3 0.56 0.14 0.6)
	#f4ab3f	rgb(244, 171, 63)	hsl(36 89% 60%)	oklab(79% 0.04 0.14)	oklch(79% 0.15 73)	color(display-p3 0.91 0.68 0.33)

 Click on a color value to copy it to your clipboard.

Contrast ratios checker

Click one color card to view the complete contrast checker tests.

#E83341

AA - 4.21



#C62362

AA - 5.5



#FFFFFF

AA - 1



#9D129E

AA - 6.96



#F4AB3F

AA - 1.95



Color blindness

The simulation of color blindness may not be 100% accurate sometimes.

Colors preview as gradient with protanopia

Colors preview as palette with protanopia

UI components preview

Preview the gradient in different UI components.

HDR color space

HDR oklab colors



background: linear-gradient(45deg, oklab(61% 0.198 0.083), oklab(54.6% 0.198 0.016), oklab(100% 0 0), oklab(49.5% 0.184 -0.116), oklab(79.3% 0.043 0.14))

Fallback colors



background: linear-gradient(45deg, #E83341, #C62362, #FFFFFF, #9D129E, #F4AB3F)

Colors



<!-- Primary Colors -->
<color name="ig_color_10">#E83341</color>
<color name="ig_color_20">#C62362</color>
<color name="ig_color_30">#FFFFFF</color>
<color name="ig_color_40">#9D129E</color>
<color name="ig_color_50">#F4AB3F</color>

PWA prompt