Colors
You can either use colors directly, using a CSS Custom Property, or with generated CSS utility classes.| Name | Hex code | Custom Property | Color Utility Class | BG Utility Class |
|---|---|---|---|---|
|
Dark
|
oklch(14.69% 0.0041 49.25)
|
var(--color-dark)
|
.text-dark
|
.bg-dark
|
|
Dark Glare
|
#1C1917
|
var(--color-dark-glare)
|
.text-dark-glare
|
.bg-dark-glare
|
|
Mid
|
#A8A29E
|
var(--color-mid)
|
.text-mid
|
.bg-mid
|
|
Light
|
#FAFAF9
|
var(--color-light)
|
.text-light
|
.bg-light
|
|
Primary
|
#D97706
|
var(--color-primary)
|
.text-primary
|
.bg-primary
|
|
white
|
oklch(100% 0 0)
|
var(--color-white)
|
.text-white
|
.bg-white
|
|
black
|
oklch(0% 0 0)
|
var(--color-black)
|
.text-black
|
.bg-black
|
|
slate-50
|
oklch(98.42% 0.0034 247.86)
|
var(--color-slate-50)
|
.text-slate-50
|
.bg-slate-50
|
|
slate-100
|
oklch(96.83% 0.0069 247.9)
|
var(--color-slate-100)
|
.text-slate-100
|
.bg-slate-100
|
|
slate-200
|
oklch(92.88% 0.0126 255.51)
|
var(--color-slate-200)
|
.text-slate-200
|
.bg-slate-200
|
|
slate-300
|
oklch(86.9% 0.0198 252.89)
|
var(--color-slate-300)
|
.text-slate-300
|
.bg-slate-300
|
|
slate-400
|
oklch(71.07% 0.0351 256.79)
|
var(--color-slate-400)
|
.text-slate-400
|
.bg-slate-400
|
|
slate-500
|
oklch(55.44% 0.0407 257.42)
|
var(--color-slate-500)
|
.text-slate-500
|
.bg-slate-500
|
|
slate-600
|
oklch(44.55% 0.0374 257.28)
|
var(--color-slate-600)
|
.text-slate-600
|
.bg-slate-600
|
|
slate-700
|
oklch(37.17% 0.0392 257.29)
|
var(--color-slate-700)
|
.text-slate-700
|
.bg-slate-700
|
|
slate-800
|
oklch(27.95% 0.0368 260.03)
|
var(--color-slate-800)
|
.text-slate-800
|
.bg-slate-800
|
|
slate-900
|
oklch(20.77% 0.0398 265.75)
|
var(--color-slate-900)
|
.text-slate-900
|
.bg-slate-900
|
|
slate-950
|
oklch(12.88% 0.0406 264.7)
|
var(--color-slate-950)
|
.text-slate-950
|
.bg-slate-950
|
|
gray-50
|
oklch(98.46% 0.0017 247.84)
|
var(--color-gray-50)
|
.text-gray-50
|
.bg-gray-50
|
|
gray-100
|
oklch(96.7% 0.0029 264.54)
|
var(--color-gray-100)
|
.text-gray-100
|
.bg-gray-100
|
|
gray-200
|
oklch(92.76% 0.0058 264.53)
|
var(--color-gray-200)
|
.text-gray-200
|
.bg-gray-200
|
|
gray-300
|
oklch(87.17% 0.0093 258.34)
|
var(--color-gray-300)
|
.text-gray-300
|
.bg-gray-300
|
|
gray-400
|
oklch(71.37% 0.0192 261.32)
|
var(--color-gray-400)
|
.text-gray-400
|
.bg-gray-400
|
|
gray-500
|
oklch(55.1% 0.0234 264.36)
|
var(--color-gray-500)
|
.text-gray-500
|
.bg-gray-500
|
|
gray-600
|
oklch(55.1% 0.0234 264.36)
|
var(--color-gray-600)
|
.text-gray-600
|
.bg-gray-600
|
|
gray-700
|
oklch(37.29% 0.0306 259.73)
|
var(--color-gray-700)
|
.text-gray-700
|
.bg-gray-700
|
|
gray-800
|
oklch(27.81% 0.0296 256.85)
|
var(--color-gray-800)
|
.text-gray-800
|
.bg-gray-800
|
|
gray-900
|
oklch(21.01% 0.0318 264.66)
|
var(--color-gray-900)
|
.text-gray-900
|
.bg-gray-900
|
|
gray-950
|
oklch(12.96% 0.0274 261.69)
|
var(--color-gray-950)
|
.text-gray-950
|
.bg-gray-950
|
|
zinc-50
|
oklch(98.51% 0 0)
|
var(--color-zinc-50)
|
.text-zinc-50
|
.bg-zinc-50
|
|
zinc-100
|
oklch(96.74% 0.0013 286.38)
|
var(--color-zinc-100)
|
.text-zinc-100
|
.bg-zinc-100
|
|
zinc-200
|
oklch(91.97% 0.004 286.32)
|
var(--color-zinc-200)
|
.text-zinc-200
|
.bg-zinc-200
|
|
zinc-300
|
oklch(87.11% 0.0055 286.29)
|
var(--color-zinc-300)
|
.text-zinc-300
|
.bg-zinc-300
|
|
zinc-400
|
oklch(71.18% 0.0129 286.07)
|
var(--color-zinc-400)
|
.text-zinc-400
|
.bg-zinc-400
|
|
zinc-500
|
oklch(55.17% 0.0138 285.94)
|
var(--color-zinc-500)
|
.text-zinc-500
|
.bg-zinc-500
|
|
zinc-600
|
oklch(44.19% 0.0146 285.79)
|
var(--color-zinc-600)
|
.text-zinc-600
|
.bg-zinc-600
|
|
zinc-700
|
oklch(37.03% 0.0119 285.81)
|
var(--color-zinc-700)
|
.text-zinc-700
|
.bg-zinc-700
|
|
zinc-800
|
oklch(27.39% 0.0055 286.03)
|
var(--color-zinc-800)
|
.text-zinc-800
|
.bg-zinc-800
|
|
zinc-900
|
oklch(21.03% 0.0059 285.89)
|
var(--color-zinc-900)
|
.text-zinc-900
|
.bg-zinc-900
|
|
zinc-950
|
oklch(14.08% 0.0044 285.82)
|
var(--color-zinc-950)
|
.text-zinc-950
|
.bg-zinc-950
|
|
neutral-50
|
oklch(98.51% 0 0)
|
var(--color-neutral-50)
|
.text-neutral-50
|
.bg-neutral-50
|
|
neutral-100
|
oklch(97.02% 0 0)
|
var(--color-neutral-100)
|
.text-neutral-100
|
.bg-neutral-100
|
|
neutral-200
|
oklch(92.19% 0 0)
|
var(--color-neutral-200)
|
.text-neutral-200
|
.bg-neutral-200
|
|
neutral-300
|
oklch(86.99% 0 0)
|
var(--color-neutral-300)
|
.text-neutral-300
|
.bg-neutral-300
|
|
neutral-400
|
oklch(71.55% 0 0)
|
var(--color-neutral-400)
|
.text-neutral-400
|
.bg-neutral-400
|
|
neutral-500
|
oklch(55.55% 0 0)
|
var(--color-neutral-500)
|
.text-neutral-500
|
.bg-neutral-500
|
|
neutral-600
|
oklch(43.86% 0 0)
|
var(--color-neutral-600)
|
.text-neutral-600
|
.bg-neutral-600
|
|
neutral-700
|
oklch(37.15% 0 0)
|
var(--color-neutral-700)
|
.text-neutral-700
|
.bg-neutral-700
|
|
neutral-800
|
oklch(26.86% 0 0)
|
var(--color-neutral-800)
|
.text-neutral-800
|
.bg-neutral-800
|
|
neutral-900
|
oklch(20.46% 0 0)
|
var(--color-neutral-900)
|
.text-neutral-900
|
.bg-neutral-900
|
|
neutral-950
|
oklch(14.48% 0 0)
|
var(--color-neutral-950)
|
.text-neutral-950
|
.bg-neutral-950
|
|
stone-50
|
oklch(98.48% 0.0013 106.42)
|
var(--color-stone-50)
|
.text-stone-50
|
.bg-stone-50
|
|
stone-100
|
oklch(96.99% 0.0013 106.42)
|
var(--color-stone-100)
|
.text-stone-100
|
.bg-stone-100
|
|
stone-200
|
oklch(92.32% 0.0026 48.72)
|
var(--color-stone-200)
|
.text-stone-200
|
.bg-stone-200
|
|
stone-300
|
oklch(86.87% 0.0043 56.37)
|
var(--color-stone-300)
|
.text-stone-300
|
.bg-stone-300
|
|
stone-400
|
oklch(71.61% 0.0091 56.26)
|
var(--color-stone-400)
|
.text-stone-400
|
.bg-stone-400
|
|
stone-500
|
oklch(55.34% 0.0116 58.07)
|
var(--color-stone-500)
|
.text-stone-500
|
.bg-stone-500
|
|
stone-600
|
oklch(44.44% 0.0096 73.64)
|
var(--color-stone-600)
|
.text-stone-600
|
.bg-stone-600
|
|
stone-700
|
oklch(37.41% 0.0087 67.56)
|
var(--color-stone-700)
|
.text-stone-700
|
.bg-stone-700
|
|
stone-800
|
oklch(26.85% 0.0063 34.3)
|
var(--color-stone-800)
|
.text-stone-800
|
.bg-stone-800
|
|
stone-900
|
oklch(21.61% 0.0061 56.04)
|
var(--color-stone-900)
|
.text-stone-900
|
.bg-stone-900
|
|
stone-950
|
oklch(14.69% 0.0041 49.25)
|
var(--color-stone-950)
|
.text-stone-950
|
.bg-stone-950
|
|
red-50
|
oklch(97.05% 0.0129 17.38)
|
var(--color-red-50)
|
.text-red-50
|
.bg-red-50
|
|
red-100
|
oklch(93.56% 0.0309 17.72)
|
var(--color-red-100)
|
.text-red-100
|
.bg-red-100
|
|
red-200
|
oklch(88.45% 0.0593 18.33)
|
var(--color-red-200)
|
.text-red-200
|
.bg-red-200
|
|
red-300
|
oklch(80.77% 0.1035 19.57)
|
var(--color-red-300)
|
.text-red-300
|
.bg-red-300
|
|
red-400
|
oklch(71.06% 0.1661 22.22)
|
var(--color-red-400)
|
.text-red-400
|
.bg-red-400
|
|
red-500
|
oklch(63.68% 0.2078 25.33)
|
var(--color-red-500)
|
.text-red-500
|
.bg-red-500
|
|
red-600
|
oklch(57.71% 0.2152 27.33)
|
var(--color-red-600)
|
.text-red-600
|
.bg-red-600
|
|
red-700
|
oklch(50.54% 0.1905 27.52)
|
var(--color-red-700)
|
.text-red-700
|
.bg-red-700
|
|
red-800
|
oklch(44.37% 0.1613 26.9)
|
var(--color-red-800)
|
.text-red-800
|
.bg-red-800
|
|
red-900
|
oklch(39.58% 0.1331 25.72)
|
var(--color-red-900)
|
.text-red-900
|
.bg-red-900
|
|
red-950
|
oklch(25.75% 0.0886 26.04)
|
var(--color-red-950)
|
.text-red-950
|
.bg-red-950
|
|
orange-50
|
oklch(97.96% 0.015771618519989913 73.68407794443895)
|
var(--color-orange-50)
|
.text-orange-50
|
.bg-orange-50
|
|
orange-100
|
oklch(95.42% 0.03715446392304164 75.16435946755645)
|
var(--color-orange-100)
|
.text-orange-100
|
.bg-orange-100
|
|
orange-200
|
oklch(90.15% 0.0729 70.7)
|
var(--color-orange-200)
|
.text-orange-200
|
.bg-orange-200
|
|
orange-300
|
oklch(83.66% 0.1165 66.29)
|
var(--color-orange-300)
|
.text-orange-300
|
.bg-orange-300
|
|
orange-400
|
oklch(75.76% 0.159 55.93)
|
var(--color-orange-400)
|
.text-orange-400
|
.bg-orange-400
|
|
orange-500
|
oklch(70.49% 0.1867 47.6)
|
var(--color-orange-500)
|
.text-orange-500
|
.bg-orange-500
|
|
orange-600
|
oklch(64.61% 0.1943 41.12)
|
var(--color-orange-600)
|
.text-orange-600
|
.bg-orange-600
|
|
orange-700
|
oklch(55.34% 0.1739 38.4)
|
var(--color-orange-700)
|
.text-orange-700
|
.bg-orange-700
|
|
orange-800
|
oklch(46.98% 0.143 37.3)
|
var(--color-orange-800)
|
.text-orange-800
|
.bg-orange-800
|
|
orange-900
|
oklch(40.84% 0.1165 38.17)
|
var(--color-orange-900)
|
.text-orange-900
|
.bg-orange-900
|
|
orange-950
|
oklch(26.59% 0.0762 36.26)
|
var(--color-orange-950)
|
.text-orange-950
|
.bg-orange-950
|
|
amber-50
|
oklch(98.69% 0.021403008259500936 95.27742336745216)
|
var(--color-amber-50)
|
.text-amber-50
|
.bg-amber-50
|
|
amber-100
|
oklch(96.19% 0.058 95.62)
|
var(--color-amber-100)
|
.text-amber-100
|
.bg-amber-100
|
|
amber-200
|
oklch(92.43% 0.1151 95.75)
|
var(--color-amber-200)
|
.text-amber-200
|
.bg-amber-200
|
|
amber-300
|
oklch(87.9% 0.1534 91.61)
|
var(--color-amber-300)
|
.text-amber-300
|
.bg-amber-300
|
|
amber-400
|
oklch(83.69% 0.1644 84.43)
|
var(--color-amber-400)
|
.text-amber-400
|
.bg-amber-400
|
|
amber-500
|
oklch(76.86% 0.1647 70.08)
|
var(--color-amber-500)
|
.text-amber-500
|
.bg-amber-500
|
|
amber-600
|
oklch(66.58% 0.1574 58.32)
|
var(--color-amber-600)
|
.text-amber-600
|
.bg-amber-600
|
|
amber-700
|
oklch(55.53% 0.1455 49)
|
var(--color-amber-700)
|
.text-amber-700
|
.bg-amber-700
|
|
amber-800
|
oklch(47.32% 0.1247 46.2)
|
var(--color-amber-800)
|
.text-amber-800
|
.bg-amber-800
|
|
amber-900
|
oklch(41.37% 0.1054 45.9)
|
var(--color-amber-900)
|
.text-amber-900
|
.bg-amber-900
|
|
amber-950
|
oklch(27.91% 0.0742 45.64)
|
var(--color-amber-950)
|
.text-amber-950
|
.bg-amber-950
|
|
yellow-50
|
oklch(98.73% 0.0262 102.21)
|
var(--color-yellow-50)
|
.text-yellow-50
|
.bg-yellow-50
|
|
yellow-100
|
oklch(97.29% 0.0693 103.19)
|
var(--color-yellow-100)
|
.text-yellow-100
|
.bg-yellow-100
|
|
yellow-200
|
oklch(94.51% 0.1243 101.54)
|
var(--color-yellow-200)
|
.text-yellow-200
|
.bg-yellow-200
|
|
yellow-300
|
oklch(90.52% 0.1657 98.11)
|
var(--color-yellow-300)
|
.text-yellow-300
|
.bg-yellow-300
|
|
yellow-400
|
oklch(86.06% 0.1731 91.94)
|
var(--color-yellow-400)
|
.text-yellow-400
|
.bg-yellow-400
|
|
yellow-500
|
oklch(79.52% 0.1617 86.05)
|
var(--color-yellow-500)
|
.text-yellow-500
|
.bg-yellow-500
|
|
yellow-600
|
oklch(68.06% 0.1423 75.83)
|
var(--color-yellow-600)
|
.text-yellow-600
|
.bg-yellow-600
|
|
yellow-700
|
oklch(55.38% 0.1207 66.44)
|
var(--color-yellow-700)
|
.text-yellow-700
|
.bg-yellow-700
|
|
yellow-800
|
oklch(47.62% 0.1034 61.91)
|
var(--color-yellow-800)
|
.text-yellow-800
|
.bg-yellow-800
|
|
yellow-900
|
oklch(42.1% 0.0897 57.71)
|
var(--color-yellow-900)
|
.text-yellow-900
|
.bg-yellow-900
|
|
yellow-950
|
oklch(28.57% 0.0639 53.81)
|
var(--color-yellow-950)
|
.text-yellow-950
|
.bg-yellow-950
|
|
lime-50
|
oklch(98.57% 0.031 120.76)
|
var(--color-lime-50)
|
.text-lime-50
|
.bg-lime-50
|
|
lime-100
|
oklch(96.69% 0.0659 122.33)
|
var(--color-lime-100)
|
.text-lime-100
|
.bg-lime-100
|
|
lime-200
|
oklch(93.82% 0.1217 124.32)
|
var(--color-lime-200)
|
.text-lime-200
|
.bg-lime-200
|
|
lime-300
|
oklch(89.72% 0.1786 126.67)
|
var(--color-lime-300)
|
.text-lime-300
|
.bg-lime-300
|
|
lime-400
|
oklch(84.93% 0.2073 128.85)
|
var(--color-lime-400)
|
.text-lime-400
|
.bg-lime-400
|
|
lime-500
|
oklch(76.81% 0.2044 130.85)
|
var(--color-lime-500)
|
.text-lime-500
|
.bg-lime-500
|
|
lime-600
|
oklch(64.82% 0.1754 131.68)
|
var(--color-lime-600)
|
.text-lime-600
|
.bg-lime-600
|
|
lime-700
|
oklch(53.22% 0.1405 131.59)
|
var(--color-lime-700)
|
.text-lime-700
|
.bg-lime-700
|
|
lime-800
|
oklch(45.28% 0.1129 130.93)
|
var(--color-lime-800)
|
.text-lime-800
|
.bg-lime-800
|
|
lime-900
|
oklch(40.5% 0.0956 131.06)
|
var(--color-lime-900)
|
.text-lime-900
|
.bg-lime-900
|
|
lime-950
|
oklch(27.41% 0.0688 132.11)
|
var(--color-lime-950)
|
.text-lime-950
|
.bg-lime-950
|
|
green-50
|
oklch(98.19% 0.0181 155.83)
|
var(--color-green-50)
|
.text-green-50
|
.bg-green-50
|
|
green-100
|
oklch(96.24% 0.0434 156.74)
|
var(--color-green-100)
|
.text-green-100
|
.bg-green-100
|
|
green-200
|
oklch(92.5% 0.0806 155.99)
|
var(--color-green-200)
|
.text-green-200
|
.bg-green-200
|
|
green-300
|
oklch(87.12% 0.1363 154.45)
|
var(--color-green-300)
|
.text-green-300
|
.bg-green-300
|
|
green-400
|
oklch(80.03% 0.1821 151.71)
|
var(--color-green-400)
|
.text-green-400
|
.bg-green-400
|
|
green-500
|
oklch(72.27% 0.192 149.58)
|
var(--color-green-500)
|
.text-green-500
|
.bg-green-500
|
|
green-600
|
oklch(62.71% 0.1699 149.21)
|
var(--color-green-600)
|
.text-green-600
|
.bg-green-600
|
|
green-700
|
oklch(52.73% 0.1371 150.07)
|
var(--color-green-700)
|
.text-green-700
|
.bg-green-700
|
|
green-800
|
oklch(44.79% 0.1083 151.33)
|
var(--color-green-800)
|
.text-green-800
|
.bg-green-800
|
|
green-900
|
oklch(39.25% 0.0896 152.54)
|
var(--color-green-900)
|
.text-green-900
|
.bg-green-900
|
|
green-950
|
oklch(26.64% 0.0628 152.93)
|
var(--color-green-950)
|
.text-green-950
|
.bg-green-950
|
|
emerald-50
|
oklch(97.93% 0.0207 166.11)
|
var(--color-emerald-50)
|
.text-emerald-50
|
.bg-emerald-50
|
|
emerald-100
|
oklch(95.05% 0.0507 163.05)
|
var(--color-emerald-100)
|
.text-emerald-100
|
.bg-emerald-100
|
|
emerald-200
|
oklch(90.49% 0.0895 164.15)
|
var(--color-emerald-200)
|
.text-emerald-200
|
.bg-emerald-200
|
|
emerald-300
|
oklch(84.52% 0.1299 164.98)
|
var(--color-emerald-300)
|
.text-emerald-300
|
.bg-emerald-300
|
|
emerald-400
|
oklch(77.29% 0.1535 163.22)
|
var(--color-emerald-400)
|
.text-emerald-400
|
.bg-emerald-400
|
|
emerald-500
|
oklch(69.59% 0.1491 162.48)
|
var(--color-emerald-500)
|
.text-emerald-500
|
.bg-emerald-500
|
|
emerald-600
|
oklch(59.6% 0.1274 163.23)
|
var(--color-emerald-600)
|
.text-emerald-600
|
.bg-emerald-600
|
|
emerald-700
|
oklch(50.81% 0.1049 165.61)
|
var(--color-emerald-700)
|
.text-emerald-700
|
.bg-emerald-700
|
|
emerald-800
|
oklch(43.18% 0.0865 166.91)
|
var(--color-emerald-800)
|
.text-emerald-800
|
.bg-emerald-800
|
|
emerald-900
|
oklch(37.8% 0.073 168.94)
|
var(--color-emerald-900)
|
.text-emerald-900
|
.bg-emerald-900
|
|
emerald-950
|
oklch(26.21% 0.0487 172.55)
|
var(--color-emerald-950)
|
.text-emerald-950
|
.bg-emerald-950
|
|
teal-50
|
oklch(98.36% 0.0142 180.72)
|
var(--color-teal-50)
|
.text-teal-50
|
.bg-teal-50
|
|
teal-100
|
oklch(95.27% 0.0498 180.8)
|
var(--color-teal-100)
|
.text-teal-100
|
.bg-teal-100
|
|
teal-200
|
oklch(91% 0.0927 180.43)
|
var(--color-teal-200)
|
.text-teal-200
|
.bg-teal-200
|
|
teal-300
|
oklch(85.49% 0.1251 181.07)
|
var(--color-teal-300)
|
.text-teal-300
|
.bg-teal-300
|
|
teal-400
|
oklch(78.45% 0.1325 181.91)
|
var(--color-teal-400)
|
.text-teal-400
|
.bg-teal-400
|
|
teal-500
|
oklch(70.38% 0.123 182.5)
|
var(--color-teal-500)
|
.text-teal-500
|
.bg-teal-500
|
|
teal-600
|
oklch(60.02% 0.1038 184.7)
|
var(--color-teal-600)
|
.text-teal-600
|
.bg-teal-600
|
|
teal-700
|
oklch(51.09% 0.0861 186.39)
|
var(--color-teal-700)
|
.text-teal-700
|
.bg-teal-700
|
|
teal-800
|
oklch(43.7% 0.0705 188.22)
|
var(--color-teal-800)
|
.text-teal-800
|
.bg-teal-800
|
|
teal-900
|
oklch(38.61% 0.059 188.42)
|
var(--color-teal-900)
|
.text-teal-900
|
.bg-teal-900
|
|
teal-950
|
oklch(27.73% 0.0447 192.52)
|
var(--color-teal-950)
|
.text-teal-950
|
.bg-teal-950
|
|
cyan-50
|
oklch(98.41% 0.0189 200.87)
|
var(--color-cyan-50)
|
.text-cyan-50
|
.bg-cyan-50
|
|
cyan-100
|
oklch(95.63% 0.0443 203.39)
|
var(--color-cyan-100)
|
.text-cyan-100
|
.bg-cyan-100
|
|
cyan-200
|
oklch(91.67% 0.0772 205.04)
|
var(--color-cyan-200)
|
.text-cyan-200
|
.bg-cyan-200
|
|
cyan-300
|
oklch(86.51% 0.1153 207.08)
|
var(--color-cyan-300)
|
.text-cyan-300
|
.bg-cyan-300
|
|
cyan-400
|
oklch(79.71% 0.1339 211.53)
|
var(--color-cyan-400)
|
.text-cyan-400
|
.bg-cyan-400
|
|
cyan-500
|
oklch(71.48% 0.1257 215.22)
|
var(--color-cyan-500)
|
.text-cyan-500
|
.bg-cyan-500
|
|
cyan-600
|
oklch(60.89% 0.1109 221.72)
|
var(--color-cyan-600)
|
.text-cyan-600
|
.bg-cyan-600
|
|
cyan-700
|
oklch(51.98% 0.0936 223.13)
|
var(--color-cyan-700)
|
.text-cyan-700
|
.bg-cyan-700
|
|
cyan-800
|
oklch(45% 0.0771 224.28)
|
var(--color-cyan-800)
|
.text-cyan-800
|
.bg-cyan-800
|
|
cyan-900
|
oklch(39.82% 0.0664 227.39)
|
var(--color-cyan-900)
|
.text-cyan-900
|
.bg-cyan-900
|
|
cyan-950
|
oklch(30.18% 0.0541 229.7)
|
var(--color-cyan-950)
|
.text-cyan-950
|
.bg-cyan-950
|
|
sky-50
|
oklch(97.71% 0.012485946526696063 236.61974498403976)
|
var(--color-sky-50)
|
.text-sky-50
|
.bg-sky-50
|
|
sky-100
|
oklch(95.14% 0.025 236.82)
|
var(--color-sky-100)
|
.text-sky-100
|
.bg-sky-100
|
|
sky-200
|
oklch(90.14% 0.0555 230.9)
|
var(--color-sky-200)
|
.text-sky-200
|
.bg-sky-200
|
|
sky-300
|
oklch(82.76% 0.1013 230.32)
|
var(--color-sky-300)
|
.text-sky-300
|
.bg-sky-300
|
|
sky-400
|
oklch(75.35% 0.139 232.66)
|
var(--color-sky-400)
|
.text-sky-400
|
.bg-sky-400
|
|
sky-500
|
oklch(68.47% 0.1479 237.32)
|
var(--color-sky-500)
|
.text-sky-500
|
.bg-sky-500
|
|
sky-600
|
oklch(58.76% 0.1389 241.97)
|
var(--color-sky-600)
|
.text-sky-600
|
.bg-sky-600
|
|
sky-700
|
oklch(50% 0.1193 242.75)
|
var(--color-sky-700)
|
.text-sky-700
|
.bg-sky-700
|
|
sky-800
|
oklch(44.34% 0.1 240.79)
|
var(--color-sky-800)
|
.text-sky-800
|
.bg-sky-800
|
|
sky-900
|
oklch(39.12% 0.0845 240.88)
|
var(--color-sky-900)
|
.text-sky-900
|
.bg-sky-900
|
|
sky-950
|
oklch(29.35% 0.0632 243.16)
|
var(--color-sky-950)
|
.text-sky-950
|
.bg-sky-950
|
|
blue-50
|
oklch(97.05% 0.01418224665972208 254.6041641690868)
|
var(--color-blue-50)
|
.text-blue-50
|
.bg-blue-50
|
|
blue-100
|
oklch(93.19% 0.0316 255.59)
|
var(--color-blue-100)
|
.text-blue-100
|
.bg-blue-100
|
|
blue-200
|
oklch(88.23% 0.0571 254.13)
|
var(--color-blue-200)
|
.text-blue-200
|
.bg-blue-200
|
|
blue-300
|
oklch(80.91% 0.0956 251.81)
|
var(--color-blue-300)
|
.text-blue-300
|
.bg-blue-300
|
|
blue-400
|
oklch(71.37% 0.1434 254.62)
|
var(--color-blue-400)
|
.text-blue-400
|
.bg-blue-400
|
|
blue-500
|
oklch(62.31% 0.188 259.81)
|
var(--color-blue-500)
|
.text-blue-500
|
.bg-blue-500
|
|
blue-600
|
oklch(54.61% 0.2152 262.88)
|
var(--color-blue-600)
|
.text-blue-600
|
.bg-blue-600
|
|
blue-700
|
oklch(48.82% 0.2172 264.38)
|
var(--color-blue-700)
|
.text-blue-700
|
.bg-blue-700
|
|
blue-800
|
oklch(42.44% 0.1809 265.64)
|
var(--color-blue-800)
|
.text-blue-800
|
.bg-blue-800
|
|
blue-900
|
oklch(37.91% 0.1378 265.52)
|
var(--color-blue-900)
|
.text-blue-900
|
.bg-blue-900
|
|
blue-950
|
oklch(28.23% 0.0874 267.94)
|
var(--color-blue-950)
|
.text-blue-950
|
.bg-blue-950
|
|
indigo-50
|
oklch(96.19% 0.0179 272.31)
|
var(--color-indigo-50)
|
.text-indigo-50
|
.bg-indigo-50
|
|
indigo-100
|
oklch(92.99% 0.0334 272.79)
|
var(--color-indigo-100)
|
.text-indigo-100
|
.bg-indigo-100
|
|
indigo-200
|
oklch(86.99% 0.0622 274.04)
|
var(--color-indigo-200)
|
.text-indigo-200
|
.bg-indigo-200
|
|
indigo-300
|
oklch(78.53% 0.1041 274.71)
|
var(--color-indigo-300)
|
.text-indigo-300
|
.bg-indigo-300
|
|
indigo-400
|
oklch(68.01% 0.1583 276.93)
|
var(--color-indigo-400)
|
.text-indigo-400
|
.bg-indigo-400
|
|
indigo-500
|
oklch(58.54% 0.2041 277.12)
|
var(--color-indigo-500)
|
.text-indigo-500
|
.bg-indigo-500
|
|
indigo-600
|
oklch(51.06% 0.2301 276.97)
|
var(--color-indigo-600)
|
.text-indigo-600
|
.bg-indigo-600
|
|
indigo-700
|
oklch(45.68% 0.2146 277.02)
|
var(--color-indigo-700)
|
.text-indigo-700
|
.bg-indigo-700
|
|
indigo-800
|
oklch(39.84% 0.1773 277.37)
|
var(--color-indigo-800)
|
.text-indigo-800
|
.bg-indigo-800
|
|
indigo-900
|
oklch(35.88% 0.1354 278.7)
|
var(--color-indigo-900)
|
.text-indigo-900
|
.bg-indigo-900
|
|
indigo-950
|
oklch(25.73% 0.0861 281.29)
|
var(--color-indigo-950)
|
.text-indigo-950
|
.bg-indigo-950
|
|
violet-50
|
oklch(96.19% 0.0179 272.31)
|
var(--color-violet-50)
|
.text-violet-50
|
.bg-violet-50
|
|
violet-100
|
oklch(94.33% 0.0284 294.59)
|
var(--color-violet-100)
|
.text-violet-100
|
.bg-violet-100
|
|
violet-200
|
oklch(89.43% 0.0549 293.28)
|
var(--color-violet-200)
|
.text-violet-200
|
.bg-violet-200
|
|
violet-300
|
oklch(81.12% 0.1013 293.57)
|
var(--color-violet-300)
|
.text-violet-300
|
.bg-violet-300
|
|
violet-400
|
oklch(70.9% 0.1592 293.54)
|
var(--color-violet-400)
|
.text-violet-400
|
.bg-violet-400
|
|
violet-500
|
oklch(60.56% 0.2189 292.72)
|
var(--color-violet-500)
|
.text-violet-500
|
.bg-violet-500
|
|
violet-600
|
oklch(54.13% 0.2466 293.01)
|
var(--color-violet-600)
|
.text-violet-600
|
.bg-violet-600
|
|
violet-700
|
oklch(49.07% 0.2412 292.58)
|
var(--color-violet-700)
|
.text-violet-700
|
.bg-violet-700
|
|
violet-800
|
oklch(43.2% 0.2106 292.76)
|
var(--color-violet-800)
|
.text-violet-800
|
.bg-violet-800
|
|
violet-900
|
oklch(37.96% 0.1783 293.74)
|
var(--color-violet-900)
|
.text-violet-900
|
.bg-violet-900
|
|
violet-950
|
oklch(28.27% 0.1351 291.09)
|
var(--color-violet-950)
|
.text-violet-950
|
.bg-violet-950
|
|
purple-50
|
oklch(97.68% 0.0142 308.3)
|
var(--color-purple-50)
|
.text-purple-50
|
.bg-purple-50
|
|
purple-100
|
oklch(94.64% 0.0327 307.17)
|
var(--color-purple-100)
|
.text-purple-100
|
.bg-purple-100
|
|
purple-200
|
oklch(90.24% 0.06040838720918992 306.7029975247675)
|
var(--color-purple-200)
|
.text-purple-200
|
.bg-purple-200
|
|
purple-300
|
oklch(82.68% 0.1082 306.38)
|
var(--color-purple-300)
|
.text-purple-300
|
.bg-purple-300
|
|
purple-400
|
oklch(72.17% 0.1767 305.5)
|
var(--color-purple-400)
|
.text-purple-400
|
.bg-purple-400
|
|
purple-500
|
oklch(62.68% 0.2325 303.9)
|
var(--color-purple-500)
|
.text-purple-500
|
.bg-purple-500
|
|
purple-600
|
oklch(55.75% 0.2525 302.32)
|
var(--color-purple-600)
|
.text-purple-600
|
.bg-purple-600
|
|
purple-700
|
oklch(49.55% 0.2369 301.92)
|
var(--color-purple-700)
|
.text-purple-700
|
.bg-purple-700
|
|
purple-800
|
oklch(43.83% 0.1983 303.72)
|
var(--color-purple-800)
|
.text-purple-800
|
.bg-purple-800
|
|
purple-900
|
oklch(38.07% 0.1661 304.99)
|
var(--color-purple-900)
|
.text-purple-900
|
.bg-purple-900
|
|
purple-950
|
oklch(29.05% 0.1432 302.72)
|
var(--color-purple-950)
|
.text-purple-950
|
.bg-purple-950
|
|
fuchsia-50
|
oklch(97.73% 0.017319799618005262 320.057924702978)
|
var(--color-fuchsia-50)
|
.text-fuchsia-50
|
.bg-fuchsia-50
|
|
fuchsia-100
|
oklch(95.2% 0.035966474160176905 318.851883433472)
|
var(--color-fuchsia-100)
|
.text-fuchsia-100
|
.bg-fuchsia-100
|
|
fuchsia-200
|
oklch(90.3% 0.0732 319.62)
|
var(--color-fuchsia-200)
|
.text-fuchsia-200
|
.bg-fuchsia-200
|
|
fuchsia-300
|
oklch(83.3% 0.1322 321.43)
|
var(--color-fuchsia-300)
|
.text-fuchsia-300
|
.bg-fuchsia-300
|
|
fuchsia-400
|
oklch(74.77% 0.207 322.16)
|
var(--color-fuchsia-400)
|
.text-fuchsia-400
|
.bg-fuchsia-400
|
|
fuchsia-500
|
oklch(66.68% 0.2591 322.15)
|
var(--color-fuchsia-500)
|
.text-fuchsia-500
|
.bg-fuchsia-500
|
|
fuchsia-600
|
oklch(59.15% 0.2569 322.9)
|
var(--color-fuchsia-600)
|
.text-fuchsia-600
|
.bg-fuchsia-600
|
|
fuchsia-700
|
oklch(51.8% 0.2258 323.95)
|
var(--color-fuchsia-700)
|
.text-fuchsia-700
|
.bg-fuchsia-700
|
|
fuchsia-800
|
oklch(45.19% 0.1922 324.59)
|
var(--color-fuchsia-800)
|
.text-fuchsia-800
|
.bg-fuchsia-800
|
|
fuchsia-900
|
oklch(40.07% 0.1601 325.61)
|
var(--color-fuchsia-900)
|
.text-fuchsia-900
|
.bg-fuchsia-900
|
|
fuchsia-950
|
oklch(29.32% 0.1309 325.66)
|
var(--color-fuchsia-950)
|
.text-fuchsia-950
|
.bg-fuchsia-950
|
|
pink-50
|
oklch(97.14% 0.0141 343.2)
|
var(--color-pink-50)
|
.text-pink-50
|
.bg-pink-50
|
|
pink-100
|
oklch(94.82% 0.0276 342.26)
|
var(--color-pink-100)
|
.text-pink-100
|
.bg-pink-100
|
|
pink-200
|
oklch(89.94% 0.0589 343.23)
|
var(--color-pink-200)
|
.text-pink-200
|
.bg-pink-200
|
|
pink-300
|
oklch(82.28% 0.1095 346.02)
|
var(--color-pink-300)
|
.text-pink-300
|
.bg-pink-300
|
|
pink-400
|
oklch(72.53% 0.1752 349.76)
|
var(--color-pink-400)
|
.text-pink-400
|
.bg-pink-400
|
|
pink-500
|
oklch(65.59% 0.2118 354.31)
|
var(--color-pink-500)
|
.text-pink-500
|
.bg-pink-500
|
|
pink-600
|
oklch(59.16% 0.218 0.58)
|
var(--color-pink-600)
|
.text-pink-600
|
.bg-pink-600
|
|
pink-700
|
oklch(52.46% 0.199 3.96)
|
var(--color-pink-700)
|
.text-pink-700
|
.bg-pink-700
|
|
pink-800
|
oklch(45.87% 0.1697 3.82)
|
var(--color-pink-800)
|
.text-pink-800
|
.bg-pink-800
|
|
pink-900
|
oklch(40.78% 0.1442 2.43)
|
var(--color-pink-900)
|
.text-pink-900
|
.bg-pink-900
|
|
pink-950
|
oklch(28.45% 0.1048 3.91)
|
var(--color-pink-950)
|
.text-pink-950
|
.bg-pink-950
|
|
rose-50
|
oklch(96.94% 0.0151 12.42)
|
var(--color-rose-50)
|
.text-rose-50
|
.bg-rose-50
|
|
rose-100
|
oklch(94.14% 0.0297 12.58)
|
var(--color-rose-100)
|
.text-rose-100
|
.bg-rose-100
|
|
rose-200
|
oklch(89.24% 0.0559 10)
|
var(--color-rose-200)
|
.text-rose-200
|
.bg-rose-200
|
|
rose-300
|
oklch(80.97% 0.1061 11.64)
|
var(--color-rose-300)
|
.text-rose-300
|
.bg-rose-300
|
|
rose-400
|
oklch(71.92% 0.169 13.43)
|
var(--color-rose-400)
|
.text-rose-400
|
.bg-rose-400
|
|
rose-500
|
oklch(64.5% 0.2154 16.44)
|
var(--color-rose-500)
|
.text-rose-500
|
.bg-rose-500
|
|
rose-600
|
oklch(58.58% 0.222 17.58)
|
var(--color-rose-600)
|
.text-rose-600
|
.bg-rose-600
|
|
rose-700
|
oklch(51.43% 0.1978 16.93)
|
var(--color-rose-700)
|
.text-rose-700
|
.bg-rose-700
|
|
rose-800
|
oklch(45.46% 0.1713 13.7)
|
var(--color-rose-800)
|
.text-rose-800
|
.bg-rose-800
|
|
rose-900
|
oklch(41.03% 0.1502 10.27)
|
var(--color-rose-900)
|
.text-rose-900
|
.bg-rose-900
|
|
rose-950
|
oklch(27.08% 0.1009 12.09)
|
var(--color-rose-950)
|
.text-rose-950
|
.bg-rose-950
|