tailwind / rose

600

#E11D48

bg-rose-600

Color Codes

HEX#E11D48
RGBrgb(225, 29, 72)
HSLhsl(347, 77%, 50%)
OKLCHoklch(58.6% 0.222 17.6)
R225
G29
B72
Hue347°
Saturation77%
Lightness50%
OKL58.6%
Chroma0.222

Tailwind Classes

Backgroundbg-rose-600
Texttext-rose-600
Borderborder-rose-600
Ringring-rose-600
Outlineoutline-rose-600
Shadowshadow-rose-600
Caretcaret-rose-600
Accentaccent-rose-600
Fillfill-rose-600
Strokestroke-rose-600
From (gradient)from-rose-600
To (gradient)to-rose-600

UI Previews

Solid Button
Outlined Button
Ghost Button
Badge / Tag
New FeatureBeta
Text on White

The quick brown fox

jumps over the lazy dog — 0123456789

Text on Dark

The quick brown fox

jumps over the lazy dog — 0123456789

Card Header
Dashboard Overview

Monthly active users increased by 24% this quarter.

Alert / Banner
●Your changes have been saved successfully.
Progress Bar
68%
Input / Focus Ring
Gradient (to white)
Gradient (to black)

Similar ColorsOther shades of Rose

rose-500#f43f5e
rose-700#be123c
rose-400#fb7185
rose-800#9f1239
rose-300#fda4af
rose-900#881337

Complementary ColorsColors opposite on the hue wheel

emerald-700#047857
teal-300#5eead4
teal-400#2dd4bf
emerald-600#059669
teal-500#14b8a6
emerald-500#10b981
teal-600#0d9488
teal-700#0f766e

Full Rose Palette

50#fff1f2100#ffe4e6200#fecdd3300#fda4af400#fb7185500#f43f5e600#e11d48700#be123c800#9f1239900#881337950#4c0519