ratatui_core/style/palette/tailwind.rs
1//! Represents the Tailwind CSS [default color palette][palette].
2//!
3//! [palette]: https://tailwindcss.com/docs/customizing-colors#default-color-palette
4//!
5//! There are 22 palettes. Each palette has 11 colors, with variants from 50 to 950. Black and White
6//! are also included for completeness and to avoid being affected by any terminal theme that might
7//! be in use.
8//!
9//! <style>
10//! .color { display: flex; align-items: center; }
11//! .color > div { width: 2rem; height: 2rem; }
12//! .color > div.name { width: 150px; !important; }
13//! </style>
14//! <div style="overflow-x: auto">
15//! <div style="display: flex; flex-direction:column; text-align: left">
16//! <div class="color" style="font-size:0.8em">
17//! <div class="name"></div>
18//! <div>C50</div> <div>C100</div> <div>C200</div> <div>C300</div> <div>C400</div>
19//! <div>C500</div> <div>C600</div> <div>C700</div> <div>C800</div> <div>C900</div>
20//! <div>C950</div>
21//! </div>
22//! <div class="color">
23//! <div class="name">
24//!
25//! [`SLATE`]</div>
26//! <div style="background-color: #f8fafc"></div> <div style="background-color: #f1f5f9"></div>
27//! <div style="background-color: #e2e8f0"></div> <div style="background-color: #cbd5e1"></div>
28//! <div style="background-color: #94a3b8"></div> <div style="background-color: #64748b"></div>
29//! <div style="background-color: #475569"></div> <div style="background-color: #334155"></div>
30//! <div style="background-color: #1e293b"></div> <div style="background-color: #0f172a"></div>
31//! <div style="background-color: #020617"></div>
32//! </div>
33//! <div class="color">
34//! <div class="name">
35//!
36//! [`GRAY`]</div>
37//! <div style="background-color: #f9fafb"></div> <div style="background-color: #f3f4f6"></div>
38//! <div style="background-color: #e5e7eb"></div> <div style="background-color: #d1d5db"></div>
39//! <div style="background-color: #9ca3af"></div> <div style="background-color: #6b7280"></div>
40//! <div style="background-color: #4b5563"></div> <div style="background-color: #374151"></div>
41//! <div style="background-color: #1f2937"></div> <div style="background-color: #111827"></div>
42//! <div style="background-color: #0a0a0a"></div>
43//! </div>
44//! <div class="color">
45//! <div class="name">
46//!
47//! [`ZINC`]</div>
48//! <div style="background-color: #fafafa"></div> <div style="background-color: #f5f5f5"></div>
49//! <div style="background-color: #e5e5e5"></div> <div style="background-color: #d4d4d4"></div>
50//! <div style="background-color: #a1a1aa"></div> <div style="background-color: #71717a"></div>
51//! <div style="background-color: #52525b"></div> <div style="background-color: #404040"></div>
52//! <div style="background-color: #262626"></div> <div style="background-color: #171717"></div>
53//! <div style="background-color: #0a0a0a"></div>
54//! </div>
55//! <div class="color">
56//! <div class="name">
57//!
58//! [`NEUTRAL`]</div>
59//! <div style="background-color: #fafafa"></div> <div style="background-color: #f5f5f5"></div>
60//! <div style="background-color: #e5e5e5"></div> <div style="background-color: #d4d4d4"></div>
61//! <div style="background-color: #a3a3a3"></div> <div style="background-color: #737373"></div>
62//! <div style="background-color: #525252"></div> <div style="background-color: #404040"></div>
63//! <div style="background-color: #262626"></div> <div style="background-color: #171717"></div>
64//! <div style="background-color: #0a0a0a"></div>
65//! </div>
66//! <div class="color">
67//! <div class="name">
68//!
69//! [`STONE`]</div>
70//! <div style="background-color: #fafaf9"></div> <div style="background-color: #f5f5f4"></div>
71//! <div style="background-color: #e7e5e4"></div> <div style="background-color: #d6d3d1"></div>
72//! <div style="background-color: #a8a29e"></div> <div style="background-color: #78716c"></div>
73//! <div style="background-color: #57534e"></div> <div style="background-color: #44403c"></div>
74//! <div style="background-color: #292524"></div> <div style="background-color: #1c1917"></div>
75//! <div style="background-color: #0c0a09"></div>
76//! </div>
77//! <div class="color">
78//! <div class="name">
79//!
80//! [`RED`]</div>
81//! <div style="background-color: #fef2f2"></div> <div style="background-color: #fee2e2"></div>
82//! <div style="background-color: #fecaca"></div> <div style="background-color: #fca5a5"></div>
83//! <div style="background-color: #f87171"></div> <div style="background-color: #ef4444"></div>
84//! <div style="background-color: #dc2626"></div> <div style="background-color: #b91c1c"></div>
85//! <div style="background-color: #991b1b"></div> <div style="background-color: #7f1d1d"></div>
86//! <div style="background-color: #450a0a"></div>
87//! </div>
88//! <div class="color">
89//! <div class="name">
90//!
91//! [`ORANGE`]</div>
92//! <div style="background-color: #fff7ed"></div> <div style="background-color: #ffedd5"></div>
93//! <div style="background-color: #fed7aa"></div> <div style="background-color: #fdba74"></div>
94//! <div style="background-color: #fb923c"></div> <div style="background-color: #f97316"></div>
95//! <div style="background-color: #ea580c"></div> <div style="background-color: #c2410c"></div>
96//! <div style="background-color: #9a3412"></div> <div style="background-color: #7c2d12"></div>
97//! <div style="background-color: #431407"></div>
98//! </div>
99//! <div class="color">
100//! <div class="name">
101//!
102//! [`AMBER`]</div>
103//! <div style="background-color: #fffbeb"></div> <div style="background-color: #fef3c7"></div>
104//! <div style="background-color: #fde68a"></div> <div style="background-color: #fcd34d"></div>
105//! <div style="background-color: #fbbf24"></div> <div style="background-color: #f59e0b"></div>
106//! <div style="background-color: #d97706"></div> <div style="background-color: #b45309"></div>
107//! <div style="background-color: #92400e"></div> <div style="background-color: #78350f"></div>
108//! <div style="background-color: #451a03"></div>
109//! </div>
110//! <div class="color">
111//! <div class="name">
112//!
113//! [`YELLOW`]</div>
114//! <div style="background-color: #fefce8"></div> <div style="background-color: #fef9c3"></div>
115//! <div style="background-color: #fef08a"></div> <div style="background-color: #fde047"></div>
116//! <div style="background-color: #facc15"></div> <div style="background-color: #eab308"></div>
117//! <div style="background-color: #ca8a04"></div> <div style="background-color: #a16207"></div>
118//! <div style="background-color: #854d0e"></div> <div style="background-color: #713f12"></div>
119//! <div style="background-color: #422006"></div>
120//! </div>
121//! <div class="color">
122//! <div class="name">
123//!
124//! [`LIME`]</div>
125//! <div style="background-color: #f7fee7"></div> <div style="background-color: #ecfccb"></div>
126//! <div style="background-color: #d9f99d"></div> <div style="background-color: #bef264"></div>
127//! <div style="background-color: #a3e635"></div> <div style="background-color: #84cc16"></div>
128//! <div style="background-color: #65a30d"></div> <div style="background-color: #4d7c0f"></div>
129//! <div style="background-color: #3f6212"></div> <div style="background-color: #365314"></div>
130//! <div style="background-color: #1a2e05"></div>
131//! </div>
132//! <div class="color">
133//! <div class="name">
134//!
135//! [`GREEN`]</div>
136//! <div style="background-color: #f0fdf4"></div> <div style="background-color: #dcfce7"></div>
137//! <div style="background-color: #bbf7d0"></div> <div style="background-color: #86efac"></div>
138//! <div style="background-color: #4ade80"></div> <div style="background-color: #22c55e"></div>
139//! <div style="background-color: #16a34a"></div> <div style="background-color: #15803d"></div>
140//! <div style="background-color: #166534"></div> <div style="background-color: #14532d"></div>
141//! <div style="background-color: #052e16"></div>
142//! </div>
143//! <div class="color">
144//! <div class="name">
145//!
146//! [`EMERALD`]</div>
147//! <div style="background-color: #ecfdf5"></div> <div style="background-color: #d1fae5"></div>
148//! <div style="background-color: #a7f3d0"></div> <div style="background-color: #6ee7b7"></div>
149//! <div style="background-color: #34d399"></div> <div style="background-color: #10b981"></div>
150//! <div style="background-color: #059669"></div> <div style="background-color: #047857"></div>
151//! <div style="background-color: #065f46"></div> <div style="background-color: #064e3b"></div>
152//! <div style="background-color: #022c22"></div>
153//! </div>
154//! <div class="color">
155//! <div class="name">
156//!
157//! [`TEAL`]</div>
158//! <div style="background-color: #f0fdfa"></div> <div style="background-color: #ccfbf1"></div>
159//! <div style="background-color: #99f6e4"></div> <div style="background-color: #5eead4"></div>
160//! <div style="background-color: #2dd4bf"></div> <div style="background-color: #14b8a6"></div>
161//! <div style="background-color: #0d9488"></div> <div style="background-color: #0f766e"></div>
162//! <div style="background-color: #115e59"></div> <div style="background-color: #134e4a"></div>
163//! <div style="background-color: #042f2e"></div>
164//! </div>
165//! <div class="color">
166//! <div class="name">
167//!
168//! [`CYAN`]</div>
169//! <div style="background-color: #ecfeff"></div> <div style="background-color: #cffafe"></div>
170//! <div style="background-color: #a5f3fc"></div> <div style="background-color: #67e8f9"></div>
171//! <div style="background-color: #22d3ee"></div> <div style="background-color: #06b6d4"></div>
172//! <div style="background-color: #0891b2"></div> <div style="background-color: #0e7490"></div>
173//! <div style="background-color: #155e75"></div> <div style="background-color: #164e63"></div>
174//! <div style="background-color: #083344"></div>
175//! </div>
176//! <div class="color">
177//! <div class="name">
178//!
179//! [`SKY`]</div>
180//! <div style="background-color: #f0f9ff"></div> <div style="background-color: #e0f2fe"></div>
181//! <div style="background-color: #bae6fd"></div> <div style="background-color: #7dd3fc"></div>
182//! <div style="background-color: #38bdf8"></div> <div style="background-color: #0ea5e9"></div>
183//! <div style="background-color: #0284c7"></div> <div style="background-color: #0369a1"></div>
184//! <div style="background-color: #075985"></div> <div style="background-color: #0c4a6e"></div>
185//! <div style="background-color: #082f49"></div>
186//! </div>
187//! <div class="color">
188//! <div class="name">
189//!
190//! [`BLUE`]</div>
191//! <div style="background-color: #eff6ff"></div> <div style="background-color: #dbeafe"></div>
192//! <div style="background-color: #bfdbfe"></div> <div style="background-color: #93c5fd"></div>
193//! <div style="background-color: #60a5fa"></div> <div style="background-color: #3b82f6"></div>
194//! <div style="background-color: #2563eb"></div> <div style="background-color: #1d4ed8"></div>
195//! <div style="background-color: #1e40af"></div> <div style="background-color: #1e3a8a"></div>
196//! <div style="background-color: #172554"></div>
197//! </div>
198//! <div class="color">
199//! <div class="name">
200//!
201//! [`INDIGO`]</div>
202//! <div style="background-color: #eef2ff"></div> <div style="background-color: #e0e7ff"></div>
203//! <div style="background-color: #c7d2fe"></div> <div style="background-color: #a5b4fc"></div>
204//! <div style="background-color: #818cf8"></div> <div style="background-color: #6366f1"></div>
205//! <div style="background-color: #4f46e5"></div> <div style="background-color: #4338ca"></div>
206//! <div style="background-color: #3730a3"></div> <div style="background-color: #312e81"></div>
207//! <div style="background-color: #1e1b4b"></div>
208//! </div>
209//! <div class="color">
210//! <div class="name">
211//!
212//! [`VIOLET`]</div>
213//! <div style="background-color: #f5f3ff"></div> <div style="background-color: #ede9fe"></div>
214//! <div style="background-color: #ddd6fe"></div> <div style="background-color: #c4b5fd"></div>
215//! <div style="background-color: #a78bfa"></div> <div style="background-color: #8b5cf6"></div>
216//! <div style="background-color: #7c3aed"></div> <div style="background-color: #6d28d9"></div>
217//! <div style="background-color: #5b21b6"></div> <div style="background-color: #4c1d95"></div>
218//! <div style="background-color: #2e1065"></div>
219//! </div>
220//! <div class="color">
221//! <div class="name">
222//!
223//! [`PURPLE`]</div>
224//! <div style="background-color: #faf5ff"></div> <div style="background-color: #f3e8ff"></div>
225//! <div style="background-color: #e9d5ff"></div> <div style="background-color: #d8b4fe"></div>
226//! <div style="background-color: #c084fc"></div> <div style="background-color: #a855f7"></div>
227//! <div style="background-color: #9333ea"></div> <div style="background-color: #7e22ce"></div>
228//! <div style="background-color: #6b21a8"></div> <div style="background-color: #581c87"></div>
229//! <div style="background-color: #4c136e"></div>
230//! </div>
231//! <div class="color">
232//! <div class="name">
233//!
234//! [`FUCHSIA`]</div>
235//! <div style="background-color: #fdf4ff"></div> <div style="background-color: #fae8ff"></div>
236//! <div style="background-color: #f5d0fe"></div> <div style="background-color: #f0abfc"></div>
237//! <div style="background-color: #e879f9"></div> <div style="background-color: #d946ef"></div>
238//! <div style="background-color: #c026d3"></div> <div style="background-color: #a21caf"></div>
239//! <div style="background-color: #86198f"></div> <div style="background-color: #701a75"></div>
240//! <div style="background-color: #4e145b"></div>
241//! </div>
242//! <div class="color">
243//! <div class="name">
244//!
245//! [`PINK`]</div>
246//! <div style="background-color: #fdf2f8"></div> <div style="background-color: #fce7f3"></div>
247//! <div style="background-color: #fbcfe8"></div> <div style="background-color: #f9a8d4"></div>
248//! <div style="background-color: #f472b6"></div> <div style="background-color: #ec4899"></div>
249//! <div style="background-color: #db2777"></div> <div style="background-color: #be185d"></div>
250//! <div style="background-color: #9d174d"></div> <div style="background-color: #831843"></div>
251//! <div style="background-color: #5f0b37"></div>
252//! </div>
253//! <div class="color">
254//! <div class="name">
255//!
256//! [`BLACK`]</div>
257//! <div style="background-color: #000000; width:22rem"></div>
258//! </div>
259//! <div class="color">
260//! <div class="name">
261//!
262//! [`WHITE`]</div>
263//! <div style="background-color: #ffffff; width:22rem"></div>
264//! </div>
265//! </div>
266//! </div>
267//!
268//! # Example
269//!
270//! ```rust
271//! use ratatui_core::style::Color;
272//! use ratatui_core::style::palette::tailwind::{BLUE, RED};
273//!
274//! assert_eq!(RED.c500, Color::Rgb(239, 68, 68));
275//! assert_eq!(BLUE.c500, Color::Rgb(59, 130, 246));
276//! ```
277
278use crate::style::Color;
279
280#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
281pub struct Palette {
282 pub c50: Color,
283 pub c100: Color,
284 pub c200: Color,
285 pub c300: Color,
286 pub c400: Color,
287 pub c500: Color,
288 pub c600: Color,
289 pub c700: Color,
290 pub c800: Color,
291 pub c900: Color,
292 pub c950: Color,
293}
294
295#[rustfmt::skip]
296/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #000000"></div></div>
297pub const BLACK: Color = Color::from_u32(0x000000);
298
299#[rustfmt::skip]
300/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #ffffff"></div></div>
301pub const WHITE: Color = Color::from_u32(0xffffff);
302
303#[rustfmt::skip]
304/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #f8fafc"></div><div style="background-color: #f1f5f9"></div><div style="background-color: #e2e8f0"></div><div style="background-color: #cbd5e1"></div><div style="background-color: #94a3b8"></div><div style="background-color: #64748b"></div><div style="background-color: #475569"></div><div style="background-color: #334155"></div><div style="background-color: #1e293b"></div><div style="background-color: #0f172a"></div><div style="background-color: #020617"></div></div>
305pub const SLATE: Palette = Palette {
306 c50: Color::from_u32(0xf8fafc),
307 c100: Color::from_u32(0xf1f5f9),
308 c200: Color::from_u32(0xe2e8f0),
309 c300: Color::from_u32(0xcbd5e1),
310 c400: Color::from_u32(0x94a3b8),
311 c500: Color::from_u32(0x64748b),
312 c600: Color::from_u32(0x475569),
313 c700: Color::from_u32(0x334155),
314 c800: Color::from_u32(0x1e293b),
315 c900: Color::from_u32(0x0f172a),
316 c950: Color::from_u32(0x020617),
317};
318
319#[rustfmt::skip]
320/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #f9fafb"></div><div style="background-color: #f3f4f6"></div><div style="background-color: #e5e7eb"></div><div style="background-color: #d1d5db"></div><div style="background-color: #9ca3af"></div><div style="background-color: #6b7280"></div><div style="background-color: #4b5563"></div><div style="background-color: #374151"></div><div style="background-color: #1f2937"></div><div style="background-color: #111827"></div><div style="background-color: #030712"></div></div>
321pub const GRAY: Palette = Palette {
322 c50: Color::from_u32(0xf9fafb),
323 c100: Color::from_u32(0xf3f4f6),
324 c200: Color::from_u32(0xe5e7eb),
325 c300: Color::from_u32(0xd1d5db),
326 c400: Color::from_u32(0x9ca3af),
327 c500: Color::from_u32(0x6b7280),
328 c600: Color::from_u32(0x4b5563),
329 c700: Color::from_u32(0x374151),
330 c800: Color::from_u32(0x1f2937),
331 c900: Color::from_u32(0x111827),
332 c950: Color::from_u32(0x030712),
333};
334
335#[rustfmt::skip]
336/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fafafa"></div><div style="background-color: #f5f5f5"></div><div style="background-color: #e5e5e5"></div><div style="background-color: #d4d4d4"></div><div style="background-color: #a1a1aa"></div><div style="background-color: #71717a"></div><div style="background-color: #52525b"></div><div style="background-color: #404040"></div><div style="background-color: #262626"></div><div style="background-color: #171717"></div><div style="background-color: #09090b"></div></div>
337pub const ZINC: Palette = Palette {
338 c50: Color::from_u32(0xfafafa),
339 c100: Color::from_u32(0xf4f4f5),
340 c200: Color::from_u32(0xe4e4e7),
341 c300: Color::from_u32(0xd4d4d8),
342 c400: Color::from_u32(0xa1a1aa),
343 c500: Color::from_u32(0x71717a),
344 c600: Color::from_u32(0x52525b),
345 c700: Color::from_u32(0x3f3f46),
346 c800: Color::from_u32(0x27272a),
347 c900: Color::from_u32(0x18181b),
348 c950: Color::from_u32(0x09090b),
349};
350
351#[rustfmt::skip]
352/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fafafa"></div><div style="background-color: #f5f5f5"></div><div style="background-color: #e5e5e5"></div><div style="background-color: #d4d4d4"></div><div style="background-color: #a3a3a3"></div><div style="background-color: #737373"></div><div style="background-color: #525252"></div><div style="background-color: #404040"></div><div style="background-color: #262626"></div><div style="background-color: #171717"></div><div style="background-color: #0a0a0a"></div></div>
353pub const NEUTRAL: Palette = Palette {
354 c50: Color::from_u32(0xfafafa),
355 c100: Color::from_u32(0xf5f5f5),
356 c200: Color::from_u32(0xe5e5e5),
357 c300: Color::from_u32(0xd4d4d4),
358 c400: Color::from_u32(0xa3a3a3),
359 c500: Color::from_u32(0x737373),
360 c600: Color::from_u32(0x525252),
361 c700: Color::from_u32(0x404040),
362 c800: Color::from_u32(0x262626),
363 c900: Color::from_u32(0x171717),
364 c950: Color::from_u32(0x0a0a0a),
365};
366
367#[rustfmt::skip]
368/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fafaf9"></div><div style="background-color: #f5f5f4"></div><div style="background-color: #e7e5e4"></div><div style="background-color: #d6d3d1"></div><div style="background-color: #a8a29e"></div><div style="background-color: #78716c"></div><div style="background-color: #57534e"></div><div style="background-color: #44403c"></div><div style="background-color: #292524"></div><div style="background-color: #1c1917"></div><div style="background-color: #0c0a09"></div></div>
369pub const STONE: Palette = Palette {
370 c50: Color::from_u32(0xfafaf9),
371 c100: Color::from_u32(0xf5f5f4),
372 c200: Color::from_u32(0xe7e5e4),
373 c300: Color::from_u32(0xd6d3d1),
374 c400: Color::from_u32(0xa8a29e),
375 c500: Color::from_u32(0x78716c),
376 c600: Color::from_u32(0x57534e),
377 c700: Color::from_u32(0x44403c),
378 c800: Color::from_u32(0x292524),
379 c900: Color::from_u32(0x1c1917),
380 c950: Color::from_u32(0x0c0a09),
381};
382
383#[rustfmt::skip]
384/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fef2f2"></div><div style="background-color: #fee2e2"></div><div style="background-color: #fecaca"></div><div style="background-color: #fca5a5"></div><div style="background-color: #f87171"></div><div style="background-color: #ef4444"></div><div style="background-color: #dc2626"></div><div style="background-color: #b91c1c"></div><div style="background-color: #991b1b"></div><div style="background-color: #7f1d1d"></div><div style="background-color: #450a0a"></div></div>
385pub const RED: Palette = Palette {
386 c50: Color::from_u32(0xfef2f2),
387 c100: Color::from_u32(0xfee2e2),
388 c200: Color::from_u32(0xfecaca),
389 c300: Color::from_u32(0xfca5a5),
390 c400: Color::from_u32(0xf87171),
391 c500: Color::from_u32(0xef4444),
392 c600: Color::from_u32(0xdc2626),
393 c700: Color::from_u32(0xb91c1c),
394 c800: Color::from_u32(0x991b1b),
395 c900: Color::from_u32(0x7f1d1d),
396 c950: Color::from_u32(0x450a0a),
397};
398
399#[rustfmt::skip]
400/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fff7ed"></div><div style="background-color: #ffedd5"></div><div style="background-color: #fed7aa"></div><div style="background-color: #fdba74"></div><div style="background-color: #fb923c"></div><div style="background-color: #f97316"></div><div style="background-color: #ea580c"></div><div style="background-color: #c2410c"></div><div style="background-color: #9a3412"></div><div style="background-color: #7c2d12"></div><div style="background-color: #431407"></div></div>
401pub const ORANGE: Palette = Palette {
402 c50: Color::from_u32(0xfff7ed),
403 c100: Color::from_u32(0xffedd5),
404 c200: Color::from_u32(0xfed7aa),
405 c300: Color::from_u32(0xfdba74),
406 c400: Color::from_u32(0xfb923c),
407 c500: Color::from_u32(0xf97316),
408 c600: Color::from_u32(0xea580c),
409 c700: Color::from_u32(0xc2410c),
410 c800: Color::from_u32(0x9a3412),
411 c900: Color::from_u32(0x7c2d12),
412 c950: Color::from_u32(0x431407),
413};
414
415#[rustfmt::skip]
416/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fffbeb"></div><div style="background-color: #fef3c7"></div><div style="background-color: #fde68a"></div><div style="background-color: #fcd34d"></div><div style="background-color: #fbbf24"></div><div style="background-color: #f59e0b"></div><div style="background-color: #d97706"></div><div style="background-color: #b45309"></div><div style="background-color: #92400e"></div><div style="background-color: #78350f"></div><div style="background-color: #451a03"></div></div>
417pub const AMBER: Palette = Palette {
418 c50: Color::from_u32(0xfffbeb),
419 c100: Color::from_u32(0xfef3c7),
420 c200: Color::from_u32(0xfde68a),
421 c300: Color::from_u32(0xfcd34d),
422 c400: Color::from_u32(0xfbbf24),
423 c500: Color::from_u32(0xf59e0b),
424 c600: Color::from_u32(0xd97706),
425 c700: Color::from_u32(0xb45309),
426 c800: Color::from_u32(0x92400e),
427 c900: Color::from_u32(0x78350f),
428 c950: Color::from_u32(0x451a03),
429};
430
431#[rustfmt::skip]
432/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fefce8"></div><div style="background-color: #fef9c3"></div><div style="background-color: #fef08a"></div><div style="background-color: #fde047"></div><div style="background-color: #facc15"></div><div style="background-color: #eab308"></div><div style="background-color: #ca8a04"></div><div style="background-color: #a16207"></div><div style="background-color: #854d0e"></div><div style="background-color: #713f12"></div><div style="background-color: #422006"></div></div>
433pub const YELLOW: Palette = Palette {
434 c50: Color::from_u32(0xfefce8),
435 c100: Color::from_u32(0xfef9c3),
436 c200: Color::from_u32(0xfef08a),
437 c300: Color::from_u32(0xfde047),
438 c400: Color::from_u32(0xfacc15),
439 c500: Color::from_u32(0xeab308),
440 c600: Color::from_u32(0xca8a04),
441 c700: Color::from_u32(0xa16207),
442 c800: Color::from_u32(0x854d0e),
443 c900: Color::from_u32(0x713f12),
444 c950: Color::from_u32(0x422006),
445};
446
447#[rustfmt::skip]
448/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #f7fee7"></div><div style="background-color: #ecfccb"></div><div style="background-color: #d9f99d"></div><div style="background-color: #bef264"></div><div style="background-color: #a3e635"></div><div style="background-color: #84cc16"></div><div style="background-color: #65a30d"></div><div style="background-color: #4d7c0f"></div><div style="background-color: #3f6212"></div><div style="background-color: #365314"></div><div style="background-color: #1a2e05"></div></div>
449pub const LIME: Palette = Palette {
450 c50: Color::from_u32(0xf7fee7),
451 c100: Color::from_u32(0xecfccb),
452 c200: Color::from_u32(0xd9f99d),
453 c300: Color::from_u32(0xbef264),
454 c400: Color::from_u32(0xa3e635),
455 c500: Color::from_u32(0x84cc16),
456 c600: Color::from_u32(0x65a30d),
457 c700: Color::from_u32(0x4d7c0f),
458 c800: Color::from_u32(0x3f6212),
459 c900: Color::from_u32(0x365314),
460 c950: Color::from_u32(0x1a2e05),
461};
462
463#[rustfmt::skip]
464/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #f0fdf4"></div><div style="background-color: #dcfce7"></div><div style="background-color: #bbf7d0"></div><div style="background-color: #86efac"></div><div style="background-color: #4ade80"></div><div style="background-color: #22c55e"></div><div style="background-color: #16a34a"></div><div style="background-color: #15803d"></div><div style="background-color: #166534"></div><div style="background-color: #14532d"></div><div style="background-color: #052e16"></div></div>
465pub const GREEN: Palette = Palette {
466 c50: Color::from_u32(0xf0fdf4),
467 c100: Color::from_u32(0xdcfce7),
468 c200: Color::from_u32(0xbbf7d0),
469 c300: Color::from_u32(0x86efac),
470 c400: Color::from_u32(0x4ade80),
471 c500: Color::from_u32(0x22c55e),
472 c600: Color::from_u32(0x16a34a),
473 c700: Color::from_u32(0x15803d),
474 c800: Color::from_u32(0x166534),
475 c900: Color::from_u32(0x14532d),
476 c950: Color::from_u32(0x052e16),
477};
478
479#[rustfmt::skip]
480/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #f0fdfa"></div><div style="background-color: #ccfbf1"></div><div style="background-color: #99f6e4"></div><div style="background-color: #5eead4"></div><div style="background-color: #2dd4bf"></div><div style="background-color: #14b8a6"></div><div style="background-color: #0d9488"></div><div style="background-color: #0f766e"></div><div style="background-color: #115e59"></div><div style="background-color: #134e4a"></div><div style="background-color: #042f2e"></div></div>
481pub const EMERALD: Palette = Palette {
482 c50: Color::from_u32(0xecfdf5),
483 c100: Color::from_u32(0xd1fae5),
484 c200: Color::from_u32(0xa7f3d0),
485 c300: Color::from_u32(0x6ee7b7),
486 c400: Color::from_u32(0x34d399),
487 c500: Color::from_u32(0x10b981),
488 c600: Color::from_u32(0x059669),
489 c700: Color::from_u32(0x047857),
490 c800: Color::from_u32(0x065f46),
491 c900: Color::from_u32(0x064e3b),
492 c950: Color::from_u32(0x022c22),
493};
494
495#[rustfmt::skip]
496/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #f5fdf4"></div><div style="background-color: #e7f9e7"></div><div style="background-color: #c6f6d5"></div><div style="background-color: #9ae6b4"></div><div style="background-color: #68d391"></div><div style="background-color: #48bb78"></div><div style="background-color: #38a169"></div><div style="background-color: #2f855a"></div><div style="background-color: #276749"></div><div style="background-color: #22543d"></div><div style="background-color: #0d3321"></div></div>
497pub const TEAL: Palette = Palette {
498 c50: Color::from_u32(0xf0fdfa),
499 c100: Color::from_u32(0xccfbf1),
500 c200: Color::from_u32(0x99f6e4),
501 c300: Color::from_u32(0x5eead4),
502 c400: Color::from_u32(0x2dd4bf),
503 c500: Color::from_u32(0x14b8a6),
504 c600: Color::from_u32(0x0d9488),
505 c700: Color::from_u32(0x0f766e),
506 c800: Color::from_u32(0x115e59),
507 c900: Color::from_u32(0x134e4a),
508 c950: Color::from_u32(0x042f2e),
509};
510
511#[rustfmt::skip]
512/// <style>.palette div{width:2rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #ecfeff"></div><div style="background-color: #cffafe"></div><div style="background-color: #a5f3fc"></div><div style="background-color: #67e8f9"></div><div style="background-color: #22d3ee"></div><div style="background-color: #06b6d4"></div><div style="background-color: #0891b2"></div><div style="background-color: #0e7490"></div><div style="background-color: #155e75"></div><div style="background-color: #164e63"></div><div style="background-color: #083344"></div></div>
513pub const CYAN: Palette = Palette {
514 c50: Color::from_u32(0xecfeff),
515 c100: Color::from_u32(0xcffafe),
516 c200: Color::from_u32(0xa5f3fc),
517 c300: Color::from_u32(0x67e8f9),
518 c400: Color::from_u32(0x22d3ee),
519 c500: Color::from_u32(0x06b6d4),
520 c600: Color::from_u32(0x0891b2),
521 c700: Color::from_u32(0x0e7490),
522 c800: Color::from_u32(0x155e75),
523 c900: Color::from_u32(0x164e63),
524 c950: Color::from_u32(0x083344),
525};
526
527#[rustfmt::skip]
528/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #f0f9ff"></div><div style="background-color: #e0f2fe"></div><div style="background-color: #bae6fd"></div><div style="background-color: #7dd3fc"></div><div style="background-color: #38bdf8"></div><div style="background-color: #0ea5e9"></div><div style="background-color: #0284c7"></div><div style="background-color: #0369a1"></div><div style="background-color: #075985"></div><div style="background-color: #0c4a6e"></div><div style="background-color: #082f49"></div></div>
529pub const SKY: Palette = Palette {
530 c50: Color::from_u32(0xf0f9ff),
531 c100: Color::from_u32(0xe0f2fe),
532 c200: Color::from_u32(0xbae6fd),
533 c300: Color::from_u32(0x7dd3fc),
534 c400: Color::from_u32(0x38bdf8),
535 c500: Color::from_u32(0x0ea5e9),
536 c600: Color::from_u32(0x0284c7),
537 c700: Color::from_u32(0x0369a1),
538 c800: Color::from_u32(0x075985),
539 c900: Color::from_u32(0x0c4a6e),
540 c950: Color::from_u32(0x082f49),
541};
542
543#[rustfmt::skip]
544/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #eff6ff"></div><div style="background-color: #dbeafe"></div><div style="background-color: #bfdbfe"></div><div style="background-color: #93c5fd"></div><div style="background-color: #60a5fa"></div><div style="background-color: #3b82f6"></div><div style="background-color: #2563eb"></div><div style="background-color: #1d4ed8"></div><div style="background-color: #1e40af"></div><div style="background-color: #1e3a8a"></div><div style="background-color: #172554"></div></div>
545pub const BLUE: Palette = Palette {
546 c50: Color::from_u32(0xeff6ff),
547 c100: Color::from_u32(0xdbeafe),
548 c200: Color::from_u32(0xbfdbfe),
549 c300: Color::from_u32(0x93c5fd),
550 c400: Color::from_u32(0x60a5fa),
551 c500: Color::from_u32(0x3b82f6),
552 c600: Color::from_u32(0x2563eb),
553 c700: Color::from_u32(0x1d4ed8),
554 c800: Color::from_u32(0x1e40af),
555 c900: Color::from_u32(0x1e3a8a),
556 c950: Color::from_u32(0x172554),
557};
558
559#[rustfmt::skip]
560/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #eef2ff"></div><div style="background-color: #e0e7ff"></div><div style="background-color: #c7d2fe"></div><div style="background-color: #a5b4fc"></div><div style="background-color: #818cf8"></div><div style="background-color: #6366f1"></div><div style="background-color: #4f46e5"></div><div style="background-color: #4338ca"></div><div style="background-color: #3730a3"></div><div style="background-color: #312e81"></div><div style="background-color: #1e1b4b"></div></div>
561pub const INDIGO: Palette = Palette {
562 c50: Color::from_u32(0xeef2ff),
563 c100: Color::from_u32(0xe0e7ff),
564 c200: Color::from_u32(0xc7d2fe),
565 c300: Color::from_u32(0xa5b4fc),
566 c400: Color::from_u32(0x818cf8),
567 c500: Color::from_u32(0x6366f1),
568 c600: Color::from_u32(0x4f46e5),
569 c700: Color::from_u32(0x4338ca),
570 c800: Color::from_u32(0x3730a3),
571 c900: Color::from_u32(0x312e81),
572 c950: Color::from_u32(0x1e1b4b),
573};
574
575#[rustfmt::skip]
576/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #f5f3ff"></div><div style="background-color: #ede9fe"></div><div style="background-color: #ddd6fe"></div><div style="background-color: #c4b5fd"></div><div style="background-color: #a78bfa"></div><div style="background-color: #8b5cf6"></div><div style="background-color: #7c3aed"></div><div style="background-color: #6d28d9"></div><div style="background-color: #5b21b6"></div><div style="background-color: #4c1d95"></div><div style="background-color: #2e1065"></div></div>
577pub const VIOLET: Palette = Palette {
578 c50: Color::from_u32(0xf5f3ff),
579 c100: Color::from_u32(0xede9fe),
580 c200: Color::from_u32(0xddd6fe),
581 c300: Color::from_u32(0xc4b5fd),
582 c400: Color::from_u32(0xa78bfa),
583 c500: Color::from_u32(0x8b5cf6),
584 c600: Color::from_u32(0x7c3aed),
585 c700: Color::from_u32(0x6d28d9),
586 c800: Color::from_u32(0x5b21b6),
587 c900: Color::from_u32(0x4c1d95),
588 c950: Color::from_u32(0x2e1065),
589};
590
591#[rustfmt::skip]
592/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #faf5ff"></div><div style="background-color: #f3e8ff"></div><div style="background-color: #e9d5ff"></div><div style="background-color: #d8b4fe"></div><div style="background-color: #c084fc"></div><div style="background-color: #a855f7"></div><div style="background-color: #9333ea"></div><div style="background-color: #7e22ce"></div><div style="background-color: #6b21a8"></div><div style="background-color: #581c87"></div><div style="background-color: #3b0764"></div></div>
593pub const PURPLE: Palette = Palette {
594 c50: Color::from_u32(0xfaf5ff),
595 c100: Color::from_u32(0xf3e8ff),
596 c200: Color::from_u32(0xe9d5ff),
597 c300: Color::from_u32(0xd8b4fe),
598 c400: Color::from_u32(0xc084fc),
599 c500: Color::from_u32(0xa855f7),
600 c600: Color::from_u32(0x9333ea),
601 c700: Color::from_u32(0x7e22ce),
602 c800: Color::from_u32(0x6b21a8),
603 c900: Color::from_u32(0x581c87),
604 c950: Color::from_u32(0x3b0764),
605};
606
607#[rustfmt::skip]
608/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fdf4ff"></div><div style="background-color: #fae8ff"></div><div style="background-color: #f5d0fe"></div><div style="background-color: #f0abfc"></div><div style="background-color: #e879f9"></div><div style="background-color: #d946ef"></div><div style="background-color: #c026d3"></div><div style="background-color: #a21caf"></div><div style="background-color: #86198f"></div><div style="background-color: #701a75"></div><div style="background-color: #4a044e"></div></div>
609pub const FUCHSIA: Palette = Palette {
610 c50: Color::from_u32(0xfdf4ff),
611 c100: Color::from_u32(0xfae8ff),
612 c200: Color::from_u32(0xf5d0fe),
613 c300: Color::from_u32(0xf0abfc),
614 c400: Color::from_u32(0xe879f9),
615 c500: Color::from_u32(0xd946ef),
616 c600: Color::from_u32(0xc026d3),
617 c700: Color::from_u32(0xa21caf),
618 c800: Color::from_u32(0x86198f),
619 c900: Color::from_u32(0x701a75),
620 c950: Color::from_u32(0x4a044e),
621};
622
623#[rustfmt::skip]
624/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fdf2f8"></div><div style="background-color: #fce7f3"></div><div style="background-color: #fbcfe8"></div><div style="background-color: #f9a8d4"></div><div style="background-color: #f472b6"></div><div style="background-color: #ec4899"></div><div style="background-color: #db2777"></div><div style="background-color: #be185d"></div><div style="background-color: #9d174d"></div><div style="background-color: #831843"></div><div style="background-color: #500724"></div></div>
625pub const PINK: Palette = Palette {
626 c50: Color::from_u32(0xfdf2f8),
627 c100: Color::from_u32(0xfce7f3),
628 c200: Color::from_u32(0xfbcfe8),
629 c300: Color::from_u32(0xf9a8d4),
630 c400: Color::from_u32(0xf472b6),
631 c500: Color::from_u32(0xec4899),
632 c600: Color::from_u32(0xdb2777),
633 c700: Color::from_u32(0xbe185d),
634 c800: Color::from_u32(0x9d174d),
635 c900: Color::from_u32(0x831843),
636 c950: Color::from_u32(0x500724),
637};
638
639#[rustfmt::skip]
640/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #fff1f2"></div><div style="background-color: #ffe4e6"></div><div style="background-color: #fecdd3"></div><div style="background-color: #fda4af"></div><div style="background-color: #fb7185"></div><div style="background-color: #f43f5e"></div><div style="background-color: #e11d48"></div><div style="background-color: #be123c"></div><div style="background-color: #9f1239"></div><div style="background-color: #881337"></div><div style="background-color: #4c0519"></div></div>
641pub const ROSE: Palette = Palette {
642 c50: Color::from_u32(0xfff1f2),
643 c100: Color::from_u32(0xffe4e6),
644 c200: Color::from_u32(0xfecdd3),
645 c300: Color::from_u32(0xfda4af),
646 c400: Color::from_u32(0xfb7185),
647 c500: Color::from_u32(0xf43f5e),
648 c600: Color::from_u32(0xe11d48),
649 c700: Color::from_u32(0xbe123c),
650 c800: Color::from_u32(0x9f1239),
651 c900: Color::from_u32(0x881337),
652 c950: Color::from_u32(0x4c0519),
653};