ratatui/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::style::{
272//! palette::tailwind::{BLUE, RED},
273//! Color,
274//! };
275//!
276//! assert_eq!(RED.c500, Color::Rgb(239, 68, 68));
277//! assert_eq!(BLUE.c500, Color::Rgb(59, 130, 246));
278//! ```
279
280use crate::style::Color;
281
282pub struct Palette {
283 pub c50: Color,
284 pub c100: Color,
285 pub c200: Color,
286 pub c300: Color,
287 pub c400: Color,
288 pub c500: Color,
289 pub c600: Color,
290 pub c700: Color,
291 pub c800: Color,
292 pub c900: Color,
293 pub c950: Color,
294}
295
296#[rustfmt::skip]
297/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #000000"></div></div>
298pub const BLACK: Color = Color::from_u32(0x000000);
299
300#[rustfmt::skip]
301/// <style>.palette div{width:22rem;height:2rem}</style><div class="palette" style="display:flex;flex-direction:row"><div style="background-color: #ffffff"></div></div>
302pub const WHITE: Color = Color::from_u32(0xffffff);
303
304#[rustfmt::skip]
305/// <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>
306pub const SLATE: Palette = Palette {
307 c50: Color::from_u32(0xf8fafc),
308 c100: Color::from_u32(0xf1f5f9),
309 c200: Color::from_u32(0xe2e8f0),
310 c300: Color::from_u32(0xcbd5e1),
311 c400: Color::from_u32(0x94a3b8),
312 c500: Color::from_u32(0x64748b),
313 c600: Color::from_u32(0x475569),
314 c700: Color::from_u32(0x334155),
315 c800: Color::from_u32(0x1e293b),
316 c900: Color::from_u32(0x0f172a),
317 c950: Color::from_u32(0x020617),
318};
319
320#[rustfmt::skip]
321/// <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>
322pub const GRAY: Palette = Palette {
323 c50: Color::from_u32(0xf9fafb),
324 c100: Color::from_u32(0xf3f4f6),
325 c200: Color::from_u32(0xe5e7eb),
326 c300: Color::from_u32(0xd1d5db),
327 c400: Color::from_u32(0x9ca3af),
328 c500: Color::from_u32(0x6b7280),
329 c600: Color::from_u32(0x4b5563),
330 c700: Color::from_u32(0x374151),
331 c800: Color::from_u32(0x1f2937),
332 c900: Color::from_u32(0x111827),
333 c950: Color::from_u32(0x030712),
334};
335
336#[rustfmt::skip]
337/// <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>
338pub const ZINC: Palette = Palette {
339 c50: Color::from_u32(0xfafafa),
340 c100: Color::from_u32(0xf4f4f5),
341 c200: Color::from_u32(0xe4e4e7),
342 c300: Color::from_u32(0xd4d4d8),
343 c400: Color::from_u32(0xa1a1aa),
344 c500: Color::from_u32(0x71717a),
345 c600: Color::from_u32(0x52525b),
346 c700: Color::from_u32(0x3f3f46),
347 c800: Color::from_u32(0x27272a),
348 c900: Color::from_u32(0x18181b),
349 c950: Color::from_u32(0x09090b),
350};
351
352#[rustfmt::skip]
353/// <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>
354pub const NEUTRAL: Palette = Palette {
355 c50: Color::from_u32(0xfafafa),
356 c100: Color::from_u32(0xf5f5f5),
357 c200: Color::from_u32(0xe5e5e5),
358 c300: Color::from_u32(0xd4d4d4),
359 c400: Color::from_u32(0xa3a3a3),
360 c500: Color::from_u32(0x737373),
361 c600: Color::from_u32(0x525252),
362 c700: Color::from_u32(0x404040),
363 c800: Color::from_u32(0x262626),
364 c900: Color::from_u32(0x171717),
365 c950: Color::from_u32(0x0a0a0a),
366};
367
368#[rustfmt::skip]
369/// <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>
370pub const STONE: Palette = Palette {
371 c50: Color::from_u32(0xfafaf9),
372 c100: Color::from_u32(0xf5f5f4),
373 c200: Color::from_u32(0xe7e5e4),
374 c300: Color::from_u32(0xd6d3d1),
375 c400: Color::from_u32(0xa8a29e),
376 c500: Color::from_u32(0x78716c),
377 c600: Color::from_u32(0x57534e),
378 c700: Color::from_u32(0x44403c),
379 c800: Color::from_u32(0x292524),
380 c900: Color::from_u32(0x1c1917),
381 c950: Color::from_u32(0x0c0a09),
382};
383
384#[rustfmt::skip]
385/// <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>
386pub const RED: Palette = Palette {
387 c50: Color::from_u32(0xfef2f2),
388 c100: Color::from_u32(0xfee2e2),
389 c200: Color::from_u32(0xfecaca),
390 c300: Color::from_u32(0xfca5a5),
391 c400: Color::from_u32(0xf87171),
392 c500: Color::from_u32(0xef4444),
393 c600: Color::from_u32(0xdc2626),
394 c700: Color::from_u32(0xb91c1c),
395 c800: Color::from_u32(0x991b1b),
396 c900: Color::from_u32(0x7f1d1d),
397 c950: Color::from_u32(0x450a0a),
398};
399
400#[rustfmt::skip]
401/// <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>
402pub const ORANGE: Palette = Palette {
403 c50: Color::from_u32(0xfff7ed),
404 c100: Color::from_u32(0xffedd5),
405 c200: Color::from_u32(0xfed7aa),
406 c300: Color::from_u32(0xfdba74),
407 c400: Color::from_u32(0xfb923c),
408 c500: Color::from_u32(0xf97316),
409 c600: Color::from_u32(0xea580c),
410 c700: Color::from_u32(0xc2410c),
411 c800: Color::from_u32(0x9a3412),
412 c900: Color::from_u32(0x7c2d12),
413 c950: Color::from_u32(0x431407),
414};
415
416#[rustfmt::skip]
417/// <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>
418pub const AMBER: Palette = Palette {
419 c50: Color::from_u32(0xfffbeb),
420 c100: Color::from_u32(0xfef3c7),
421 c200: Color::from_u32(0xfde68a),
422 c300: Color::from_u32(0xfcd34d),
423 c400: Color::from_u32(0xfbbf24),
424 c500: Color::from_u32(0xf59e0b),
425 c600: Color::from_u32(0xd97706),
426 c700: Color::from_u32(0xb45309),
427 c800: Color::from_u32(0x92400e),
428 c900: Color::from_u32(0x78350f),
429 c950: Color::from_u32(0x451a03),
430};
431
432#[rustfmt::skip]
433/// <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>
434pub const YELLOW: Palette = Palette {
435 c50: Color::from_u32(0xfefce8),
436 c100: Color::from_u32(0xfef9c3),
437 c200: Color::from_u32(0xfef08a),
438 c300: Color::from_u32(0xfde047),
439 c400: Color::from_u32(0xfacc15),
440 c500: Color::from_u32(0xeab308),
441 c600: Color::from_u32(0xca8a04),
442 c700: Color::from_u32(0xa16207),
443 c800: Color::from_u32(0x854d0e),
444 c900: Color::from_u32(0x713f12),
445 c950: Color::from_u32(0x422006),
446};
447
448#[rustfmt::skip]
449/// <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>
450pub const LIME: Palette = Palette {
451 c50: Color::from_u32(0xf7fee7),
452 c100: Color::from_u32(0xecfccb),
453 c200: Color::from_u32(0xd9f99d),
454 c300: Color::from_u32(0xbef264),
455 c400: Color::from_u32(0xa3e635),
456 c500: Color::from_u32(0x84cc16),
457 c600: Color::from_u32(0x65a30d),
458 c700: Color::from_u32(0x4d7c0f),
459 c800: Color::from_u32(0x3f6212),
460 c900: Color::from_u32(0x365314),
461 c950: Color::from_u32(0x1a2e05),
462};
463
464#[rustfmt::skip]
465/// <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>
466pub const GREEN: Palette = Palette {
467 c50: Color::from_u32(0xf0fdf4),
468 c100: Color::from_u32(0xdcfce7),
469 c200: Color::from_u32(0xbbf7d0),
470 c300: Color::from_u32(0x86efac),
471 c400: Color::from_u32(0x4ade80),
472 c500: Color::from_u32(0x22c55e),
473 c600: Color::from_u32(0x16a34a),
474 c700: Color::from_u32(0x15803d),
475 c800: Color::from_u32(0x166534),
476 c900: Color::from_u32(0x14532d),
477 c950: Color::from_u32(0x052e16),
478};
479
480#[rustfmt::skip]
481/// <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>
482pub const EMERALD: Palette = Palette {
483 c50: Color::from_u32(0xecfdf5),
484 c100: Color::from_u32(0xd1fae5),
485 c200: Color::from_u32(0xa7f3d0),
486 c300: Color::from_u32(0x6ee7b7),
487 c400: Color::from_u32(0x34d399),
488 c500: Color::from_u32(0x10b981),
489 c600: Color::from_u32(0x059669),
490 c700: Color::from_u32(0x047857),
491 c800: Color::from_u32(0x065f46),
492 c900: Color::from_u32(0x064e3b),
493 c950: Color::from_u32(0x022c22),
494};
495
496#[rustfmt::skip]
497/// <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>
498pub const TEAL: Palette = Palette {
499 c50: Color::from_u32(0xf0fdfa),
500 c100: Color::from_u32(0xccfbf1),
501 c200: Color::from_u32(0x99f6e4),
502 c300: Color::from_u32(0x5eead4),
503 c400: Color::from_u32(0x2dd4bf),
504 c500: Color::from_u32(0x14b8a6),
505 c600: Color::from_u32(0x0d9488),
506 c700: Color::from_u32(0x0f766e),
507 c800: Color::from_u32(0x115e59),
508 c900: Color::from_u32(0x134e4a),
509 c950: Color::from_u32(0x042f2e),
510};
511
512#[rustfmt::skip]
513/// <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>
514pub const CYAN: Palette = Palette {
515 c50: Color::from_u32(0xecfeff),
516 c100: Color::from_u32(0xcffafe),
517 c200: Color::from_u32(0xa5f3fc),
518 c300: Color::from_u32(0x67e8f9),
519 c400: Color::from_u32(0x22d3ee),
520 c500: Color::from_u32(0x06b6d4),
521 c600: Color::from_u32(0x0891b2),
522 c700: Color::from_u32(0x0e7490),
523 c800: Color::from_u32(0x155e75),
524 c900: Color::from_u32(0x164e63),
525 c950: Color::from_u32(0x083344),
526};
527
528#[rustfmt::skip]
529/// <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>
530pub const SKY: Palette = Palette {
531 c50: Color::from_u32(0xf0f9ff),
532 c100: Color::from_u32(0xe0f2fe),
533 c200: Color::from_u32(0xbae6fd),
534 c300: Color::from_u32(0x7dd3fc),
535 c400: Color::from_u32(0x38bdf8),
536 c500: Color::from_u32(0x0ea5e9),
537 c600: Color::from_u32(0x0284c7),
538 c700: Color::from_u32(0x0369a1),
539 c800: Color::from_u32(0x075985),
540 c900: Color::from_u32(0x0c4a6e),
541 c950: Color::from_u32(0x082f49),
542};
543
544#[rustfmt::skip]
545/// <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>
546pub const BLUE: Palette = Palette {
547 c50: Color::from_u32(0xeff6ff),
548 c100: Color::from_u32(0xdbeafe),
549 c200: Color::from_u32(0xbfdbfe),
550 c300: Color::from_u32(0x93c5fd),
551 c400: Color::from_u32(0x60a5fa),
552 c500: Color::from_u32(0x3b82f6),
553 c600: Color::from_u32(0x2563eb),
554 c700: Color::from_u32(0x1d4ed8),
555 c800: Color::from_u32(0x1e40af),
556 c900: Color::from_u32(0x1e3a8a),
557 c950: Color::from_u32(0x172554),
558};
559
560#[rustfmt::skip]
561/// <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>
562pub const INDIGO: Palette = Palette {
563 c50: Color::from_u32(0xeef2ff),
564 c100: Color::from_u32(0xe0e7ff),
565 c200: Color::from_u32(0xc7d2fe),
566 c300: Color::from_u32(0xa5b4fc),
567 c400: Color::from_u32(0x818cf8),
568 c500: Color::from_u32(0x6366f1),
569 c600: Color::from_u32(0x4f46e5),
570 c700: Color::from_u32(0x4338ca),
571 c800: Color::from_u32(0x3730a3),
572 c900: Color::from_u32(0x312e81),
573 c950: Color::from_u32(0x1e1b4b),
574};
575
576#[rustfmt::skip]
577/// <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>
578pub const VIOLET: Palette = Palette {
579 c50: Color::from_u32(0xf5f3ff),
580 c100: Color::from_u32(0xede9fe),
581 c200: Color::from_u32(0xddd6fe),
582 c300: Color::from_u32(0xc4b5fd),
583 c400: Color::from_u32(0xa78bfa),
584 c500: Color::from_u32(0x8b5cf6),
585 c600: Color::from_u32(0x7c3aed),
586 c700: Color::from_u32(0x6d28d9),
587 c800: Color::from_u32(0x5b21b6),
588 c900: Color::from_u32(0x4c1d95),
589 c950: Color::from_u32(0x2e1065),
590};
591
592#[rustfmt::skip]
593/// <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>
594pub const PURPLE: Palette = Palette {
595 c50: Color::from_u32(0xfaf5ff),
596 c100: Color::from_u32(0xf3e8ff),
597 c200: Color::from_u32(0xe9d5ff),
598 c300: Color::from_u32(0xd8b4fe),
599 c400: Color::from_u32(0xc084fc),
600 c500: Color::from_u32(0xa855f7),
601 c600: Color::from_u32(0x9333ea),
602 c700: Color::from_u32(0x7e22ce),
603 c800: Color::from_u32(0x6b21a8),
604 c900: Color::from_u32(0x581c87),
605 c950: Color::from_u32(0x3b0764),
606};
607
608#[rustfmt::skip]
609/// <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>
610pub const FUCHSIA: Palette = Palette {
611 c50: Color::from_u32(0xfdf4ff),
612 c100: Color::from_u32(0xfae8ff),
613 c200: Color::from_u32(0xf5d0fe),
614 c300: Color::from_u32(0xf0abfc),
615 c400: Color::from_u32(0xe879f9),
616 c500: Color::from_u32(0xd946ef),
617 c600: Color::from_u32(0xc026d3),
618 c700: Color::from_u32(0xa21caf),
619 c800: Color::from_u32(0x86198f),
620 c900: Color::from_u32(0x701a75),
621 c950: Color::from_u32(0x4a044e),
622};
623
624#[rustfmt::skip]
625/// <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>
626pub const PINK: Palette = Palette {
627 c50: Color::from_u32(0xfdf2f8),
628 c100: Color::from_u32(0xfce7f3),
629 c200: Color::from_u32(0xfbcfe8),
630 c300: Color::from_u32(0xf9a8d4),
631 c400: Color::from_u32(0xf472b6),
632 c500: Color::from_u32(0xec4899),
633 c600: Color::from_u32(0xdb2777),
634 c700: Color::from_u32(0xbe185d),
635 c800: Color::from_u32(0x9d174d),
636 c900: Color::from_u32(0x831843),
637 c950: Color::from_u32(0x500724),
638};
639
640#[rustfmt::skip]
641/// <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>
642pub const ROSE: Palette = Palette {
643 c50: Color::from_u32(0xfff1f2),
644 c100: Color::from_u32(0xffe4e6),
645 c200: Color::from_u32(0xfecdd3),
646 c300: Color::from_u32(0xfda4af),
647 c400: Color::from_u32(0xfb7185),
648 c500: Color::from_u32(0xf43f5e),
649 c600: Color::from_u32(0xe11d48),
650 c700: Color::from_u32(0xbe123c),
651 c800: Color::from_u32(0x9f1239),
652 c900: Color::from_u32(0x881337),
653 c950: Color::from_u32(0x4c0519),
654};