tailwind / amber

100

#FEF3C7

bg-amber-100

Color Codes

HEX#FEF3C7
RGBrgb(254, 243, 199)
HSLhsl(48, 96%, 89%)
OKLCHoklch(96.2% 0.0579 95.6)
R254
G243
B199
Hue48°
Saturation96%
Lightness89%
OKL96.2%
Chroma0.0579

Tailwind Classes

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

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 Amber

amber-50#fffbeb
amber-200#fde68a
amber-300#fcd34d
amber-400#fbbf24
amber-500#f59e0b
amber-600#d97706

Complementary ColorsColors opposite on the hue wheel

indigo-300#a5b4fc
blue-700#1d4ed8
indigo-400#818cf8
blue-600#2563eb
gray-500#6b7280
gray-400#9ca3af
gray-700#374151
blue-500#3b82f6

Full Amber Palette

50#fffbeb100#fef3c7200#fde68a300#fcd34d400#fbbf24500#f59e0b600#d97706700#b45309800#92400e900#78350f950#451a03