-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtailwind.config.ts
96 lines (92 loc) · 3.06 KB
/
tailwind.config.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
import type { Config } from "tailwindcss";
export default {
content: [
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
],
theme: {
extend: {
colors: {
background: "var(--background)",
foreground: "var(--foreground)",
// Primary Colors (Cyan)
primary: {
900: "hsl(184, 91%, 14%)", // #044E54
800: "hsl(185, 84%, 25%)", // #0A6C74
700: "hsl(185, 81%, 29%)", // #0E7C86
600: "hsl(184, 77%, 34%)", // #14919B
500: "hsl(185, 62%, 45%)", // #2CB1BC
400: "hsl(185, 57%, 50%)", // #38BEC9
300: "hsl(184, 65%, 59%)", // #54D1DB
200: "hsl(184, 80%, 74%)", // #87EAF2
100: "hsl(185, 94%, 87%)", // #BEF8FD
50: "hsl(186, 100%, 94%)", // #E0FCFF
},
// Neutral Colors (Blue Grey)
neutral: {
900: "hsl(42, 15%, 13%)", // #27241D
800: "hsl(40, 13%, 23%)", // #423D33
700: "hsl(37, 11%, 28%)", // #504A40
600: "hsl(41, 9%, 35%)", // #625D52
500: "hsl(41, 8%, 48%)", // #857F72
400: "hsl(41, 8%, 61%)", // #A39E93
300: "hsl(39, 11%, 69%)", // #B8B2A7
200: "hsl(40, 15%, 80%)", // #D3CEC4
100: "hsl(43, 13%, 90%)", // #E8E6E1
50: "hsl(40, 23%, 97%)", // #FAF9F7
},
// Supporting Colors
blue: {
900: "hsl(205, 100%, 21%)", // #003E6B
800: "hsl(205, 87%, 29%)", // #0A558C
700: "hsl(205, 82%, 33%)", // #0F609B
600: "hsl(205, 76%, 39%)", // #186FAF
500: "hsl(205, 67%, 45%)", // #2680C2
400: "hsl(205, 65%, 55%)", // #4098D7
300: "hsl(205, 74%, 65%)", // #62B0E8
200: "hsl(205, 84%, 74%)", // #84C5F4
100: "hsl(205, 97%, 85%)", // #B6E0FE
50: "hsl(205, 79%, 92%)", // #DCEEFB
},
red: {
900: "hsl(360, 92%, 20%)", // #610404
800: "hsl(360, 85%, 25%)", // #780A0A
700: "hsl(360, 79%, 32%)", // #911111
600: "hsl(360, 72%, 38%)", // #A61B1B
500: "hsl(360, 67%, 44%)", // #BA2525
400: "hsl(360, 64%, 55%)", // #D64545
300: "hsl(360, 71%, 66%)", // #E66A6A
200: "hsl(360, 77%, 78%)", // #F29B9B
100: "hsl(360, 82%, 89%)", // #FACDCD
50: "hsl(360, 100%, 97%)", // #FFEEEE
},
yellow: {
900: "hsl(43, 86%, 17%)", // #513C06
800: "hsl(43, 77%, 27%)", // #7C5E10
700: "hsl(43, 72%, 37%)", // #A27C1A
600: "hsl(42, 63%, 48%)", // #C99A2E
500: "hsl(42, 78%, 60%)", // #E9B949
400: "hsl(43, 89%, 70%)", // #F7D070
300: "hsl(43, 90%, 76%)", // #F9DA8B
200: "hsl(45, 86%, 81%)", // #F8E3A3
100: "hsl(45, 90%, 88%)", // #FCEFC7
50: "hsl(45, 100%, 96%)", // #FFFAEB
},
teal: {
900: "hsl(170, 97%, 15%)", // #014D40
800: "hsl(168, 80%, 23%)", // #0C6B58
700: "hsl(166, 72%, 28%)", // #147D64
600: "hsl(164, 71%, 34%)", // #199473
500: "hsl(162, 63%, 41%)", // #27AB83
400: "hsl(160, 51%, 49%)", // #3EBD93
300: "hsl(158, 58%, 62%)", // #65D6AD
200: "hsl(156, 73%, 74%)", // #8EEDC7
100: "hsl(154, 75%, 87%)", // #C6F7E2
50: "hsl(152, 68%, 96%)", // #EFFCF6
},
},
},
},
plugins: [],
} satisfies Config;