tailwind / rose

800

#9F1239

bg-rose-800

Color Codes

HEX#9F1239
RGBrgb(159, 18, 57)
HSLhsl(343, 80%, 35%)
OKLCHoklch(45.5% 0.1713 13.7)
R159
G18
B57
Hue343°
Saturation80%
Lightness35%
OKL45.5%
Chroma0.1713

Tailwind Classes

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

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-700#be123c
rose-900#881337
rose-950#4c0519
rose-600#e11d48
rose-500#f43f5e
rose-400#fb7185

Complementary ColorsColors opposite on the hue wheel

emerald-700#047857
emerald-600#059669
emerald-500#10b981
emerald-400#34d399
emerald-300#6ee7b7
teal-300#5eead4
teal-400#2dd4bf
teal-500#14b8a6

Full Rose Palette

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