Mirrors/bevy
2
0
Fork 0
mirror of https://github.com/bevyengine/bevy synced 2024-11-21 20:23:28 +00:00
Code Issues Projects Releases Packages Wiki Activity

bevy_color: Add Tailwind palette (#12080)

Browse source 
# Objective

Give Bevy a well-designed built-in color palette for users to use while
prototyping or authoring Bevy examples.

## Solution

Generate
([playground](https://play.rust-lang.org/?version=stable&mode=debug&edition=2021&gist=f7b3a3002fb7727db15c1197e0a1a373),
[gist](https://gist.github.com/rust-play/f7b3a3002fb7727db15c1197e0a1a373))
consts from [Tailwind](https://tailwindcss.com/docs/customizing-colors)
(mit license) json.

## Discussion

Are there other popular alternatives we should be looking at? Something
new and fancy involving a really long acronym like CIELUVLCh? I'm not a
tailwind user or color expert, but I really like the way it's broken up
into distinct but plentiful hue and lightness groups.

It beats needing some shades of red, scrolling through the [current
palette](https://docs.rs/bevy/latest/bevy/prelude/enum.Color.html),
choosing a few of `CRIMSON`, `MAROON`, `RED`, `TOMATO` at random and
calling it a day.

The best information I was able to dig up about the Tailwind palette is
from this thread:
https://twitter.com/steveschoger/status/1303795136703410180. Here are
some key excerpts:

> Tried to the "perceptually uniform" thing for Tailwind UI. 
> Ultimately, it just resulted in a bunch of useless shades for colors
like yellow and green that are inherently brighter.

> With that said you're guaranteed to get a contrast ratio of 4.5:1 when
using any 700 shade (in some cases 600) on a 100 shade of the same hue.

> We just spent a lot of time looking at sites to figure out which
colors are popular and tried to fill all the gaps.
> Even the lime green is questionable but felt there needed to be
something in between the jump from yellow to green 😅

---------

Co-authored-by: Alice Cecile <alice.i.cecile@gmail.com>
This commit is contained in:
Rob Parrett 2024-03-18 11:06:07 -07:00 committed by GitHub
parent ac49dce4ca
commit 289a02cad6
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 537 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
crates/bevy_color/src/palettes/mod.rs
View file

@ -2,3 +2,4 @@
pub mod basic;
pub mod css;
pub mod tailwind;

536
crates/bevy_color/src/palettes/tailwind.rs Normal file
View file

@ -0,0 +1,536 @@
//! Colors from [Tailwind CSS](https://tailwindcss.com/docs/customizing-colors) (MIT License).
//! Grouped by hue with numeric lightness scale (50 is light, 950 is dark).
//!
//! Generated from Tailwind 3.4.1.
/*
MIT License
Copyright (c) Tailwind Labs, Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
*/
use crate::Srgba;
/// <div style="background-color:rgb(255, 251, 235); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_50: Srgba = Srgba::rgb(1.0, 0.9843137, 0.92156863);
/// <div style="background-color:rgb(254, 243, 199); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_100: Srgba = Srgba::rgb(0.99607843, 0.9529412, 0.78039217);
/// <div style="background-color:rgb(253, 230, 138); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_200: Srgba = Srgba::rgb(0.99215686, 0.9019608, 0.5411765);
/// <div style="background-color:rgb(252, 211, 77); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_300: Srgba = Srgba::rgb(0.9882353, 0.827451, 0.3019608);
/// <div style="background-color:rgb(251, 191, 36); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_400: Srgba = Srgba::rgb(0.9843137, 0.7490196, 0.14117648);
/// <div style="background-color:rgb(245, 158, 11); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_500: Srgba = Srgba::rgb(0.9607843, 0.61960787, 0.043137256);
/// <div style="background-color:rgb(217, 119, 6); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_600: Srgba = Srgba::rgb(0.8509804, 0.46666667, 0.023529412);
/// <div style="background-color:rgb(180, 83, 9); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_700: Srgba = Srgba::rgb(0.7058824, 0.3254902, 0.03529412);
/// <div style="background-color:rgb(146, 64, 14); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_800: Srgba = Srgba::rgb(0.57254905, 0.2509804, 0.05490196);
/// <div style="background-color:rgb(120, 53, 15); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_900: Srgba = Srgba::rgb(0.47058824, 0.20784314, 0.05882353);
/// <div style="background-color:rgb(69, 26, 3); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const AMBER_950: Srgba = Srgba::rgb(0.27058825, 0.101960786, 0.011764706);
/// <div style="background-color:rgb(239, 246, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_50: Srgba = Srgba::rgb(0.9372549, 0.9647059, 1.0);
/// <div style="background-color:rgb(219, 234, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_100: Srgba = Srgba::rgb(0.85882354, 0.91764706, 0.99607843);
/// <div style="background-color:rgb(191, 219, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_200: Srgba = Srgba::rgb(0.7490196, 0.85882354, 0.99607843);
/// <div style="background-color:rgb(147, 197, 253); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_300: Srgba = Srgba::rgb(0.5764706, 0.77254903, 0.99215686);
/// <div style="background-color:rgb(96, 165, 250); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_400: Srgba = Srgba::rgb(0.3764706, 0.64705884, 0.98039216);
/// <div style="background-color:rgb(59, 130, 246); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_500: Srgba = Srgba::rgb(0.23137255, 0.50980395, 0.9647059);
/// <div style="background-color:rgb(37, 99, 235); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_600: Srgba = Srgba::rgb(0.14509805, 0.3882353, 0.92156863);
/// <div style="background-color:rgb(29, 78, 216); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_700: Srgba = Srgba::rgb(0.11372549, 0.30588236, 0.84705883);
/// <div style="background-color:rgb(30, 64, 175); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_800: Srgba = Srgba::rgb(0.11764706, 0.2509804, 0.6862745);
/// <div style="background-color:rgb(30, 58, 138); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_900: Srgba = Srgba::rgb(0.11764706, 0.22745098, 0.5411765);
/// <div style="background-color:rgb(23, 37, 84); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const BLUE_950: Srgba = Srgba::rgb(0.09019608, 0.14509805, 0.32941177);
/// <div style="background-color:rgb(236, 254, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_50: Srgba = Srgba::rgb(0.9254902, 0.99607843, 1.0);
/// <div style="background-color:rgb(207, 250, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_100: Srgba = Srgba::rgb(0.8117647, 0.98039216, 0.99607843);
/// <div style="background-color:rgb(165, 243, 252); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_200: Srgba = Srgba::rgb(0.64705884, 0.9529412, 0.9882353);
/// <div style="background-color:rgb(103, 232, 249); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_300: Srgba = Srgba::rgb(0.40392157, 0.9098039, 0.9764706);
/// <div style="background-color:rgb(34, 211, 238); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_400: Srgba = Srgba::rgb(0.13333334, 0.827451, 0.93333334);
/// <div style="background-color:rgb(6, 182, 212); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_500: Srgba = Srgba::rgb(0.023529412, 0.7137255, 0.83137256);
/// <div style="background-color:rgb(8, 145, 178); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_600: Srgba = Srgba::rgb(0.03137255, 0.5686275, 0.69803923);
/// <div style="background-color:rgb(14, 116, 144); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_700: Srgba = Srgba::rgb(0.05490196, 0.45490196, 0.5647059);
/// <div style="background-color:rgb(21, 94, 117); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_800: Srgba = Srgba::rgb(0.08235294, 0.36862746, 0.45882353);
/// <div style="background-color:rgb(22, 78, 99); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_900: Srgba = Srgba::rgb(0.08627451, 0.30588236, 0.3882353);
/// <div style="background-color:rgb(8, 51, 68); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const CYAN_950: Srgba = Srgba::rgb(0.03137255, 0.2, 0.26666668);
/// <div style="background-color:rgb(236, 253, 245); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_50: Srgba = Srgba::rgb(0.9254902, 0.99215686, 0.9607843);
/// <div style="background-color:rgb(209, 250, 229); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_100: Srgba = Srgba::rgb(0.81960785, 0.98039216, 0.8980392);
/// <div style="background-color:rgb(167, 243, 208); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_200: Srgba = Srgba::rgb(0.654902, 0.9529412, 0.8156863);
/// <div style="background-color:rgb(110, 231, 183); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_300: Srgba = Srgba::rgb(0.43137255, 0.90588236, 0.7176471);
/// <div style="background-color:rgb(52, 211, 153); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_400: Srgba = Srgba::rgb(0.20392157, 0.827451, 0.6);
/// <div style="background-color:rgb(16, 185, 129); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_500: Srgba = Srgba::rgb(0.0627451, 0.7254902, 0.5058824);
/// <div style="background-color:rgb(5, 150, 105); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_600: Srgba = Srgba::rgb(0.019607844, 0.5882353, 0.4117647);
/// <div style="background-color:rgb(4, 120, 87); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_700: Srgba = Srgba::rgb(0.015686275, 0.47058824, 0.34117648);
/// <div style="background-color:rgb(6, 95, 70); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_800: Srgba = Srgba::rgb(0.023529412, 0.37254903, 0.27450982);
/// <div style="background-color:rgb(6, 78, 59); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_900: Srgba = Srgba::rgb(0.023529412, 0.30588236, 0.23137255);
/// <div style="background-color:rgb(2, 44, 34); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const EMERALD_950: Srgba = Srgba::rgb(0.007843138, 0.17254902, 0.13333334);
/// <div style="background-color:rgb(253, 244, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_50: Srgba = Srgba::rgb(0.99215686, 0.95686275, 1.0);
/// <div style="background-color:rgb(250, 232, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_100: Srgba = Srgba::rgb(0.98039216, 0.9098039, 1.0);
/// <div style="background-color:rgb(245, 208, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_200: Srgba = Srgba::rgb(0.9607843, 0.8156863, 0.99607843);
/// <div style="background-color:rgb(240, 171, 252); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_300: Srgba = Srgba::rgb(0.9411765, 0.67058825, 0.9882353);
/// <div style="background-color:rgb(232, 121, 249); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_400: Srgba = Srgba::rgb(0.9098039, 0.4745098, 0.9764706);
/// <div style="background-color:rgb(217, 70, 239); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_500: Srgba = Srgba::rgb(0.8509804, 0.27450982, 0.9372549);
/// <div style="background-color:rgb(192, 38, 211); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_600: Srgba = Srgba::rgb(0.7529412, 0.14901961, 0.827451);
/// <div style="background-color:rgb(162, 28, 175); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_700: Srgba = Srgba::rgb(0.63529414, 0.10980392, 0.6862745);
/// <div style="background-color:rgb(134, 25, 143); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_800: Srgba = Srgba::rgb(0.5254902, 0.09803922, 0.56078434);
/// <div style="background-color:rgb(112, 26, 117); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_900: Srgba = Srgba::rgb(0.4392157, 0.101960786, 0.45882353);
/// <div style="background-color:rgb(74, 4, 78); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const FUCHSIA_950: Srgba = Srgba::rgb(0.2901961, 0.015686275, 0.30588236);
/// <div style="background-color:rgb(249, 250, 251); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_50: Srgba = Srgba::rgb(0.9764706, 0.98039216, 0.9843137);
/// <div style="background-color:rgb(243, 244, 246); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_100: Srgba = Srgba::rgb(0.9529412, 0.95686275, 0.9647059);
/// <div style="background-color:rgb(229, 231, 235); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_200: Srgba = Srgba::rgb(0.8980392, 0.90588236, 0.92156863);
/// <div style="background-color:rgb(209, 213, 219); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_300: Srgba = Srgba::rgb(0.81960785, 0.8352941, 0.85882354);
/// <div style="background-color:rgb(156, 163, 175); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_400: Srgba = Srgba::rgb(0.6117647, 0.6392157, 0.6862745);
/// <div style="background-color:rgb(107, 114, 128); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_500: Srgba = Srgba::rgb(0.41960785, 0.44705883, 0.5019608);
/// <div style="background-color:rgb(75, 85, 99); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_600: Srgba = Srgba::rgb(0.29411766, 0.33333334, 0.3882353);
/// <div style="background-color:rgb(55, 65, 81); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_700: Srgba = Srgba::rgb(0.21568628, 0.25490198, 0.31764707);
/// <div style="background-color:rgb(31, 41, 55); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_800: Srgba = Srgba::rgb(0.12156863, 0.16078432, 0.21568628);
/// <div style="background-color:rgb(17, 24, 39); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_900: Srgba = Srgba::rgb(0.06666667, 0.09411765, 0.15294118);
/// <div style="background-color:rgb(3, 7, 18); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GRAY_950: Srgba = Srgba::rgb(0.011764706, 0.02745098, 0.07058824);
/// <div style="background-color:rgb(240, 253, 244); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_50: Srgba = Srgba::rgb(0.9411765, 0.99215686, 0.95686275);
/// <div style="background-color:rgb(220, 252, 231); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_100: Srgba = Srgba::rgb(0.8627451, 0.9882353, 0.90588236);
/// <div style="background-color:rgb(187, 247, 208); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_200: Srgba = Srgba::rgb(0.73333335, 0.96862745, 0.8156863);
/// <div style="background-color:rgb(134, 239, 172); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_300: Srgba = Srgba::rgb(0.5254902, 0.9372549, 0.6745098);
/// <div style="background-color:rgb(74, 222, 128); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_400: Srgba = Srgba::rgb(0.2901961, 0.87058824, 0.5019608);
/// <div style="background-color:rgb(34, 197, 94); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_500: Srgba = Srgba::rgb(0.13333334, 0.77254903, 0.36862746);
/// <div style="background-color:rgb(22, 163, 74); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_600: Srgba = Srgba::rgb(0.08627451, 0.6392157, 0.2901961);
/// <div style="background-color:rgb(21, 128, 61); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_700: Srgba = Srgba::rgb(0.08235294, 0.5019608, 0.23921569);
/// <div style="background-color:rgb(22, 101, 52); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_800: Srgba = Srgba::rgb(0.08627451, 0.39607844, 0.20392157);
/// <div style="background-color:rgb(20, 83, 45); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_900: Srgba = Srgba::rgb(0.078431375, 0.3254902, 0.1764706);
/// <div style="background-color:rgb(5, 46, 22); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const GREEN_950: Srgba = Srgba::rgb(0.019607844, 0.18039216, 0.08627451);
/// <div style="background-color:rgb(238, 242, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_50: Srgba = Srgba::rgb(0.93333334, 0.9490196, 1.0);
/// <div style="background-color:rgb(224, 231, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_100: Srgba = Srgba::rgb(0.8784314, 0.90588236, 1.0);
/// <div style="background-color:rgb(199, 210, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_200: Srgba = Srgba::rgb(0.78039217, 0.8235294, 0.99607843);
/// <div style="background-color:rgb(165, 180, 252); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_300: Srgba = Srgba::rgb(0.64705884, 0.7058824, 0.9882353);
/// <div style="background-color:rgb(129, 140, 248); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_400: Srgba = Srgba::rgb(0.5058824, 0.54901963, 0.972549);
/// <div style="background-color:rgb(99, 102, 241); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_500: Srgba = Srgba::rgb(0.3882353, 0.4, 0.94509804);
/// <div style="background-color:rgb(79, 70, 229); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_600: Srgba = Srgba::rgb(0.30980393, 0.27450982, 0.8980392);
/// <div style="background-color:rgb(67, 56, 202); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_700: Srgba = Srgba::rgb(0.2627451, 0.21960784, 0.7921569);
/// <div style="background-color:rgb(55, 48, 163); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_800: Srgba = Srgba::rgb(0.21568628, 0.1882353, 0.6392157);
/// <div style="background-color:rgb(49, 46, 129); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_900: Srgba = Srgba::rgb(0.19215687, 0.18039216, 0.5058824);
/// <div style="background-color:rgb(30, 27, 75); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const INDIGO_950: Srgba = Srgba::rgb(0.11764706, 0.105882354, 0.29411766);
/// <div style="background-color:rgb(247, 254, 231); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_50: Srgba = Srgba::rgb(0.96862745, 0.99607843, 0.90588236);
/// <div style="background-color:rgb(236, 252, 203); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_100: Srgba = Srgba::rgb(0.9254902, 0.9882353, 0.79607844);
/// <div style="background-color:rgb(217, 249, 157); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_200: Srgba = Srgba::rgb(0.8509804, 0.9764706, 0.6156863);
/// <div style="background-color:rgb(190, 242, 100); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_300: Srgba = Srgba::rgb(0.74509805, 0.9490196, 0.39215687);
/// <div style="background-color:rgb(163, 230, 53); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_400: Srgba = Srgba::rgb(0.6392157, 0.9019608, 0.20784314);
/// <div style="background-color:rgb(132, 204, 22); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_500: Srgba = Srgba::rgb(0.5176471, 0.8, 0.08627451);
/// <div style="background-color:rgb(101, 163, 13); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_600: Srgba = Srgba::rgb(0.39607844, 0.6392157, 0.050980393);
/// <div style="background-color:rgb(77, 124, 15); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_700: Srgba = Srgba::rgb(0.3019608, 0.4862745, 0.05882353);
/// <div style="background-color:rgb(63, 98, 18); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_800: Srgba = Srgba::rgb(0.24705882, 0.38431373, 0.07058824);
/// <div style="background-color:rgb(54, 83, 20); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_900: Srgba = Srgba::rgb(0.21176471, 0.3254902, 0.078431375);
/// <div style="background-color:rgb(26, 46, 5); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const LIME_950: Srgba = Srgba::rgb(0.101960786, 0.18039216, 0.019607844);
/// <div style="background-color:rgb(250, 250, 250); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_50: Srgba = Srgba::rgb(0.98039216, 0.98039216, 0.98039216);
/// <div style="background-color:rgb(245, 245, 245); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_100: Srgba = Srgba::rgb(0.9607843, 0.9607843, 0.9607843);
/// <div style="background-color:rgb(229, 229, 229); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_200: Srgba = Srgba::rgb(0.8980392, 0.8980392, 0.8980392);
/// <div style="background-color:rgb(212, 212, 212); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_300: Srgba = Srgba::rgb(0.83137256, 0.83137256, 0.83137256);
/// <div style="background-color:rgb(163, 163, 163); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_400: Srgba = Srgba::rgb(0.6392157, 0.6392157, 0.6392157);
/// <div style="background-color:rgb(115, 115, 115); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_500: Srgba = Srgba::rgb(0.4509804, 0.4509804, 0.4509804);
/// <div style="background-color:rgb(82, 82, 82); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_600: Srgba = Srgba::rgb(0.32156864, 0.32156864, 0.32156864);
/// <div style="background-color:rgb(64, 64, 64); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_700: Srgba = Srgba::rgb(0.2509804, 0.2509804, 0.2509804);
/// <div style="background-color:rgb(38, 38, 38); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_800: Srgba = Srgba::rgb(0.14901961, 0.14901961, 0.14901961);
/// <div style="background-color:rgb(23, 23, 23); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_900: Srgba = Srgba::rgb(0.09019608, 0.09019608, 0.09019608);
/// <div style="background-color:rgb(10, 10, 10); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const NEUTRAL_950: Srgba = Srgba::rgb(0.039215688, 0.039215688, 0.039215688);
/// <div style="background-color:rgb(255, 247, 237); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_50: Srgba = Srgba::rgb(1.0, 0.96862745, 0.92941177);
/// <div style="background-color:rgb(255, 237, 213); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_100: Srgba = Srgba::rgb(1.0, 0.92941177, 0.8352941);
/// <div style="background-color:rgb(254, 215, 170); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_200: Srgba = Srgba::rgb(0.99607843, 0.84313726, 0.6666667);
/// <div style="background-color:rgb(253, 186, 116); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_300: Srgba = Srgba::rgb(0.99215686, 0.7294118, 0.45490196);
/// <div style="background-color:rgb(251, 146, 60); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_400: Srgba = Srgba::rgb(0.9843137, 0.57254905, 0.23529412);
/// <div style="background-color:rgb(249, 115, 22); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_500: Srgba = Srgba::rgb(0.9764706, 0.4509804, 0.08627451);
/// <div style="background-color:rgb(234, 88, 12); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_600: Srgba = Srgba::rgb(0.91764706, 0.34509805, 0.047058824);
/// <div style="background-color:rgb(194, 65, 12); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_700: Srgba = Srgba::rgb(0.7607843, 0.25490198, 0.047058824);
/// <div style="background-color:rgb(154, 52, 18); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_800: Srgba = Srgba::rgb(0.6039216, 0.20392157, 0.07058824);
/// <div style="background-color:rgb(124, 45, 18); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_900: Srgba = Srgba::rgb(0.4862745, 0.1764706, 0.07058824);
/// <div style="background-color:rgb(67, 20, 7); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ORANGE_950: Srgba = Srgba::rgb(0.2627451, 0.078431375, 0.02745098);
/// <div style="background-color:rgb(253, 242, 248); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_50: Srgba = Srgba::rgb(0.99215686, 0.9490196, 0.972549);
/// <div style="background-color:rgb(252, 231, 243); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_100: Srgba = Srgba::rgb(0.9882353, 0.90588236, 0.9529412);
/// <div style="background-color:rgb(251, 207, 232); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_200: Srgba = Srgba::rgb(0.9843137, 0.8117647, 0.9098039);
/// <div style="background-color:rgb(249, 168, 212); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_300: Srgba = Srgba::rgb(0.9764706, 0.65882355, 0.83137256);
/// <div style="background-color:rgb(244, 114, 182); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_400: Srgba = Srgba::rgb(0.95686275, 0.44705883, 0.7137255);
/// <div style="background-color:rgb(236, 72, 153); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_500: Srgba = Srgba::rgb(0.9254902, 0.28235295, 0.6);
/// <div style="background-color:rgb(219, 39, 119); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_600: Srgba = Srgba::rgb(0.85882354, 0.15294118, 0.46666667);
/// <div style="background-color:rgb(190, 24, 93); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_700: Srgba = Srgba::rgb(0.74509805, 0.09411765, 0.3647059);
/// <div style="background-color:rgb(157, 23, 77); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_800: Srgba = Srgba::rgb(0.6156863, 0.09019608, 0.3019608);
/// <div style="background-color:rgb(131, 24, 67); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_900: Srgba = Srgba::rgb(0.5137255, 0.09411765, 0.2627451);
/// <div style="background-color:rgb(80, 7, 36); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PINK_950: Srgba = Srgba::rgb(0.3137255, 0.02745098, 0.14117648);
/// <div style="background-color:rgb(250, 245, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_50: Srgba = Srgba::rgb(0.98039216, 0.9607843, 1.0);
/// <div style="background-color:rgb(243, 232, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_100: Srgba = Srgba::rgb(0.9529412, 0.9098039, 1.0);
/// <div style="background-color:rgb(233, 213, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_200: Srgba = Srgba::rgb(0.9137255, 0.8352941, 1.0);
/// <div style="background-color:rgb(216, 180, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_300: Srgba = Srgba::rgb(0.84705883, 0.7058824, 0.99607843);
/// <div style="background-color:rgb(192, 132, 252); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_400: Srgba = Srgba::rgb(0.7529412, 0.5176471, 0.9882353);
/// <div style="background-color:rgb(168, 85, 247); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_500: Srgba = Srgba::rgb(0.65882355, 0.33333334, 0.96862745);
/// <div style="background-color:rgb(147, 51, 234); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_600: Srgba = Srgba::rgb(0.5764706, 0.2, 0.91764706);
/// <div style="background-color:rgb(126, 34, 206); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_700: Srgba = Srgba::rgb(0.49411765, 0.13333334, 0.80784315);
/// <div style="background-color:rgb(107, 33, 168); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_800: Srgba = Srgba::rgb(0.41960785, 0.12941177, 0.65882355);
/// <div style="background-color:rgb(88, 28, 135); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_900: Srgba = Srgba::rgb(0.34509805, 0.10980392, 0.5294118);
/// <div style="background-color:rgb(59, 7, 100); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const PURPLE_950: Srgba = Srgba::rgb(0.23137255, 0.02745098, 0.39215687);
/// <div style="background-color:rgb(254, 242, 242); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_50: Srgba = Srgba::rgb(0.99607843, 0.9490196, 0.9490196);
/// <div style="background-color:rgb(254, 226, 226); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_100: Srgba = Srgba::rgb(0.99607843, 0.8862745, 0.8862745);
/// <div style="background-color:rgb(254, 202, 202); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_200: Srgba = Srgba::rgb(0.99607843, 0.7921569, 0.7921569);
/// <div style="background-color:rgb(252, 165, 165); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_300: Srgba = Srgba::rgb(0.9882353, 0.64705884, 0.64705884);
/// <div style="background-color:rgb(248, 113, 113); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_400: Srgba = Srgba::rgb(0.972549, 0.44313726, 0.44313726);
/// <div style="background-color:rgb(239, 68, 68); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_500: Srgba = Srgba::rgb(0.9372549, 0.26666668, 0.26666668);
/// <div style="background-color:rgb(220, 38, 38); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_600: Srgba = Srgba::rgb(0.8627451, 0.14901961, 0.14901961);
/// <div style="background-color:rgb(185, 28, 28); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_700: Srgba = Srgba::rgb(0.7254902, 0.10980392, 0.10980392);
/// <div style="background-color:rgb(153, 27, 27); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_800: Srgba = Srgba::rgb(0.6, 0.105882354, 0.105882354);
/// <div style="background-color:rgb(127, 29, 29); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_900: Srgba = Srgba::rgb(0.49803922, 0.11372549, 0.11372549);
/// <div style="background-color:rgb(69, 10, 10); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const RED_950: Srgba = Srgba::rgb(0.27058825, 0.039215688, 0.039215688);
/// <div style="background-color:rgb(255, 241, 242); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_50: Srgba = Srgba::rgb(1.0, 0.94509804, 0.9490196);
/// <div style="background-color:rgb(255, 228, 230); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_100: Srgba = Srgba::rgb(1.0, 0.89411765, 0.9019608);
/// <div style="background-color:rgb(254, 205, 211); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_200: Srgba = Srgba::rgb(0.99607843, 0.8039216, 0.827451);
/// <div style="background-color:rgb(253, 164, 175); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_300: Srgba = Srgba::rgb(0.99215686, 0.6431373, 0.6862745);
/// <div style="background-color:rgb(251, 113, 133); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_400: Srgba = Srgba::rgb(0.9843137, 0.44313726, 0.52156866);
/// <div style="background-color:rgb(244, 63, 94); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_500: Srgba = Srgba::rgb(0.95686275, 0.24705882, 0.36862746);
/// <div style="background-color:rgb(225, 29, 72); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_600: Srgba = Srgba::rgb(0.88235295, 0.11372549, 0.28235295);
/// <div style="background-color:rgb(190, 18, 60); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_700: Srgba = Srgba::rgb(0.74509805, 0.07058824, 0.23529412);
/// <div style="background-color:rgb(159, 18, 57); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_800: Srgba = Srgba::rgb(0.62352943, 0.07058824, 0.22352941);
/// <div style="background-color:rgb(136, 19, 55); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_900: Srgba = Srgba::rgb(0.53333336, 0.07450981, 0.21568628);
/// <div style="background-color:rgb(76, 5, 25); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ROSE_950: Srgba = Srgba::rgb(0.29803923, 0.019607844, 0.09803922);
/// <div style="background-color:rgb(240, 249, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_50: Srgba = Srgba::rgb(0.9411765, 0.9764706, 1.0);
/// <div style="background-color:rgb(224, 242, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_100: Srgba = Srgba::rgb(0.8784314, 0.9490196, 0.99607843);
/// <div style="background-color:rgb(186, 230, 253); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_200: Srgba = Srgba::rgb(0.7294118, 0.9019608, 0.99215686);
/// <div style="background-color:rgb(125, 211, 252); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_300: Srgba = Srgba::rgb(0.49019608, 0.827451, 0.9882353);
/// <div style="background-color:rgb(56, 189, 248); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_400: Srgba = Srgba::rgb(0.21960784, 0.7411765, 0.972549);
/// <div style="background-color:rgb(14, 165, 233); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_500: Srgba = Srgba::rgb(0.05490196, 0.64705884, 0.9137255);
/// <div style="background-color:rgb(2, 132, 199); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_600: Srgba = Srgba::rgb(0.007843138, 0.5176471, 0.78039217);
/// <div style="background-color:rgb(3, 105, 161); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_700: Srgba = Srgba::rgb(0.011764706, 0.4117647, 0.6313726);
/// <div style="background-color:rgb(7, 89, 133); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_800: Srgba = Srgba::rgb(0.02745098, 0.34901962, 0.52156866);
/// <div style="background-color:rgb(12, 74, 110); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_900: Srgba = Srgba::rgb(0.047058824, 0.2901961, 0.43137255);
/// <div style="background-color:rgb(8, 47, 73); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SKY_950: Srgba = Srgba::rgb(0.03137255, 0.18431373, 0.28627452);
/// <div style="background-color:rgb(248, 250, 252); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_50: Srgba = Srgba::rgb(0.972549, 0.98039216, 0.9882353);
/// <div style="background-color:rgb(241, 245, 249); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_100: Srgba = Srgba::rgb(0.94509804, 0.9607843, 0.9764706);
/// <div style="background-color:rgb(226, 232, 240); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_200: Srgba = Srgba::rgb(0.8862745, 0.9098039, 0.9411765);
/// <div style="background-color:rgb(203, 213, 225); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_300: Srgba = Srgba::rgb(0.79607844, 0.8352941, 0.88235295);
/// <div style="background-color:rgb(148, 163, 184); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_400: Srgba = Srgba::rgb(0.5803922, 0.6392157, 0.72156864);
/// <div style="background-color:rgb(100, 116, 139); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_500: Srgba = Srgba::rgb(0.39215687, 0.45490196, 0.54509807);
/// <div style="background-color:rgb(71, 85, 105); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_600: Srgba = Srgba::rgb(0.2784314, 0.33333334, 0.4117647);
/// <div style="background-color:rgb(51, 65, 85); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_700: Srgba = Srgba::rgb(0.2, 0.25490198, 0.33333334);
/// <div style="background-color:rgb(30, 41, 59); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_800: Srgba = Srgba::rgb(0.11764706, 0.16078432, 0.23137255);
/// <div style="background-color:rgb(15, 23, 42); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_900: Srgba = Srgba::rgb(0.05882353, 0.09019608, 0.16470589);
/// <div style="background-color:rgb(2, 6, 23); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const SLATE_950: Srgba = Srgba::rgb(0.007843138, 0.023529412, 0.09019608);
/// <div style="background-color:rgb(250, 250, 249); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_50: Srgba = Srgba::rgb(0.98039216, 0.98039216, 0.9764706);
/// <div style="background-color:rgb(245, 245, 244); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_100: Srgba = Srgba::rgb(0.9607843, 0.9607843, 0.95686275);
/// <div style="background-color:rgb(231, 229, 228); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_200: Srgba = Srgba::rgb(0.90588236, 0.8980392, 0.89411765);
/// <div style="background-color:rgb(214, 211, 209); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_300: Srgba = Srgba::rgb(0.8392157, 0.827451, 0.81960785);
/// <div style="background-color:rgb(168, 162, 158); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_400: Srgba = Srgba::rgb(0.65882355, 0.63529414, 0.61960787);
/// <div style="background-color:rgb(120, 113, 108); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_500: Srgba = Srgba::rgb(0.47058824, 0.44313726, 0.42352942);
/// <div style="background-color:rgb(87, 83, 78); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_600: Srgba = Srgba::rgb(0.34117648, 0.3254902, 0.30588236);
/// <div style="background-color:rgb(68, 64, 60); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_700: Srgba = Srgba::rgb(0.26666668, 0.2509804, 0.23529412);
/// <div style="background-color:rgb(41, 37, 36); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_800: Srgba = Srgba::rgb(0.16078432, 0.14509805, 0.14117648);
/// <div style="background-color:rgb(28, 25, 23); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_900: Srgba = Srgba::rgb(0.10980392, 0.09803922, 0.09019608);
/// <div style="background-color:rgb(12, 10, 9); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const STONE_950: Srgba = Srgba::rgb(0.047058824, 0.039215688, 0.03529412);
/// <div style="background-color:rgb(240, 253, 250); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_50: Srgba = Srgba::rgb(0.9411765, 0.99215686, 0.98039216);
/// <div style="background-color:rgb(204, 251, 241); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_100: Srgba = Srgba::rgb(0.8, 0.9843137, 0.94509804);
/// <div style="background-color:rgb(153, 246, 228); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_200: Srgba = Srgba::rgb(0.6, 0.9647059, 0.89411765);
/// <div style="background-color:rgb(94, 234, 212); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_300: Srgba = Srgba::rgb(0.36862746, 0.91764706, 0.83137256);
/// <div style="background-color:rgb(45, 212, 191); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_400: Srgba = Srgba::rgb(0.1764706, 0.83137256, 0.7490196);
/// <div style="background-color:rgb(20, 184, 166); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_500: Srgba = Srgba::rgb(0.078431375, 0.72156864, 0.6509804);
/// <div style="background-color:rgb(13, 148, 136); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_600: Srgba = Srgba::rgb(0.050980393, 0.5803922, 0.53333336);
/// <div style="background-color:rgb(15, 118, 110); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_700: Srgba = Srgba::rgb(0.05882353, 0.4627451, 0.43137255);
/// <div style="background-color:rgb(17, 94, 89); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_800: Srgba = Srgba::rgb(0.06666667, 0.36862746, 0.34901962);
/// <div style="background-color:rgb(19, 78, 74); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_900: Srgba = Srgba::rgb(0.07450981, 0.30588236, 0.2901961);
/// <div style="background-color:rgb(4, 47, 46); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const TEAL_950: Srgba = Srgba::rgb(0.015686275, 0.18431373, 0.18039216);
/// <div style="background-color:rgb(245, 243, 255); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_50: Srgba = Srgba::rgb(0.9607843, 0.9529412, 1.0);
/// <div style="background-color:rgb(237, 233, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_100: Srgba = Srgba::rgb(0.92941177, 0.9137255, 0.99607843);
/// <div style="background-color:rgb(221, 214, 254); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_200: Srgba = Srgba::rgb(0.8666667, 0.8392157, 0.99607843);
/// <div style="background-color:rgb(196, 181, 253); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_300: Srgba = Srgba::rgb(0.76862746, 0.70980394, 0.99215686);
/// <div style="background-color:rgb(167, 139, 250); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_400: Srgba = Srgba::rgb(0.654902, 0.54509807, 0.98039216);
/// <div style="background-color:rgb(139, 92, 246); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_500: Srgba = Srgba::rgb(0.54509807, 0.36078432, 0.9647059);
/// <div style="background-color:rgb(124, 58, 237); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_600: Srgba = Srgba::rgb(0.4862745, 0.22745098, 0.92941177);
/// <div style="background-color:rgb(109, 40, 217); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_700: Srgba = Srgba::rgb(0.42745098, 0.15686275, 0.8509804);
/// <div style="background-color:rgb(91, 33, 182); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_800: Srgba = Srgba::rgb(0.35686275, 0.12941177, 0.7137255);
/// <div style="background-color:rgb(76, 29, 149); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_900: Srgba = Srgba::rgb(0.29803923, 0.11372549, 0.58431375);
/// <div style="background-color:rgb(46, 16, 101); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const VIOLET_950: Srgba = Srgba::rgb(0.18039216, 0.0627451, 0.39607844);
/// <div style="background-color:rgb(254, 252, 232); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_50: Srgba = Srgba::rgb(0.99607843, 0.9882353, 0.9098039);
/// <div style="background-color:rgb(254, 249, 195); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_100: Srgba = Srgba::rgb(0.99607843, 0.9764706, 0.7647059);
/// <div style="background-color:rgb(254, 240, 138); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_200: Srgba = Srgba::rgb(0.99607843, 0.9411765, 0.5411765);
/// <div style="background-color:rgb(253, 224, 71); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_300: Srgba = Srgba::rgb(0.99215686, 0.8784314, 0.2784314);
/// <div style="background-color:rgb(250, 204, 21); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_400: Srgba = Srgba::rgb(0.98039216, 0.8, 0.08235294);
/// <div style="background-color:rgb(234, 179, 8); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_500: Srgba = Srgba::rgb(0.91764706, 0.7019608, 0.03137255);
/// <div style="background-color:rgb(202, 138, 4); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_600: Srgba = Srgba::rgb(0.7921569, 0.5411765, 0.015686275);
/// <div style="background-color:rgb(161, 98, 7); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_700: Srgba = Srgba::rgb(0.6313726, 0.38431373, 0.02745098);
/// <div style="background-color:rgb(133, 77, 14); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_800: Srgba = Srgba::rgb(0.52156866, 0.3019608, 0.05490196);
/// <div style="background-color:rgb(113, 63, 18); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_900: Srgba = Srgba::rgb(0.44313726, 0.24705882, 0.07058824);
/// <div style="background-color:rgb(66, 32, 6); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const YELLOW_950: Srgba = Srgba::rgb(0.25882354, 0.1254902, 0.023529412);
/// <div style="background-color:rgb(250, 250, 250); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_50: Srgba = Srgba::rgb(0.98039216, 0.98039216, 0.98039216);
/// <div style="background-color:rgb(244, 244, 245); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_100: Srgba = Srgba::rgb(0.95686275, 0.95686275, 0.9607843);
/// <div style="background-color:rgb(228, 228, 231); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_200: Srgba = Srgba::rgb(0.89411765, 0.89411765, 0.90588236);
/// <div style="background-color:rgb(212, 212, 216); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_300: Srgba = Srgba::rgb(0.83137256, 0.83137256, 0.84705883);
/// <div style="background-color:rgb(161, 161, 170); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_400: Srgba = Srgba::rgb(0.6313726, 0.6313726, 0.6666667);
/// <div style="background-color:rgb(113, 113, 122); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_500: Srgba = Srgba::rgb(0.44313726, 0.44313726, 0.47843137);
/// <div style="background-color:rgb(82, 82, 91); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_600: Srgba = Srgba::rgb(0.32156864, 0.32156864, 0.35686275);
/// <div style="background-color:rgb(63, 63, 70); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_700: Srgba = Srgba::rgb(0.24705882, 0.24705882, 0.27450982);
/// <div style="background-color:rgb(39, 39, 42); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_800: Srgba = Srgba::rgb(0.15294118, 0.15294118, 0.16470589);
/// <div style="background-color:rgb(24, 24, 27); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_900: Srgba = Srgba::rgb(0.09411765, 0.09411765, 0.105882354);
/// <div style="background-color:rgb(9, 9, 11); width: 10px; padding: 10px; border: 1px solid;"></div>
pub const ZINC_950: Srgba = Srgba::rgb(0.03529412, 0.03529412, 0.043137256);