Module: twind/colors

DocumentationGithubModule SizeTypescript

twind/colors exposes all Tailwind v2 colors as named exports.

📚 View Handbook Guide

Variables

amber

• Const amber: object

Type declaration:

NameType
100#fef3c7
200#fde68a
300#fcd34d
400#fbbf24
50#fffbeb
500#f59e0b
600#d97706
700#b45309
800#92400e
900#78350f

Defined in: src/colors/index.ts:209


black

• Const black: #000= '#000'

Defined in: src/colors/index.ts:11


blue

• Const blue: object

Type declaration:

NameType
100#dbeafe
200#bfdbfe
300#93c5fd
400#60a5fa
50#eff6ff
500#3b82f6
600#2563eb
700#1d4ed8
800#1e40af
900#1e3a8a

Defined in: src/colors/index.ts:92


blueGray

• Const blueGray: object

Type declaration:

NameType
100#f1f5f9
200#e2e8f0
300#cbd5e1
400#94a3b8
50#f8fafc
500#64748b
600#475569
700#334155
800#1e293b
900#0f172a

Defined in: src/colors/index.ts:300


coolGray

• Const coolGray: object

Type declaration:

NameType
100#f3f4f6
200#e5e7eb
300#d1d5db
400#9ca3af
50#f9fafb
500#6b7280
600#4b5563
700#374151
800#1f2937
900#111827

Defined in: src/colors/index.ts:287


cyan

• Const cyan: object

Type declaration:

NameType
100#cffafe
200#a5f3fc
300#67e8f9
400#22d3ee
50#ecfeff
500#06b6d4
600#0891b2
700#0e7490
800#155e75
900#164e63

Defined in: src/colors/index.ts:118


emerald

• Const emerald: object

Type declaration:

NameType
100#d1fae5
200#a7f3d0
300#6ee7b7
400#34d399
50#ecfdf5
500#10b981
600#059669
700#047857
800#065f46
900#064e3b

Defined in: src/colors/index.ts:157


fuchsia

• Const fuchsia: object

Type declaration:

NameType
100#fae8ff
200#f5d0fe
300#f0abfc
400#e879f9
50#fdf4ff
500#d946ef
600#c026d3
700#a21caf
800#86198f
900#701a75

Defined in: src/colors/index.ts:40


gray

• Const gray: object

Type declaration:

NameType
100#f4f4f5
200#e4e4e7
300#d4d4d8
400#a1a1aa
50#fafafa
500#71717a
600#52525b
700#3f3f46
800#27272a
900#18181b

Defined in: src/colors/index.ts:274


green

• Const green: object

Type declaration:

NameType
100#dcfce7
200#bbf7d0
300#86efac
400#4ade80
50#f0fdf4
500#22c55e
600#16a34a
700#15803d
800#166534
900#14532d

Defined in: src/colors/index.ts:170


indigo

• Const indigo: object

Type declaration:

NameType
100#e0e7ff
200#c7d2fe
300#a5b4fc
400#818cf8
50#eef2ff
500#6366f1
600#4f46e5
700#4338ca
800#3730a3
900#312e81

Defined in: src/colors/index.ts:79


lightBlue

• Const lightBlue: object

Type declaration:

NameType
100#e0f2fe
200#bae6fd
300#7dd3fc
400#38bdf8
50#f0f9ff
500#0ea5e9
600#0284c7
700#0369a1
800#075985
900#0c4a6e

Defined in: src/colors/index.ts:105


lime

• Const lime: object

Type declaration:

NameType
100#ecfccb
200#d9f99d
300#bef264
400#a3e635
50#f7fee7
500#84cc16
600#65a30d
700#4d7c0f
800#3f6212
900#365314

Defined in: src/colors/index.ts:183


orange

• Const orange: object

Type declaration:

NameType
100#ffedd5
200#fed7aa
300#fdba74
400#fb923c
50#fff7ed
500#f97316
600#ea580c
700#c2410c
800#9a3412
900#7c2d12

Defined in: src/colors/index.ts:222


pink

• Const pink: object

Type declaration:

NameType
100#fce7f3
200#fbcfe8
300#f9a8d4
400#f472b6
50#fdf2f8
500#ec4899
600#db2777
700#be185d
800#9d174d
900#831843

Defined in: src/colors/index.ts:27


purple

• Const purple: object

Type declaration:

NameType
100#f3e8ff
200#e9d5ff
300#d8b4fe
400#c084fc
50#faf5ff
500#a855f7
600#9333ea
700#7e22ce
800#6b21a8
900#581c87

Defined in: src/colors/index.ts:53


red

• Const red: object

Type declaration:

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

Defined in: src/colors/index.ts:235


rose

• Const rose: object

Type declaration:

NameType
100#ffe4e6
200#fecdd3
300#fda4af
400#fb7185
50#fff1f2
500#f43f5e
600#e11d48
700#be123c
800#9f1239
900#881337

Defined in: src/colors/index.ts:14


sky

• Const sky: object

Type declaration:

NameType
100#e0f2fe
200#bae6fd
300#7dd3fc
400#38bdf8
50#f0f9ff
500#0ea5e9
600#0284c7
700#0369a1
800#075985
900#0c4a6e

Defined in: src/colors/index.ts:131


teal

• Const teal: object

Type declaration:

NameType
100#ccfbf1
200#99f6e4
300#5eead4
400#2dd4bf
50#f0fdfa
500#14b8a6
600#0d9488
700#0f766e
800#115e59
900#134e4a

Defined in: src/colors/index.ts:144


trueGray

• Const trueGray: object

Type declaration:

NameType
100#f5f5f5
200#e5e5e5
300#d4d4d4
400#a3a3a3
50#fafafa
500#737373
600#525252
700#404040
800#262626
900#171717

Defined in: src/colors/index.ts:261


violet

• Const violet: object

Type declaration:

NameType
100#ede9fe
200#ddd6fe
300#c4b5fd
400#a78bfa
50#f5f3ff
500#8b5cf6
600#7c3aed
700#6d28d9
800#5b21b6
900#4c1d95

Defined in: src/colors/index.ts:66


warmGray

• Const warmGray: object

Type declaration:

NameType
100#f5f5f4
200#e7e5e4
300#d6d3d1
400#a8a29e
50#fafaf9
500#78716c
600#57534e
700#44403c
800#292524
900#1c1917

Defined in: src/colors/index.ts:248


white

• Const white: #fff= '#fff'

Defined in: src/colors/index.ts:12


yellow

• Const yellow: object

Type declaration:

NameType
100#fef9c3
200#fef08a
300#fde047
400#facc15
50#fefce8
500#eab308
600#ca8a04
700#a16207
800#854d0e
900#713f12

Defined in: src/colors/index.ts:196