From a811ddd80e415395079e6af0232e4fcb4ef9f02c Mon Sep 17 00:00:00 2001 From: Wolf Noble Date: Sun, 17 Dec 2023 14:05:46 -0600 Subject: [PATCH] :lipstick: update CSS Schemas to include TW3.3+ 950 color variants --- assets/css/schemes/avocado.css | 41 ++++++++++++++++++--------------- assets/css/schemes/cherry.css | 39 ++++++++++++++++--------------- assets/css/schemes/congo.css | 37 +++++++++++++++-------------- assets/css/schemes/fire.css | 39 ++++++++++++++++--------------- assets/css/schemes/ocean.css | 41 ++++++++++++++++++--------------- assets/css/schemes/sapphire.css | 37 +++++++++++++++-------------- assets/css/schemes/slate.css | 35 +++++++++++++++------------- 7 files changed, 145 insertions(+), 124 deletions(-) diff --git a/assets/css/schemes/avocado.css b/assets/css/schemes/avocado.css index 911e895d..ad68a094 100644 --- a/assets/css/schemes/avocado.css +++ b/assets/css/schemes/avocado.css @@ -2,36 +2,39 @@ :root { --color-neutral: 255, 255, 255; /* Stone */ - --color-neutral-50: 250, 250, 249; + --color-neutral-50: 250, 250, 249; --color-neutral-100: 245, 245, 244; --color-neutral-200: 231, 229, 228; --color-neutral-300: 214, 211, 209; --color-neutral-400: 168, 162, 158; --color-neutral-500: 120, 113, 108; - --color-neutral-600: 87, 83, 78; - --color-neutral-700: 68, 64, 60; - --color-neutral-800: 41, 37, 36; - --color-neutral-900: 28, 25, 23; + --color-neutral-600: 87, 83, 78; + --color-neutral-700: 68, 64, 60; + --color-neutral-800: 41, 37, 36; + --color-neutral-900: 28, 25, 23; + --color-neutral-950: 12, 10, 9; /* Lime */ - --color-primary-50: 247, 254, 231; + --color-primary-50: 247, 254, 231; --color-primary-100: 236, 252, 203; --color-primary-200: 217, 249, 157; --color-primary-300: 190, 242, 100; - --color-primary-400: 163, 230, 53; - --color-primary-500: 132, 204, 22; - --color-primary-600: 101, 163, 13; - --color-primary-700: 77, 124, 15; - --color-primary-800: 63, 98, 18; - --color-primary-900: 54, 83, 20; + --color-primary-400: 163, 230, 53; + --color-primary-500: 132, 204, 22; + --color-primary-600: 101, 163, 13; + --color-primary-700: 77, 124, 15; + --color-primary-800: 63, 98, 18; + --color-primary-900: 54, 83, 20; + --color-primary-950: 26, 46, 5; /* Emerald */ - --color-secondary-50: 236, 253, 245; + --color-secondary-50: 236, 253, 245; --color-secondary-100: 209, 250, 229; --color-secondary-200: 167, 243, 208; --color-secondary-300: 110, 231, 183; - --color-secondary-400: 52, 211, 153; - --color-secondary-500: 16, 185, 129; - --color-secondary-600: 5, 150, 105; - --color-secondary-700: 4, 120, 87; - --color-secondary-800: 6, 95, 70; - --color-secondary-900: 6, 78, 59; + --color-secondary-400: 52, 211, 153; + --color-secondary-500: 16, 185, 129; + --color-secondary-600: 5, 150, 105; + --color-secondary-700: 4, 120, 87; + --color-secondary-800: 6, 95, 70; + --color-secondary-900: 6, 78, 59; + --color-secondary-950: 2, 44, 34; } diff --git a/assets/css/schemes/cherry.css b/assets/css/schemes/cherry.css index 14567e6d..298e39e9 100644 --- a/assets/css/schemes/cherry.css +++ b/assets/css/schemes/cherry.css @@ -2,36 +2,39 @@ :root { --color-neutral: 255, 255, 255; /* Neutral */ - --color-neutral-50: 250, 250, 250; + --color-neutral-50: 250, 250, 250; --color-neutral-100: 245, 245, 245; --color-neutral-200: 229, 229, 229; --color-neutral-300: 212, 212, 212; --color-neutral-400: 163, 163, 163; --color-neutral-500: 115, 115, 115; - --color-neutral-600: 82, 82, 82; - --color-neutral-700: 64, 64, 64; - --color-neutral-800: 38, 38, 38; - --color-neutral-900: 23, 23, 23; + --color-neutral-600: 82, 82, 82; + --color-neutral-700: 64, 64, 64; + --color-neutral-800: 38, 38, 38; + --color-neutral-900: 23, 23, 23; + --color-neutral-950: 10, 10, 10; /* Rose */ - --color-primary-50: 255, 241, 242; + --color-primary-50: 255, 241, 242; --color-primary-100: 255, 228, 230; --color-primary-200: 254, 205, 211; --color-primary-300: 253, 164, 175; --color-primary-400: 251, 113, 133; - --color-primary-500: 244, 63, 94; - --color-primary-600: 225, 29, 72; - --color-primary-700: 190, 18, 60; - --color-primary-800: 159, 18, 57; - --color-primary-900: 136, 19, 55; + --color-primary-500: 244, 63, 94; + --color-primary-600: 225, 29, 72; + --color-primary-700: 190, 18, 60; + --color-primary-800: 159, 18, 57; + --color-primary-900: 136, 19, 55; + --color-primary-950: 76, 5, 25; /* Green */ - --color-secondary-50: 240, 253, 244; + --color-secondary-50: 240, 253, 244; --color-secondary-100: 220, 252, 231; --color-secondary-200: 187, 247, 208; --color-secondary-300: 134, 239, 172; - --color-secondary-400: 74, 222, 128; - --color-secondary-500: 34, 197, 94; - --color-secondary-600: 22, 163, 74; - --color-secondary-700: 21, 128, 61; - --color-secondary-800: 22, 101, 52; - --color-secondary-900: 20, 83, 45; + --color-secondary-400: 74, 222, 128; + --color-secondary-500: 34, 197, 94; + --color-secondary-600: 22, 163, 74; + --color-secondary-700: 21, 128, 61; + --color-secondary-800: 22, 101, 52; + --color-secondary-900: 20, 83, 45; + --color-secondary-950: 5, 46, 22; } diff --git a/assets/css/schemes/congo.css b/assets/css/schemes/congo.css index 375ef7b3..ed8cc6dd 100644 --- a/assets/css/schemes/congo.css +++ b/assets/css/schemes/congo.css @@ -2,36 +2,39 @@ :root { --color-neutral: 255, 255, 255; /* Gray */ - --color-neutral-50: 250, 250, 250; + --color-neutral-50: 250, 250, 250; --color-neutral-100: 244, 244, 245; --color-neutral-200: 228, 228, 231; --color-neutral-300: 212, 212, 216; --color-neutral-400: 161, 161, 170; --color-neutral-500: 113, 113, 122; - --color-neutral-600: 82, 82, 91; - --color-neutral-700: 63, 63, 70; - --color-neutral-800: 39, 39, 42; - --color-neutral-900: 24, 24, 27; + --color-neutral-600: 82, 82, 91; + --color-neutral-700: 63, 63, 70; + --color-neutral-800: 39, 39, 42; + --color-neutral-900: 24, 24, 27; + --color-neutral-950: 3, 7, 18; /* Violet */ - --color-primary-50: 245, 243, 255; + --color-primary-50: 245, 243, 255; --color-primary-100: 237, 233, 254; --color-primary-200: 221, 214, 254; --color-primary-300: 196, 181, 253; --color-primary-400: 167, 139, 250; - --color-primary-500: 139, 92, 246; - --color-primary-600: 124, 58, 237; - --color-primary-700: 109, 40, 217; - --color-primary-800: 91, 33, 182; - --color-primary-900: 76, 29, 149; + --color-primary-500: 139, 92, 246; + --color-primary-600: 124, 58, 237; + --color-primary-700: 109, 40, 217; + --color-primary-800: 91, 33, 182; + --color-primary-900: 76, 29, 149; + --color-primary-950: 46, 16, 101; /* Fuchsia */ - --color-secondary-50: 253, 244, 255; + --color-secondary-50: 253, 244, 255; --color-secondary-100: 250, 232, 255; --color-secondary-200: 245, 208, 254; --color-secondary-300: 240, 171, 252; --color-secondary-400: 232, 121, 249; - --color-secondary-500: 217, 70, 239; - --color-secondary-600: 192, 38, 211; - --color-secondary-700: 162, 28, 175; - --color-secondary-800: 134, 25, 143; - --color-secondary-900: 112, 26, 117; + --color-secondary-500: 217, 70, 239; + --color-secondary-600: 192, 38, 211; + --color-secondary-700: 162, 28, 175; + --color-secondary-800: 134, 25, 143; + --color-secondary-900: 112, 26, 117; + --color-secondary-950: 74, 4, 78; } diff --git a/assets/css/schemes/fire.css b/assets/css/schemes/fire.css index ed69d5cb..53bb3b82 100644 --- a/assets/css/schemes/fire.css +++ b/assets/css/schemes/fire.css @@ -2,36 +2,39 @@ :root { --color-neutral: 255, 255, 255; /* Stone */ - --color-neutral-50: 250, 250, 249; + --color-neutral-50: 250, 250, 249; --color-neutral-100: 245, 245, 244; --color-neutral-200: 231, 229, 228; --color-neutral-300: 214, 211, 209; --color-neutral-400: 168, 162, 158; --color-neutral-500: 120, 113, 108; - --color-neutral-600: 87, 83, 78; - --color-neutral-700: 68, 64, 60; - --color-neutral-800: 41, 37, 36; - --color-neutral-900: 28, 25, 23; + --color-neutral-600: 87, 83, 78; + --color-neutral-700: 68, 64, 60; + --color-neutral-800: 41, 37, 36; + --color-neutral-900: 28, 25, 23; + --color-neutral-950: 12, 10, 9; /* Orange */ - --color-primary-50: 255, 247, 237; + --color-primary-50: 255, 247, 237; --color-primary-100: 255, 237, 213; --color-primary-200: 254, 215, 170; --color-primary-300: 253, 186, 116; - --color-primary-400: 251, 146, 60; - --color-primary-500: 249, 115, 22; - --color-primary-600: 234, 88, 12; - --color-primary-700: 194, 65, 12; - --color-primary-800: 154, 52, 18; - --color-primary-900: 124, 45, 18; + --color-primary-400: 251, 146, 60; + --color-primary-500: 249, 115, 22; + --color-primary-600: 234, 88, 12; + --color-primary-700: 194, 65, 12; + --color-primary-800: 154, 52, 18; + --color-primary-900: 124, 45, 18; + --color-primary-950: 69, 10, 10; /* Rose */ - --color-secondary-50: 255, 241, 242; + --color-secondary-50: 255, 241, 242; --color-secondary-100: 255, 228, 230; --color-secondary-200: 254, 205, 211; --color-secondary-300: 253, 164, 175; --color-secondary-400: 251, 113, 133; - --color-secondary-500: 244, 63, 94; - --color-secondary-600: 225, 29, 72; - --color-secondary-700: 190, 18, 60; - --color-secondary-800: 159, 18, 57; - --color-secondary-900: 136, 19, 55; + --color-secondary-500: 244, 63, 94; + --color-secondary-600: 225, 29, 72; + --color-secondary-700: 190, 18, 60; + --color-secondary-800: 159, 18, 57; + --color-secondary-900: 136, 19, 55; + --color-secondary-950: 76, 5, 25; } diff --git a/assets/css/schemes/ocean.css b/assets/css/schemes/ocean.css index 1644570d..fda6b06d 100644 --- a/assets/css/schemes/ocean.css +++ b/assets/css/schemes/ocean.css @@ -2,36 +2,39 @@ :root { --color-neutral: 255, 255, 255; /* Slate */ - --color-neutral-50: 248, 250, 252; + --color-neutral-50: 248, 250, 252; --color-neutral-100: 241, 245, 249; --color-neutral-200: 226, 232, 240; --color-neutral-300: 203, 213, 225; --color-neutral-400: 148, 163, 184; --color-neutral-500: 100, 116, 139; - --color-neutral-600: 71, 85, 105; - --color-neutral-700: 51, 65, 85; - --color-neutral-800: 30, 41, 59; - --color-neutral-900: 15, 23, 42; + --color-neutral-600: 71, 85, 105; + --color-neutral-700: 51, 65, 85; + --color-neutral-800: 30, 41, 59; + --color-neutral-900: 15, 23, 42; + --color-neutral-950: 2, 6, 23; /* Blue */ - --color-primary-50: 239, 246, 255; + --color-primary-50: 239, 246, 255; --color-primary-100: 219, 234, 254; --color-primary-200: 191, 219, 254; --color-primary-300: 147, 197, 253; - --color-primary-400: 96, 165, 250; - --color-primary-500: 59, 130, 246; - --color-primary-600: 37, 99, 235; - --color-primary-700: 29, 78, 216; - --color-primary-800: 30, 64, 175; - --color-primary-900: 30, 58, 138; + --color-primary-400: 96, 165, 250; + --color-primary-500: 59, 130, 246; + --color-primary-600: 37, 99, 235; + --color-primary-700: 29, 78, 216; + --color-primary-800: 30, 64, 175; + --color-primary-900: 30, 58, 138; + --color-primary-950: 23, 37, 8; /* Cyan */ - --color-secondary-50: 236, 254, 255; + --color-secondary-50: 236, 254, 255; --color-secondary-100: 207, 250, 254; --color-secondary-200: 165, 243, 252; --color-secondary-300: 103, 232, 249; - --color-secondary-400: 34, 211, 238; - --color-secondary-500: 6, 182, 212; - --color-secondary-600: 8, 145, 178; - --color-secondary-700: 14, 116, 144; - --color-secondary-800: 21, 94, 117; - --color-secondary-900: 22, 78, 99; + --color-secondary-400: 34, 211, 238; + --color-secondary-500: 6, 182, 212; + --color-secondary-600: 8, 145, 178; + --color-secondary-700: 14, 116, 144; + --color-secondary-800: 21, 94, 117; + --color-secondary-900: 22, 78, 99; + --color-secondary-950: 8, 51, 69; } diff --git a/assets/css/schemes/sapphire.css b/assets/css/schemes/sapphire.css index fce9d916..76c7bf00 100644 --- a/assets/css/schemes/sapphire.css +++ b/assets/css/schemes/sapphire.css @@ -2,36 +2,39 @@ :root { --color-neutral: 255, 255, 255; /* Slate */ - --color-neutral-50: 248, 250, 252; + --color-neutral-50: 248, 250, 252; --color-neutral-100: 241, 245, 249; --color-neutral-200: 226, 232, 240; --color-neutral-300: 203, 213, 225; --color-neutral-400: 148, 163, 184; --color-neutral-500: 100, 116, 139; - --color-neutral-600: 71, 85, 105; - --color-neutral-700: 51, 65, 85; - --color-neutral-800: 30, 41, 59; - --color-neutral-900: 15, 23, 42; + --color-neutral-600: 71, 85, 105; + --color-neutral-700: 51, 65, 85; + --color-neutral-800: 30, 41, 59; + --color-neutral-900: 15, 23, 42; + --color-neutral-950: 10, 10, 10; /* Indigo */ - --color-primary-50: 238, 242, 255; + --color-primary-50: 238, 242, 255; --color-primary-100: 224, 231, 255; --color-primary-200: 199, 210, 254; --color-primary-300: 165, 180, 252; --color-primary-400: 129, 140, 248; - --color-primary-500: 99, 102, 241; - --color-primary-600: 79, 70, 229; - --color-primary-700: 67, 56, 202; - --color-primary-800: 55, 48, 163; - --color-primary-900: 49, 46, 129; + --color-primary-500: 99, 102, 241; + --color-primary-600: 79, 70, 229; + --color-primary-700: 67, 56, 202; + --color-primary-800: 55, 48, 163; + --color-primary-900: 49, 46, 129; + --color-primary-950: 30, 27, 75; /* Pink */ - --color-secondary-50: 253, 242, 248; + --color-secondary-50: 253, 242, 248; --color-secondary-100: 252, 231, 243; --color-secondary-200: 251, 207, 232; --color-secondary-300: 249, 168, 212; --color-secondary-400: 244, 114, 182; - --color-secondary-500: 236, 72, 153; - --color-secondary-600: 219, 39, 119; - --color-secondary-700: 190, 24, 93; - --color-secondary-800: 157, 23, 77; - --color-secondary-900: 131, 24, 67; + --color-secondary-500: 236, 72, 153; + --color-secondary-600: 219, 39, 119; + --color-secondary-700: 190, 24, 93; + --color-secondary-800: 157, 23, 77; + --color-secondary-900: 131, 24, 67; + --color-secondary-950: 80, 7, 36; } diff --git a/assets/css/schemes/slate.css b/assets/css/schemes/slate.css index 54831e86..e03a00ed 100644 --- a/assets/css/schemes/slate.css +++ b/assets/css/schemes/slate.css @@ -2,36 +2,39 @@ :root { --color-neutral: 255, 255, 255; /* Gray */ - --color-neutral-50: 249, 250, 251; + --color-neutral-50: 249, 250, 251; --color-neutral-100: 243, 244, 246; --color-neutral-200: 229, 231, 235; --color-neutral-300: 209, 213, 219; --color-neutral-400: 156, 163, 175; --color-neutral-500: 107, 114, 128; - --color-neutral-600: 75, 85, 99; - --color-neutral-700: 55, 65, 81; - --color-neutral-800: 31, 41, 55; - --color-neutral-900: 17, 24, 39; + --color-neutral-600: 75, 85, 99; + --color-neutral-700: 55, 65, 81; + --color-neutral-800: 31, 41, 55; + --color-neutral-900: 17, 24, 39; + --color-neutral-950: 17, 24, 39; /* Slate */ - --color-primary-50: 248, 250, 252; + --color-primary-50: 248, 250, 252; --color-primary-100: 241, 245, 249; --color-primary-200: 226, 232, 240; --color-primary-300: 203, 213, 225; --color-primary-400: 148, 163, 184; --color-primary-500: 100, 116, 139; - --color-primary-600: 71, 85, 105; - --color-primary-700: 51, 65, 85; - --color-primary-800: 30, 41, 59; - --color-primary-900: 15, 23, 42; - /* Gray */ - --color-secondary-50: 249, 250, 251; + --color-primary-600: 71, 85, 105; + --color-primary-700: 51, 65, 85; + --color-primary-800: 30, 41, 59; + --color-primary-900: 15, 23, 42; + --color-primary-950: 2, 6, 23; + /* Gray */ + --color-secondary-50: 249, 250, 251; --color-secondary-100: 243, 244, 246; --color-secondary-200: 229, 231, 235; --color-secondary-300: 209, 213, 219; --color-secondary-400: 156, 163, 175; --color-secondary-500: 107, 114, 128; - --color-secondary-600: 75, 85, 99; - --color-secondary-700: 55, 65, 81; - --color-secondary-800: 31, 41, 55; - --color-secondary-900: 17, 24, 39; + --color-secondary-600: 75, 85, 99; + --color-secondary-700: 55, 65, 81; + --color-secondary-800: 31, 41, 55; + --color-secondary-900: 17, 24, 39; + --color-secondary-950: 10, 10, 10; }