Ninja

#354696

#F5F4B8

#67BCE6

#E5788C

#FDFEFF

Actions

Explore the palette in different formats, and actions.

Colors overview

Blue

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#354696	rgb(53, 70, 150)	hsl(230 48% 40%)	hwb(230 21% 41%)	lch(31.9 49.1 287)	lab(31.9 14.2 -47)	cmyk 65%, 53%, 0%, 41%
	#f5f4b8	rgb(245, 244, 184)	hsl(59 75% 84%)	hwb(59 72% 3.9%)	lch(95.2 29.9 103)	lab(95.2 -6.51 29.2)	cmyk 0%, 0%, 25%, 4%
	#67bce6	rgb(103, 188, 230)	hsl(200 72% 65%)	hwb(200 40% 9.8%)	lch(72.1 34.5 239)	lab(72.1 -17.9 -29.4)	cmyk 55%, 18%, 0%, 10%
	#e5788c	rgb(229, 120, 140)	hsl(350 68% 68%)	hwb(350 47% 10%)	lch(63.7 45.5 12)	lab(63.7 44.5 9.47)	cmyk 0%, 48%, 39%, 10%
	#fdfeff	rgb(253, 254, 255)	hsl(210 100% 100%)	hwb(210 99% 0%)	lch(99.6 0.637 251)	lab(99.6 -0.21 -0.601)	cmyk 1%, 0%, 0%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#354696

AAA - 8.5



#F5F4B8

AA - 1.13



#67BCE6

AA - 2.11



#E5788C

AA - 2.83



#FDFEFF

AA - 1



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(42.6% 0.002 -0.132), oklab(95.4% -0.022 0.074), oklab(75.8% -0.063 -0.08), oklab(70.1% 0.134 0.023), oklab(99.7% -0.001 -0.002))

Fallback colors



background: linear-gradient(45deg, #354696, #F5F4B8, #67BCE6, #E5788C, #FDFEFF)

Colors



<!-- Primary Colors -->
<color name="ninja_color_10">#354696</color>
<color name="ninja_color_20">#F5F4B8</color>
<color name="ninja_color_30">#67BCE6</color>
<color name="ninja_color_40">#E5788C</color>
<color name="ninja_color_50">#FDFEFF</color>

PWA prompt