Trip

#1e232a

#e70d4f

#ff80a6

#febed1

#fcfcfc

Actions

Explore the palette in different formats, and actions.

Colors overview

Red

Pink

White

Black

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#1e232a	rgb(30, 35, 42)	hsl(220 17% 14%)	oklab(25% 0 -0.01)	oklch(25% 0.02 260)	color(display-p3 0.12 0.14 0.16)
	#e70d4f	rgb(231, 13, 79)	hsl(340 89% 48%)	oklab(59% 0.22 0.06)	oklch(59% 0.23 15)	color(display-p3 0.83 0.19 0.32)
	#ff80a6	rgb(255, 128, 166)	hsl(340 100% 75%)	oklab(75% 0.16 0.01)	oklch(75% 0.16 2.7)	color(display-p3 0.94 0.53 0.65)
	#febed1	rgb(254, 190, 209)	hsl(340 97% 87%)	oklab(86% 0.08 0)	oklch(86% 0.08 360)	color(display-p3 0.96 0.76 0.82)
	#fcfcfc	rgb(252, 252, 252)	hsl(none 0% 99%)	oklab(99% 0 0)	oklch(99% 0 none)	color(display-p3 0.99 0.99 0.99)

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

#1e232a

AAA - 15.8



#e70d4f

AA - 4.59



#ff80a6

AA - 2.36



#febed1

AA - 1.55



#fcfcfc

AA - 1.02



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(25.4% -0.003 -0.015), oklab(59.3% 0.225 0.06), oklab(75.4% 0.158 0.007), oklab(86.5% 0.077 -0.001), oklab(99.1% 0 0))

Fallback colors



background: linear-gradient(45deg, #1e232a, #e70d4f, #ff80a6, #febed1, #fcfcfc)

Colors



<!-- Primary Colors -->
<color name="trip_color_10">#1e232a</color>
<color name="trip_color_20">#e70d4f</color>
<color name="trip_color_30">#ff80a6</color>
<color name="trip_color_40">#febed1</color>
<color name="trip_color_50">#fcfcfc</color>

PWA prompt