Sushi

#90131E

#F44336

#F49649

#F7DDB2

#30393C

Actions

Explore the palette in different formats, and actions.

Colors overview

Red

Orange

Grey

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#90131e	rgb(144, 19, 30)	hsl(350 77% 32%)	oklab(42% 0.14 0.06)	oklch(42% 0.16 24)	color(display-p3 0.52 0.13 0.14)
	#f44336	rgb(244, 67, 54)	hsl(4.1 90% 58%)	oklab(64% 0.19 0.1)	oklch(64% 0.22 29)	color(display-p3 0.88 0.32 0.26)
	#f49649	rgb(244, 150, 73)	hsl(27 89% 62%)	oklab(76% 0.08 0.12)	oklch(76% 0.15 57)	color(display-p3 0.91 0.61 0.35)
	#f7ddb2	rgb(247, 221, 178)	hsl(37 81% 83%)	oklab(91% 0.01 0.06)	oklch(91% 0.06 80)	color(display-p3 0.95 0.87 0.72)
	#30393c	rgb(48, 57, 60)	hsl(200 11% 21%)	oklab(34% -0.01 -0.01)	oklch(34% 0.01 220)	color(display-p3 0.2 0.22 0.23)

 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.

#90131E

AAA - 9.13



#F44336

AA - 3.68



#F49649

AA - 2.25



#F7DDB2

AA - 1.31



#30393C

AAA - 11.82



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.1% 0.144 0.064), oklab(64.3% 0.189 0.104), oklab(75.7% 0.079 0.122), oklab(90.8% 0.011 0.062), oklab(33.7% -0.01 -0.008))

Fallback colors



background: linear-gradient(45deg, #90131E, #F44336, #F49649, #F7DDB2, #30393C)

Colors



<!-- Primary Colors -->
<color name="sushi_color_10">#90131E</color>
<color name="sushi_color_20">#F44336</color>
<color name="sushi_color_30">#F49649</color>
<color name="sushi_color_40">#F7DDB2</color>
<color name="sushi_color_50">#30393C</color>

PWA prompt