UI Shades

A study in red

Tailwind Rose 500

#FF2357

Family
Red
L
0.645
C
0.244
H
16°

Notes

Tailwind Rose 500 anchors the framework's rose ramp at the saturated red-pink centre. The hex sits slightly warmer than Pink 500 and slightly cooler than Red 500, with high chroma at mid-high lightness. It pulls duty as a primary brand colour for cosmetic, fashion, or hospitality products. Against white the body text contrast is borderline at small sizes; headlines and dark text overlays on button surfaces are the safest territory. Body text contrast against white passes AA only at sizes 18px and above; smaller body text needs the 600 stop or deeper for legibility.

#ff2357
Tailwind Rose 500
Tailwind Rose 500
#ff2357
oklch(0.645 0.244 16.43)
rgb(255 35 87)
hsl(345.8 100% 56.9%)
Share
#fff3f3
#ffeaeb
#ffd5d7
#ffbcbf
#ff8590
#ff2357
#dc003e
#b70031
#880021
#600013
#390006

See your palette on a real UI - coming soon

Preview these shades across buttons, cards, and components in a live interface.

Plate 02

Palette built around Tailwind Rose 500

Cross-reference
Q&A

Frequently asked questions

What is Tailwind Rose 500?

Tailwind Rose 500 anchors the framework's rose ramp at the saturated red-pink centre. The hex sits slightly warmer than Pink 500 and slightly cooler than Red 500, with high chroma at mid-high lightness. Its hex code is #FF2357.

What are the tints and shades of Tailwind Rose 500?

uishades builds an 11-step OKLCH ramp for Tailwind Rose 500 (#FF2357) - its lightest tints through its darkest shades - plus an 11-stop Tailwind scale (50–950), both keyed to the same 50–950 stops. Lightness steps stay evenly spaced and the hue stays stable, so the mid-tones don't go muddy.

What colors pair well with Tailwind Rose 500?

Its complementary color is #00A5A8. Triadic partners are #40A900 and #1489FF; analogous neighbours are #EC5600 and #EC31AB.

What are the OKLCH and RGB values of Tailwind Rose 500?

Tailwind Rose 500 is #FF2357 - OKLCH 0.645 0.244 16°, rgb(255 35 87), in the red family.