tailwind / amber

700

#B45309

bg-amber-700

Color Codes

HEX#B45309
RGBrgb(180, 83, 9)
HSLhsl(26, 90%, 37%)
OKLCHoklch(55.5% 0.1455 49)
R180
G83
B9
Hue26°
Saturation90%
Lightness37%
OKL55.5%
Chroma0.1455

Tailwind Classes

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

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-600#d97706
amber-800#92400e
amber-500#f59e0b
amber-900#78350f
amber-950#451a03
amber-400#fbbf24

Complementary ColorsColors opposite on the hue wheel

sky-700#0369a1
sky-600#0284c7
blue-300#93c5fd
slate-300#cbd5e1
sky-300#7dd3fc
sky-500#0ea5e9
blue-400#60a5fa
sky-400#38bdf8

Full Amber Palette

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