tailwind / red

500

#EF4444

bg-red-500

Color Codes

HEX#EF4444

RGBrgb(239, 68, 68)

HSLhsl(0, 84%, 60%)

OKLCHoklch(63.7% 0.2078 25.3)

R239

G68

B68

Hue0°

Saturation84%

Lightness60%

OKL63.7%

Chroma0.2078

Tailwind Classes

Backgroundbg-red-500

Texttext-red-500

Borderborder-red-500

Ringring-red-500

Outlineoutline-red-500

Shadowshadow-red-500

Caretcaret-red-500

Accentaccent-red-500

Fillfill-red-500

Strokestroke-red-500

From (gradient)from-red-500

To (gradient)to-red-500

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 Red

Complementary ColorsColors opposite on the hue wheel

Full Red Palette

50#fef2f2 100#fee2e2 200#fecaca 300#fca5a5 400#f87171 500#ef4444 600#dc2626 700#b91c1c 800#991b1b 900#7f1d1d 950#450a0a