From a24cac4c7278557c743c63ae0fc5690a841d760e Mon Sep 17 00:00:00 2001 From: Adam Argyle Date: Mon, 4 Dec 2023 21:52:12 -0800 Subject: [PATCH] chore --- css/color/blue.hex.css | 28 +- css/color/blue.hsl.css | 28 +- css/color/brown.hex.css | 28 +- css/color/brown.hsl.css | 28 +- css/color/camo.hex.css | 28 +- css/color/camo.hsl.css | 28 +- css/color/choco.hex.css | 28 +- css/color/choco.hsl.css | 28 +- css/color/colors.hex.css | 249 ------------------ css/color/colors.hsl.css | 249 ------------------ css/color/cyan.hex.css | 28 +- css/color/cyan.hsl.css | 28 +- css/color/gray.hex.css | 28 +- css/color/gray.hsl.css | 28 +- css/color/green.hex.css | 28 +- css/color/green.hsl.css | 28 +- css/color/indigo.hex.css | 28 +- css/color/indigo.hsl.css | 28 +- css/color/jungle.hex.css | 28 +- css/color/jungle.hsl.css | 28 +- css/color/lime.hex.css | 28 +- css/color/lime.hsl.css | 28 +- css/color/neon.p3.css | 30 +++ css/color/orange.hex.css | 28 +- css/color/orange.hsl.css | 28 +- css/color/pink.hex.css | 28 +- css/color/pink.hsl.css | 28 +- css/color/purple.hex.css | 28 +- css/color/purple.hsl.css | 28 +- css/color/red.hex.css | 28 +- css/color/red.hsl.css | 28 +- css/color/sand.hex.css | 28 +- css/color/sand.hsl.css | 28 +- css/color/stone.hex.css | 28 +- css/color/stone.hsl.css | 28 +- css/color/teal.hex.css | 28 +- css/color/teal.hsl.css | 28 +- css/color/violet.hex.css | 28 +- css/color/violet.hsl.css | 28 +- css/color/yellow.hex.css | 28 +- css/color/yellow.hsl.css | 28 +- .../inline-writing-mode-switch.css | 2 +- css/masks/corner-cuts.css | 77 ++++-- css/masks/edges.css | 197 ++++++++------ css/masks/grunge.css | 0 css/packs/focus-highlight.css | 2 +- css/packs/layouts.css | 2 +- css/packs/utilities/index.css | 13 +- css/packs/utilities/vanilla.css | 6 +- css/svg/squircles.css | 2 +- css/z-index.css | 4 +- js/svg/noises.js | 5 + package.json | 35 +-- 53 files changed, 779 insertions(+), 1158 deletions(-) delete mode 100644 css/color/colors.hex.css delete mode 100644 css/color/colors.hsl.css create mode 100644 css/color/neon.p3.css create mode 100644 css/masks/grunge.css diff --git a/css/color/blue.hex.css b/css/color/blue.hex.css index 925e31c0..d73966e6 100644 --- a/css/color/blue.hex.css +++ b/css/color/blue.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --blue-0: #e7f5ff; - --blue-1: #d0ebff; - --blue-2: #a5d8ff; - --blue-3: #74c0fc; - --blue-4: #4dabf7; - --blue-5: #339af0; - --blue-6: #228be6; - --blue-7: #1c7ed6; - --blue-8: #1971c2; - --blue-9: #1864ab; - --blue-10: #145591; - --blue-11: #114678; - --blue-12: #0d375e; +:where(:root) { + --blue-0: #e7f5ff; + --blue-1: #d0ebff; + --blue-2: #a5d8ff; + --blue-3: #74c0fc; + --blue-4: #4dabf7; + --blue-5: #339af0; + --blue-6: #228be6; + --blue-7: #1c7ed6; + --blue-8: #1971c2; + --blue-9: #1864ab; + --blue-10: #145591; + --blue-11: #114678; + --blue-12: #0d375e; } diff --git a/css/color/blue.hsl.css b/css/color/blue.hsl.css index 55515b90..3c6f7305 100644 --- a/css/color/blue.hsl.css +++ b/css/color/blue.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --blue-0-hsl: 205 100% 95%; - --blue-1-hsl: 206 100% 91%; - --blue-2-hsl: 206 100% 82%; - --blue-3-hsl: 206 96% 72%; - --blue-4-hsl: 207 91% 64%; - --blue-5-hsl: 207 86% 57%; - --blue-6-hsl: 208 80% 52%; - --blue-7-hsl: 208 77% 47%; - --blue-8-hsl: 209 77% 43%; - --blue-9-hsl: 209 75% 38%; - --blue-10-hsl: 209 76% 32%; - --blue-11-hsl: 209 75% 27%; - --blue-12-hsl: 209 76% 21%; +:where(:root) { + --blue-0-hsl: 205 100% 95%; + --blue-1-hsl: 206 100% 91%; + --blue-2-hsl: 206 100% 82%; + --blue-3-hsl: 206 96% 72%; + --blue-4-hsl: 207 91% 64%; + --blue-5-hsl: 207 86% 57%; + --blue-6-hsl: 208 80% 52%; + --blue-7-hsl: 208 77% 47%; + --blue-8-hsl: 209 77% 43%; + --blue-9-hsl: 209 75% 38%; + --blue-10-hsl: 209 76% 32%; + --blue-11-hsl: 209 75% 27%; + --blue-12-hsl: 209 76% 21%; } diff --git a/css/color/brown.hex.css b/css/color/brown.hex.css index a27ad5be..75a0a078 100644 --- a/css/color/brown.hex.css +++ b/css/color/brown.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --brown-0: #faf4eb; - --brown-1: #ede0d1; - --brown-2: #e0cab7; - --brown-3: #d3b79e; - --brown-4: #c5a285; - --brown-5: #b78f6d; - --brown-6: #a87c56; - --brown-7: #956b47; - --brown-8: #825b3a; - --brown-9: #6f4b2d; - --brown-10: #5e3a21; - --brown-11: #4e2b15; - --brown-12: #422412; +:where(:root) { + --brown-0: #faf4eb; + --brown-1: #ede0d1; + --brown-2: #e0cab7; + --brown-3: #d3b79e; + --brown-4: #c5a285; + --brown-5: #b78f6d; + --brown-6: #a87c56; + --brown-7: #956b47; + --brown-8: #825b3a; + --brown-9: #6f4b2d; + --brown-10: #5e3a21; + --brown-11: #4e2b15; + --brown-12: #422412; } diff --git a/css/color/brown.hsl.css b/css/color/brown.hsl.css index 613189c7..c5109993 100644 --- a/css/color/brown.hsl.css +++ b/css/color/brown.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --brown-0-hsl: 36 60% 95%; - --brown-1-hsl: 32 44% 87%; - --brown-2-hsl: 28 40% 80%; - --brown-3-hsl: 28 38% 72%; - --brown-4-hsl: 27 36% 65%; - --brown-5-hsl: 28 34% 57%; - --brown-6-hsl: 28 32% 50%; - --brown-7-hsl: 28 35% 43%; - --brown-8-hsl: 28 38% 37%; - --brown-9-hsl: 27 42% 31%; - --brown-10-hsl: 25 48% 25%; - --brown-11-hsl: 23 58% 19%; - --brown-12-hsl: 22 57% 16%; +:where(:root) { + --brown-0-hsl: 36 60% 95%; + --brown-1-hsl: 32 44% 87%; + --brown-2-hsl: 28 40% 80%; + --brown-3-hsl: 28 38% 72%; + --brown-4-hsl: 27 36% 65%; + --brown-5-hsl: 28 34% 57%; + --brown-6-hsl: 28 32% 50%; + --brown-7-hsl: 28 35% 43%; + --brown-8-hsl: 28 38% 37%; + --brown-9-hsl: 27 42% 31%; + --brown-10-hsl: 25 48% 25%; + --brown-11-hsl: 23 58% 19%; + --brown-12-hsl: 22 57% 16%; } diff --git a/css/color/camo.hex.css b/css/color/camo.hex.css index 5e8cd947..c6dd5750 100644 --- a/css/color/camo.hex.css +++ b/css/color/camo.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --camo-0: #f9fbe7; - --camo-1: #e8ed9c; - --camo-2: #d2df4e; - --camo-3: #c2ce34; - --camo-4: #b5bb2e; - --camo-5: #a7a827; - --camo-6: #999621; - --camo-7: #8c851c; - --camo-8: #7e7416; - --camo-9: #6d6414; - --camo-10: #5d5411; - --camo-11: #4d460e; - --camo-12: #36300a; +:where(:root) { + --camo-0: #f9fbe7; + --camo-1: #e8ed9c; + --camo-2: #d2df4e; + --camo-3: #c2ce34; + --camo-4: #b5bb2e; + --camo-5: #a7a827; + --camo-6: #999621; + --camo-7: #8c851c; + --camo-8: #7e7416; + --camo-9: #6d6414; + --camo-10: #5d5411; + --camo-11: #4d460e; + --camo-12: #36300a; } diff --git a/css/color/camo.hsl.css b/css/color/camo.hsl.css index 8c4f4978..4e3ad2a3 100644 --- a/css/color/camo.hsl.css +++ b/css/color/camo.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --camo-0-hsl: 66 71% 95%; - --camo-1-hsl: 64 69% 77%; - --camo-2-hsl: 65 69% 59%; - --camo-3-hsl: 65 61% 51%; - --camo-4-hsl: 63 61% 46%; - --camo-5-hsl: 60 62% 41%; - --camo-6-hsl: 59 65% 36%; - --camo-7-hsl: 56 67% 33%; - --camo-8-hsl: 54 70% 29%; - --camo-9-hsl: 54 69% 25%; - --camo-10-hsl: 53 69% 22%; - --camo-11-hsl: 53 69% 18%; - --camo-12-hsl: 52 69% 13%; +:where(:root) { + --camo-0-hsl: 66 71% 95%; + --camo-1-hsl: 64 69% 77%; + --camo-2-hsl: 65 69% 59%; + --camo-3-hsl: 65 61% 51%; + --camo-4-hsl: 63 61% 46%; + --camo-5-hsl: 60 62% 41%; + --camo-6-hsl: 59 65% 36%; + --camo-7-hsl: 56 67% 33%; + --camo-8-hsl: 54 70% 29%; + --camo-9-hsl: 54 69% 25%; + --camo-10-hsl: 53 69% 22%; + --camo-11-hsl: 53 69% 18%; + --camo-12-hsl: 52 69% 13%; } diff --git a/css/color/choco.hex.css b/css/color/choco.hex.css index 96a621ae..5b8006b8 100644 --- a/css/color/choco.hex.css +++ b/css/color/choco.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --choco-0: #fff8dc; - --choco-1: #fce1bc; - --choco-2: #f7ca9e; - --choco-3: #f1b280; - --choco-4: #e99b62; - --choco-5: #df8545; - --choco-6: #d46e25; - --choco-7: #bd5f1b; - --choco-8: #a45117; - --choco-9: #8a4513; - --choco-10: #703a13; - --choco-11: #572f12; - --choco-12: #3d210d; +:where(:root) { + --choco-0: #fff8dc; + --choco-1: #fce1bc; + --choco-2: #f7ca9e; + --choco-3: #f1b280; + --choco-4: #e99b62; + --choco-5: #df8545; + --choco-6: #d46e25; + --choco-7: #bd5f1b; + --choco-8: #a45117; + --choco-9: #8a4513; + --choco-10: #703a13; + --choco-11: #572f12; + --choco-12: #3d210d; } diff --git a/css/color/choco.hsl.css b/css/color/choco.hsl.css index 7a5caa69..2833a5c3 100644 --- a/css/color/choco.hsl.css +++ b/css/color/choco.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --choco-0-hsl: 48 100% 93%; - --choco-1-hsl: 35 91% 86%; - --choco-2-hsl: 30 85% 79%; - --choco-3-hsl: 27 80% 72%; - --choco-4-hsl: 25 75% 65%; - --choco-5-hsl: 25 71% 57%; - --choco-6-hsl: 25 70% 49%; - --choco-7-hsl: 25 75% 42%; - --choco-8-hsl: 25 75% 37%; - --choco-9-hsl: 25 76% 31%; - --choco-10-hsl: 25 71% 26%; - --choco-11-hsl: 25 66% 21%; - --choco-12-hsl: 25 65% 15%; +:where(:root) { + --choco-0-hsl: 48 100% 93%; + --choco-1-hsl: 35 91% 86%; + --choco-2-hsl: 30 85% 79%; + --choco-3-hsl: 27 80% 72%; + --choco-4-hsl: 25 75% 65%; + --choco-5-hsl: 25 71% 57%; + --choco-6-hsl: 25 70% 49%; + --choco-7-hsl: 25 75% 42%; + --choco-8-hsl: 25 75% 37%; + --choco-9-hsl: 25 76% 31%; + --choco-10-hsl: 25 71% 26%; + --choco-11-hsl: 25 66% 21%; + --choco-12-hsl: 25 65% 15%; } diff --git a/css/color/colors.hex.css b/css/color/colors.hex.css deleted file mode 100644 index 5c7f2f1b..00000000 --- a/css/color/colors.hex.css +++ /dev/null @@ -1,249 +0,0 @@ -:where(html) { - --gray-0: #f8f9fa; - --gray-1: #f1f3f5; - --gray-2: #e9ecef; - --gray-3: #dee2e6; - --gray-4: #ced4da; - --gray-5: #adb5bd; - --gray-6: #868e96; - --gray-7: #495057; - --gray-8: #343a40; - --gray-9: #212529; - --gray-10: #16191d; - --gray-11: #0d0f12; - --gray-12: #030507; - --stone-0: #f8fafb; - --stone-1: #f2f4f6; - --stone-2: #ebedef; - --stone-3: #e0e4e5; - --stone-4: #d1d6d8; - --stone-5: #b1b6b9; - --stone-6: #979b9d; - --stone-7: #7e8282; - --stone-8: #666968; - --stone-9: #50514f; - --stone-10: #3a3a37; - --stone-11: #252521; - --stone-12: #121210; - --red-0: #fff5f5; - --red-1: #ffe3e3; - --red-2: #ffc9c9; - --red-3: #ffa8a8; - --red-4: #ff8787; - --red-5: #ff6b6b; - --red-6: #fa5252; - --red-7: #f03e3e; - --red-8: #e03131; - --red-9: #c92a2a; - --red-10: #b02525; - --red-11: #962020; - --red-12: #7d1a1a; - --pink-0: #fff0f6; - --pink-1: #ffdeeb; - --pink-2: #fcc2d7; - --pink-3: #faa2c1; - --pink-4: #f783ac; - --pink-5: #f06595; - --pink-6: #e64980; - --pink-7: #d6336c; - --pink-8: #c2255c; - --pink-9: #a61e4d; - --pink-10: #8c1941; - --pink-11: #731536; - --pink-12: #59102a; - --purple-0: #f8f0fc; - --purple-1: #f3d9fa; - --purple-2: #eebefa; - --purple-3: #e599f7; - --purple-4: #da77f2; - --purple-5: #cc5de8; - --purple-6: #be4bdb; - --purple-7: #ae3ec9; - --purple-8: #9c36b5; - --purple-9: #862e9c; - --purple-10: #702682; - --purple-11: #5a1e69; - --purple-12: #44174f; - --violet-0: #f3f0ff; - --violet-1: #e5dbff; - --violet-2: #d0bfff; - --violet-3: #b197fc; - --violet-4: #9775fa; - --violet-5: #845ef7; - --violet-6: #7950f2; - --violet-7: #7048e8; - --violet-8: #6741d9; - --violet-9: #5f3dc4; - --violet-10: #5235ab; - --violet-11: #462d91; - --violet-12: #3a2578; - --indigo-0: #edf2ff; - --indigo-1: #dbe4ff; - --indigo-2: #bac8ff; - --indigo-3: #91a7ff; - --indigo-4: #748ffc; - --indigo-5: #5c7cfa; - --indigo-6: #4c6ef5; - --indigo-7: #4263eb; - --indigo-8: #3b5bdb; - --indigo-9: #364fc7; - --indigo-10: #2f44ad; - --indigo-11: #283a94; - --indigo-12: #21307a; - --blue-0: #e7f5ff; - --blue-1: #d0ebff; - --blue-2: #a5d8ff; - --blue-3: #74c0fc; - --blue-4: #4dabf7; - --blue-5: #339af0; - --blue-6: #228be6; - --blue-7: #1c7ed6; - --blue-8: #1971c2; - --blue-9: #1864ab; - --blue-10: #145591; - --blue-11: #114678; - --blue-12: #0d375e; - --cyan-0: #e3fafc; - --cyan-1: #c5f6fa; - --cyan-2: #99e9f2; - --cyan-3: #66d9e8; - --cyan-4: #3bc9db; - --cyan-5: #22b8cf; - --cyan-6: #15aabf; - --cyan-7: #1098ad; - --cyan-8: #0c8599; - --cyan-9: #0b7285; - --cyan-10: #095c6b; - --cyan-11: #074652; - --cyan-12: #053038; - --teal-0: #e6fcf5; - --teal-1: #c3fae8; - --teal-2: #96f2d7; - --teal-3: #63e6be; - --teal-4: #38d9a9; - --teal-5: #20c997; - --teal-6: #12b886; - --teal-7: #0ca678; - --teal-8: #099268; - --teal-9: #087f5b; - --teal-10: #066649; - --teal-11: #054d37; - --teal-12: #033325; - --green-0: #ebfbee; - --green-1: #d3f9d8; - --green-2: #b2f2bb; - --green-3: #8ce99a; - --green-4: #69db7c; - --green-5: #51cf66; - --green-6: #40c057; - --green-7: #37b24d; - --green-8: #2f9e44; - --green-9: #2b8a3e; - --green-10: #237032; - --green-11: #1b5727; - --green-12: #133d1b; - --lime-0: #f4fce3; - --lime-1: #e9fac8; - --lime-2: #d8f5a2; - --lime-3: #c0eb75; - --lime-4: #a9e34b; - --lime-5: #94d82d; - --lime-6: #82c91e; - --lime-7: #74b816; - --lime-8: #66a80f; - --lime-9: #5c940d; - --lime-10: #4c7a0b; - --lime-11: #3c6109; - --lime-12: #2c4706; - --yellow-0: #fff9db; - --yellow-1: #fff3bf; - --yellow-2: #ffec99; - --yellow-3: #ffe066; - --yellow-4: #ffd43b; - --yellow-5: #fcc419; - --yellow-6: #fab005; - --yellow-7: #f59f00; - --yellow-8: #f08c00; - --yellow-9: #e67700; - --yellow-10: #b35c00; - --yellow-11: #804200; - --yellow-12: #663500; - --orange-0: #fff4e6; - --orange-1: #ffe8cc; - --orange-2: #ffd8a8; - --orange-3: #ffc078; - --orange-4: #ffa94d; - --orange-5: #ff922b; - --orange-6: #fd7e14; - --orange-7: #f76707; - --orange-8: #e8590c; - --orange-9: #d9480f; - --orange-10: #bf400d; - --orange-11: #99330b; - --orange-12: #802b09; - --choco-0: #fff8dc; - --choco-1: #fce1bc; - --choco-2: #f7ca9e; - --choco-3: #f1b280; - --choco-4: #e99b62; - --choco-5: #df8545; - --choco-6: #d46e25; - --choco-7: #bd5f1b; - --choco-8: #a45117; - --choco-9: #8a4513; - --choco-10: #703a13; - --choco-11: #572f12; - --choco-12: #3d210d; - --brown-0: #faf4eb; - --brown-1: #ede0d1; - --brown-2: #e0cab7; - --brown-3: #d3b79e; - --brown-4: #c5a285; - --brown-5: #b78f6d; - --brown-6: #a87c56; - --brown-7: #956b47; - --brown-8: #825b3a; - --brown-9: #6f4b2d; - --brown-10: #5e3a21; - --brown-11: #4e2b15; - --brown-12: #422412; - --sand-0: #f8fafb; - --sand-1: #e6e4dc; - --sand-2: #d5cfbd; - --sand-3: #c2b9a0; - --sand-4: #aea58c; - --sand-5: #9a9178; - --sand-6: #867c65; - --sand-7: #736a53; - --sand-8: #5f5746; - --sand-9: #4b4639; - --sand-10: #38352d; - --sand-11: #252521; - --sand-12: #121210; - --camo-0: #f9fbe7; - --camo-1: #e8ed9c; - --camo-2: #d2df4e; - --camo-3: #c2ce34; - --camo-4: #b5bb2e; - --camo-5: #a7a827; - --camo-6: #999621; - --camo-7: #8c851c; - --camo-8: #7e7416; - --camo-9: #6d6414; - --camo-10: #5d5411; - --camo-11: #4d460e; - --camo-12: #36300a; - --jungle-0: #ecfeb0; - --jungle-1: #def39a; - --jungle-2: #d0e884; - --jungle-3: #c2dd6e; - --jungle-4: #b5d15b; - --jungle-5: #a8c648; - --jungle-6: #9bbb36; - --jungle-7: #8fb024; - --jungle-8: #84a513; - --jungle-9: #7a9908; - --jungle-10: #658006; - --jungle-11: #516605; - --jungle-12: #3d4d04; -} diff --git a/css/color/colors.hsl.css b/css/color/colors.hsl.css deleted file mode 100644 index 4bfdfb1d..00000000 --- a/css/color/colors.hsl.css +++ /dev/null @@ -1,249 +0,0 @@ -:where(:root) { - --gray-0-hsl: 210 17% 98%; - --gray-1-hsl: 210 17% 95%; - --gray-2-hsl: 210 16% 93%; - --gray-3-hsl: 210 14% 89%; - --gray-4-hsl: 210 14% 83%; - --gray-5-hsl: 210 11% 71%; - --gray-6-hsl: 210 7% 56%; - --gray-7-hsl: 210 9% 31%; - --gray-8-hsl: 210 10% 23%; - --gray-9-hsl: 210 11% 15%; - --gray-10-hsl: 214 14% 10%; - --gray-11-hsl: 216 16% 6%; - --gray-12-hsl: 210 40% 2%; - --stone-0-hsl: 200 27% 98%; - --stone-1-hsl: 210 18% 96%; - --stone-2-hsl: 210 11% 93%; - --stone-3-hsl: 192 9% 89%; - --stone-4-hsl: 197 8% 83%; - --stone-5-hsl: 202 5% 71%; - --stone-6-hsl: 200 3% 60%; - --stone-7-hsl: 180 2% 50%; - --stone-8-hsl: 160 1% 41%; - --stone-9-hsl: 90 1% 31%; - --stone-10-hsl: 60 3% 22%; - --stone-11-hsl: 60 6% 14%; - --stone-12-hsl: 60 6% 7%; - --red-0-hsl: 0 100% 98%; - --red-1-hsl: 0 100% 95%; - --red-2-hsl: 0 100% 89%; - --red-3-hsl: 0 100% 83%; - --red-4-hsl: 0 100% 76%; - --red-5-hsl: 0 100% 71%; - --red-6-hsl: 0 94% 65%; - --red-7-hsl: 0 86% 59%; - --red-8-hsl: 0 74% 54%; - --red-9-hsl: 0 65% 48%; - --red-10-hsl: 0 65% 42%; - --red-11-hsl: 0 65% 36%; - --red-12-hsl: 0 66% 30%; - --pink-0-hsl: 336 100% 97%; - --pink-1-hsl: 336 100% 94%; - --pink-2-hsl: 338 91% 87%; - --pink-3-hsl: 339 90% 81%; - --pink-4-hsl: 339 88% 74%; - --pink-5-hsl: 339 82% 67%; - --pink-6-hsl: 339 76% 59%; - --pink-7-hsl: 339 67% 52%; - --pink-8-hsl: 339 68% 45%; - --pink-9-hsl: 339 69% 38%; - --pink-10-hsl: 339 70% 32%; - --pink-11-hsl: 339 69% 27%; - --pink-12-hsl: 339 70% 21%; - --purple-0-hsl: 280 67% 96%; - --purple-1-hsl: 287 77% 92%; - --purple-2-hsl: 288 86% 86%; - --purple-3-hsl: 289 85% 78%; - --purple-4-hsl: 288 83% 71%; - --purple-5-hsl: 288 75% 64%; - --purple-6-hsl: 288 67% 58%; - --purple-7-hsl: 288 56% 52%; - --purple-8-hsl: 288 54% 46%; - --purple-9-hsl: 288 54% 40%; - --purple-10-hsl: 288 55% 33%; - --purple-11-hsl: 288 56% 26%; - --purple-12-hsl: 288 55% 20%; - --violet-0-hsl: 252 100% 97%; - --violet-1-hsl: 257 100% 93%; - --violet-2-hsl: 256 100% 87%; - --violet-3-hsl: 255 94% 79%; - --violet-4-hsl: 255 93% 72%; - --violet-5-hsl: 255 91% 67%; - --violet-6-hsl: 255 86% 63%; - --violet-7-hsl: 255 78% 60%; - --violet-8-hsl: 255 67% 55%; - --violet-9-hsl: 255 53% 50%; - --violet-10-hsl: 255 53% 44%; - --violet-11-hsl: 255 53% 37%; - --violet-12-hsl: 255 53% 31%; - --indigo-0-hsl: 223 100% 96%; - --indigo-1-hsl: 225 100% 93%; - --indigo-2-hsl: 228 100% 86%; - --indigo-3-hsl: 228 100% 78%; - --indigo-4-hsl: 228 96% 72%; - --indigo-5-hsl: 228 94% 67%; - --indigo-6-hsl: 228 89% 63%; - --indigo-7-hsl: 228 81% 59%; - --indigo-8-hsl: 228 69% 55%; - --indigo-9-hsl: 230 57% 50%; - --indigo-10-hsl: 230 57% 43%; - --indigo-11-hsl: 230 57% 37%; - --indigo-12-hsl: 230 57% 30%; - --blue-0-hsl: 205 100% 95%; - --blue-1-hsl: 206 100% 91%; - --blue-2-hsl: 206 100% 82%; - --blue-3-hsl: 206 96% 72%; - --blue-4-hsl: 207 91% 64%; - --blue-5-hsl: 207 86% 57%; - --blue-6-hsl: 208 80% 52%; - --blue-7-hsl: 208 77% 47%; - --blue-8-hsl: 209 77% 43%; - --blue-9-hsl: 209 75% 38%; - --blue-10-hsl: 209 76% 32%; - --blue-11-hsl: 209 75% 27%; - --blue-12-hsl: 209 76% 21%; - --cyan-0-hsl: 185 81% 94%; - --cyan-1-hsl: 185 84% 88%; - --cyan-2-hsl: 186 77% 77%; - --cyan-3-hsl: 187 74% 65%; - --cyan-4-hsl: 187 69% 55%; - --cyan-5-hsl: 188 72% 47%; - --cyan-6-hsl: 187 80% 42%; - --cyan-7-hsl: 188 83% 37%; - --cyan-8-hsl: 189 85% 32%; - --cyan-9-hsl: 189 85% 28%; - --cyan-10-hsl: 189 84% 23%; - --cyan-11-hsl: 190 84% 17%; - --cyan-12-hsl: 189 84% 12%; - --teal-0-hsl: 161 79% 95%; - --teal-1-hsl: 160 85% 87%; - --teal-2-hsl: 162 78% 77%; - --teal-3-hsl: 162 72% 65%; - --teal-4-hsl: 162 68% 54%; - --teal-5-hsl: 162 73% 46%; - --teal-6-hsl: 162 82% 40%; - --teal-7-hsl: 162 87% 35%; - --teal-8-hsl: 162 88% 30%; - --teal-9-hsl: 162 88% 26%; - --teal-10-hsl: 162 89% 21%; - --teal-11-hsl: 162 88% 16%; - --teal-12-hsl: 163 89% 11%; - --green-0-hsl: 131 67% 95%; - --green-1-hsl: 128 76% 90%; - --green-2-hsl: 128 71% 82%; - --green-3-hsl: 129 68% 73%; - --green-4-hsl: 130 61% 64%; - --green-5-hsl: 130 57% 56%; - --green-6-hsl: 131 50% 50%; - --green-7-hsl: 131 53% 46%; - --green-8-hsl: 131 54% 40%; - --green-9-hsl: 132 52% 35%; - --green-10-hsl: 132 52% 29%; - --green-11-hsl: 132 53% 22%; - --green-12-hsl: 131 53% 16%; - --lime-0-hsl: 79 81% 94%; - --lime-1-hsl: 80 83% 88%; - --lime-2-hsl: 81 81% 80%; - --lime-3-hsl: 82 75% 69%; - --lime-4-hsl: 83 73% 59%; - --lime-5-hsl: 84 69% 51%; - --lime-6-hsl: 85 74% 45%; - --lime-7-hsl: 85 79% 40%; - --lime-8-hsl: 86 84% 36%; - --lime-9-hsl: 85 84% 32%; - --lime-10-hsl: 85 83% 26%; - --lime-11-hsl: 85 83% 21%; - --lime-12-hsl: 85 84% 15%; - --yellow-0-hsl: 50 100% 93%; - --yellow-1-hsl: 49 100% 87%; - --yellow-2-hsl: 49 100% 80%; - --yellow-3-hsl: 48 100% 70%; - --yellow-4-hsl: 47 100% 62%; - --yellow-5-hsl: 45 97% 54%; - --yellow-6-hsl: 42 96% 50%; - --yellow-7-hsl: 39 100% 48%; - --yellow-8-hsl: 35 100% 47%; - --yellow-9-hsl: 31 100% 45%; - --yellow-10-hsl: 31 100% 35%; - --yellow-11-hsl: 31 100% 25%; - --yellow-12-hsl: 31 100% 20%; - --orange-0-hsl: 34 100% 95%; - --orange-1-hsl: 33 100% 90%; - --orange-2-hsl: 33 100% 83%; - --orange-3-hsl: 32 100% 74%; - --orange-4-hsl: 31 100% 65%; - --orange-5-hsl: 29 100% 58%; - --orange-6-hsl: 27 98% 54%; - --orange-7-hsl: 24 94% 50%; - --orange-8-hsl: 21 90% 48%; - --orange-9-hsl: 17 87% 45%; - --orange-10-hsl: 17 87% 40%; - --orange-11-hsl: 17 87% 32%; - --orange-12-hsl: 17 87% 27%; - --choco-0-hsl: 48 100% 93%; - --choco-1-hsl: 35 91% 86%; - --choco-2-hsl: 30 85% 79%; - --choco-3-hsl: 27 80% 72%; - --choco-4-hsl: 25 75% 65%; - --choco-5-hsl: 25 71% 57%; - --choco-6-hsl: 25 70% 49%; - --choco-7-hsl: 25 75% 42%; - --choco-8-hsl: 25 75% 37%; - --choco-9-hsl: 25 76% 31%; - --choco-10-hsl: 25 71% 26%; - --choco-11-hsl: 25 66% 21%; - --choco-12-hsl: 25 65% 15%; - --brown-0-hsl: 36 60% 95%; - --brown-1-hsl: 32 44% 87%; - --brown-2-hsl: 28 40% 80%; - --brown-3-hsl: 28 38% 72%; - --brown-4-hsl: 27 36% 65%; - --brown-5-hsl: 28 34% 57%; - --brown-6-hsl: 28 32% 50%; - --brown-7-hsl: 28 35% 43%; - --brown-8-hsl: 28 38% 37%; - --brown-9-hsl: 27 42% 31%; - --brown-10-hsl: 25 48% 25%; - --brown-11-hsl: 23 58% 19%; - --brown-12-hsl: 22 57% 16%; - --sand-0-hsl: 200 27% 98%; - --sand-1-hsl: 48 17% 88%; - --sand-2-hsl: 45 22% 79%; - --sand-3-hsl: 44 22% 69%; - --sand-4-hsl: 44 17% 62%; - --sand-5-hsl: 44 14% 54%; - --sand-6-hsl: 42 14% 46%; - --sand-7-hsl: 43 16% 39%; - --sand-8-hsl: 41 15% 32%; - --sand-9-hsl: 43 14% 26%; - --sand-10-hsl: 44 11% 20%; - --sand-11-hsl: 60 6% 14%; - --sand-12-hsl: 60 6% 7%; - --camo-0-hsl: 66 71% 95%; - --camo-1-hsl: 64 69% 77%; - --camo-2-hsl: 65 69% 59%; - --camo-3-hsl: 65 61% 51%; - --camo-4-hsl: 63 61% 46%; - --camo-5-hsl: 60 62% 41%; - --camo-6-hsl: 59 65% 36%; - --camo-7-hsl: 56 67% 33%; - --camo-8-hsl: 54 70% 29%; - --camo-9-hsl: 54 69% 25%; - --camo-10-hsl: 53 69% 22%; - --camo-11-hsl: 53 69% 18%; - --camo-12-hsl: 52 69% 13%; - --jungle-0-hsl: 74 98% 84%; - --jungle-1-hsl: 74 79% 78%; - --jungle-2-hsl: 74 68% 71%; - --jungle-3-hsl: 75 62% 65%; - --jungle-4-hsl: 74 56% 59%; - --jungle-5-hsl: 74 53% 53%; - --jungle-6-hsl: 74 55% 47%; - --jungle-7-hsl: 74 66% 42%; - --jungle-8-hsl: 74 79% 36%; - --jungle-9-hsl: 73 90% 32%; - --jungle-10-hsl: 73 91% 26%; - --jungle-11-hsl: 73 91% 21%; - --jungle-12-hsl: 73 90% 16%; -} diff --git a/css/color/cyan.hex.css b/css/color/cyan.hex.css index e7e4a5bb..282017c3 100644 --- a/css/color/cyan.hex.css +++ b/css/color/cyan.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --cyan-0: #e3fafc; - --cyan-1: #c5f6fa; - --cyan-2: #99e9f2; - --cyan-3: #66d9e8; - --cyan-4: #3bc9db; - --cyan-5: #22b8cf; - --cyan-6: #15aabf; - --cyan-7: #1098ad; - --cyan-8: #0c8599; - --cyan-9: #0b7285; - --cyan-10: #095c6b; - --cyan-11: #074652; - --cyan-12: #053038; +:where(:root) { + --cyan-0: #e3fafc; + --cyan-1: #c5f6fa; + --cyan-2: #99e9f2; + --cyan-3: #66d9e8; + --cyan-4: #3bc9db; + --cyan-5: #22b8cf; + --cyan-6: #15aabf; + --cyan-7: #1098ad; + --cyan-8: #0c8599; + --cyan-9: #0b7285; + --cyan-10: #095c6b; + --cyan-11: #074652; + --cyan-12: #053038; } diff --git a/css/color/cyan.hsl.css b/css/color/cyan.hsl.css index b88afa2d..27e3b31c 100644 --- a/css/color/cyan.hsl.css +++ b/css/color/cyan.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --cyan-0-hsl: 185 81% 94%; - --cyan-1-hsl: 185 84% 88%; - --cyan-2-hsl: 186 77% 77%; - --cyan-3-hsl: 187 74% 65%; - --cyan-4-hsl: 187 69% 55%; - --cyan-5-hsl: 188 72% 47%; - --cyan-6-hsl: 187 80% 42%; - --cyan-7-hsl: 188 83% 37%; - --cyan-8-hsl: 189 85% 32%; - --cyan-9-hsl: 189 85% 28%; - --cyan-10-hsl: 189 84% 23%; - --cyan-11-hsl: 190 84% 17%; - --cyan-12-hsl: 189 84% 12%; +:where(:root) { + --cyan-0-hsl: 185 81% 94%; + --cyan-1-hsl: 185 84% 88%; + --cyan-2-hsl: 186 77% 77%; + --cyan-3-hsl: 187 74% 65%; + --cyan-4-hsl: 187 69% 55%; + --cyan-5-hsl: 188 72% 47%; + --cyan-6-hsl: 187 80% 42%; + --cyan-7-hsl: 188 83% 37%; + --cyan-8-hsl: 189 85% 32%; + --cyan-9-hsl: 189 85% 28%; + --cyan-10-hsl: 189 84% 23%; + --cyan-11-hsl: 190 84% 17%; + --cyan-12-hsl: 189 84% 12%; } diff --git a/css/color/gray.hex.css b/css/color/gray.hex.css index 41fa64ef..5a2dbd8f 100644 --- a/css/color/gray.hex.css +++ b/css/color/gray.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --gray-0: #f8f9fa; - --gray-1: #f1f3f5; - --gray-2: #e9ecef; - --gray-3: #dee2e6; - --gray-4: #ced4da; - --gray-5: #adb5bd; - --gray-6: #868e96; - --gray-7: #495057; - --gray-8: #343a40; - --gray-9: #212529; - --gray-10: #16191d; - --gray-11: #0d0f12; - --gray-12: #030507; +:where(:root) { + --gray-0: #f8f9fa; + --gray-1: #f1f3f5; + --gray-2: #e9ecef; + --gray-3: #dee2e6; + --gray-4: #ced4da; + --gray-5: #adb5bd; + --gray-6: #868e96; + --gray-7: #495057; + --gray-8: #343a40; + --gray-9: #212529; + --gray-10: #16191d; + --gray-11: #0d0f12; + --gray-12: #030507; } diff --git a/css/color/gray.hsl.css b/css/color/gray.hsl.css index ce0b5e2a..957f0bd6 100644 --- a/css/color/gray.hsl.css +++ b/css/color/gray.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --gray-0-hsl: 210 17% 98%; - --gray-1-hsl: 210 17% 95%; - --gray-2-hsl: 210 16% 93%; - --gray-3-hsl: 210 14% 89%; - --gray-4-hsl: 210 14% 83%; - --gray-5-hsl: 210 11% 71%; - --gray-6-hsl: 210 7% 56%; - --gray-7-hsl: 210 9% 31%; - --gray-8-hsl: 210 10% 23%; - --gray-9-hsl: 210 11% 15%; - --gray-10-hsl: 214 14% 10%; - --gray-11-hsl: 216 16% 6%; - --gray-12-hsl: 210 40% 2%; +:where(:root) { + --gray-0-hsl: 210 17% 98%; + --gray-1-hsl: 210 17% 95%; + --gray-2-hsl: 210 16% 93%; + --gray-3-hsl: 210 14% 89%; + --gray-4-hsl: 210 14% 83%; + --gray-5-hsl: 210 11% 71%; + --gray-6-hsl: 210 7% 56%; + --gray-7-hsl: 210 9% 31%; + --gray-8-hsl: 210 10% 23%; + --gray-9-hsl: 210 11% 15%; + --gray-10-hsl: 214 14% 10%; + --gray-11-hsl: 216 16% 6%; + --gray-12-hsl: 210 40% 2%; } diff --git a/css/color/green.hex.css b/css/color/green.hex.css index 969817bb..96b61f9e 100644 --- a/css/color/green.hex.css +++ b/css/color/green.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --green-0: #ebfbee; - --green-1: #d3f9d8; - --green-2: #b2f2bb; - --green-3: #8ce99a; - --green-4: #69db7c; - --green-5: #51cf66; - --green-6: #40c057; - --green-7: #37b24d; - --green-8: #2f9e44; - --green-9: #2b8a3e; - --green-10: #237032; - --green-11: #1b5727; - --green-12: #133d1b; +:where(:root) { + --green-0: #ebfbee; + --green-1: #d3f9d8; + --green-2: #b2f2bb; + --green-3: #8ce99a; + --green-4: #69db7c; + --green-5: #51cf66; + --green-6: #40c057; + --green-7: #37b24d; + --green-8: #2f9e44; + --green-9: #2b8a3e; + --green-10: #237032; + --green-11: #1b5727; + --green-12: #133d1b; } diff --git a/css/color/green.hsl.css b/css/color/green.hsl.css index 1fb906ca..5370f815 100644 --- a/css/color/green.hsl.css +++ b/css/color/green.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --green-0-hsl: 131 67% 95%; - --green-1-hsl: 128 76% 90%; - --green-2-hsl: 128 71% 82%; - --green-3-hsl: 129 68% 73%; - --green-4-hsl: 130 61% 64%; - --green-5-hsl: 130 57% 56%; - --green-6-hsl: 131 50% 50%; - --green-7-hsl: 131 53% 46%; - --green-8-hsl: 131 54% 40%; - --green-9-hsl: 132 52% 35%; - --green-10-hsl: 132 52% 29%; - --green-11-hsl: 132 53% 22%; - --green-12-hsl: 131 53% 16%; +:where(:root) { + --green-0-hsl: 131 67% 95%; + --green-1-hsl: 128 76% 90%; + --green-2-hsl: 128 71% 82%; + --green-3-hsl: 129 68% 73%; + --green-4-hsl: 130 61% 64%; + --green-5-hsl: 130 57% 56%; + --green-6-hsl: 131 50% 50%; + --green-7-hsl: 131 53% 46%; + --green-8-hsl: 131 54% 40%; + --green-9-hsl: 132 52% 35%; + --green-10-hsl: 132 52% 29%; + --green-11-hsl: 132 53% 22%; + --green-12-hsl: 131 53% 16%; } diff --git a/css/color/indigo.hex.css b/css/color/indigo.hex.css index be3ab58c..bea2921b 100644 --- a/css/color/indigo.hex.css +++ b/css/color/indigo.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --indigo-0: #edf2ff; - --indigo-1: #dbe4ff; - --indigo-2: #bac8ff; - --indigo-3: #91a7ff; - --indigo-4: #748ffc; - --indigo-5: #5c7cfa; - --indigo-6: #4c6ef5; - --indigo-7: #4263eb; - --indigo-8: #3b5bdb; - --indigo-9: #364fc7; - --indigo-10: #2f44ad; - --indigo-11: #283a94; - --indigo-12: #21307a; +:where(:root) { + --indigo-0: #edf2ff; + --indigo-1: #dbe4ff; + --indigo-2: #bac8ff; + --indigo-3: #91a7ff; + --indigo-4: #748ffc; + --indigo-5: #5c7cfa; + --indigo-6: #4c6ef5; + --indigo-7: #4263eb; + --indigo-8: #3b5bdb; + --indigo-9: #364fc7; + --indigo-10: #2f44ad; + --indigo-11: #283a94; + --indigo-12: #21307a; } diff --git a/css/color/indigo.hsl.css b/css/color/indigo.hsl.css index b256a315..e666fb42 100644 --- a/css/color/indigo.hsl.css +++ b/css/color/indigo.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --indigo-0-hsl: 223 100% 96%; - --indigo-1-hsl: 225 100% 93%; - --indigo-2-hsl: 228 100% 86%; - --indigo-3-hsl: 228 100% 78%; - --indigo-4-hsl: 228 96% 72%; - --indigo-5-hsl: 228 94% 67%; - --indigo-6-hsl: 228 89% 63%; - --indigo-7-hsl: 228 81% 59%; - --indigo-8-hsl: 228 69% 55%; - --indigo-9-hsl: 230 57% 50%; - --indigo-10-hsl: 230 57% 43%; - --indigo-11-hsl: 230 57% 37%; - --indigo-12-hsl: 230 57% 30%; +:where(:root) { + --indigo-0-hsl: 223 100% 96%; + --indigo-1-hsl: 225 100% 93%; + --indigo-2-hsl: 228 100% 86%; + --indigo-3-hsl: 228 100% 78%; + --indigo-4-hsl: 228 96% 72%; + --indigo-5-hsl: 228 94% 67%; + --indigo-6-hsl: 228 89% 63%; + --indigo-7-hsl: 228 81% 59%; + --indigo-8-hsl: 228 69% 55%; + --indigo-9-hsl: 230 57% 50%; + --indigo-10-hsl: 230 57% 43%; + --indigo-11-hsl: 230 57% 37%; + --indigo-12-hsl: 230 57% 30%; } diff --git a/css/color/jungle.hex.css b/css/color/jungle.hex.css index d0d94a40..558e5331 100644 --- a/css/color/jungle.hex.css +++ b/css/color/jungle.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --jungle-0: #ecfeb0; - --jungle-1: #def39a; - --jungle-2: #d0e884; - --jungle-3: #c2dd6e; - --jungle-4: #b5d15b; - --jungle-5: #a8c648; - --jungle-6: #9bbb36; - --jungle-7: #8fb024; - --jungle-8: #84a513; - --jungle-9: #7a9908; - --jungle-10: #658006; - --jungle-11: #516605; - --jungle-12: #3d4d04; +:where(:root) { + --jungle-0: #ecfeb0; + --jungle-1: #def39a; + --jungle-2: #d0e884; + --jungle-3: #c2dd6e; + --jungle-4: #b5d15b; + --jungle-5: #a8c648; + --jungle-6: #9bbb36; + --jungle-7: #8fb024; + --jungle-8: #84a513; + --jungle-9: #7a9908; + --jungle-10: #658006; + --jungle-11: #516605; + --jungle-12: #3d4d04; } diff --git a/css/color/jungle.hsl.css b/css/color/jungle.hsl.css index 8722c1c6..fad6ea25 100644 --- a/css/color/jungle.hsl.css +++ b/css/color/jungle.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --jungle-0-hsl: 74 98% 84%; - --jungle-1-hsl: 74 79% 78%; - --jungle-2-hsl: 74 68% 71%; - --jungle-3-hsl: 75 62% 65%; - --jungle-4-hsl: 74 56% 59%; - --jungle-5-hsl: 74 53% 53%; - --jungle-6-hsl: 74 55% 47%; - --jungle-7-hsl: 74 66% 42%; - --jungle-8-hsl: 74 79% 36%; - --jungle-9-hsl: 73 90% 32%; - --jungle-10-hsl: 73 91% 26%; - --jungle-11-hsl: 73 91% 21%; - --jungle-12-hsl: 73 90% 16%; +:where(:root) { + --jungle-0-hsl: 74 98% 84%; + --jungle-1-hsl: 74 79% 78%; + --jungle-2-hsl: 74 68% 71%; + --jungle-3-hsl: 75 62% 65%; + --jungle-4-hsl: 74 56% 59%; + --jungle-5-hsl: 74 53% 53%; + --jungle-6-hsl: 74 55% 47%; + --jungle-7-hsl: 74 66% 42%; + --jungle-8-hsl: 74 79% 36%; + --jungle-9-hsl: 73 90% 32%; + --jungle-10-hsl: 73 91% 26%; + --jungle-11-hsl: 73 91% 21%; + --jungle-12-hsl: 73 90% 16%; } diff --git a/css/color/lime.hex.css b/css/color/lime.hex.css index d9e7893f..7df83264 100644 --- a/css/color/lime.hex.css +++ b/css/color/lime.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --lime-0: #f4fce3; - --lime-1: #e9fac8; - --lime-2: #d8f5a2; - --lime-3: #c0eb75; - --lime-4: #a9e34b; - --lime-5: #94d82d; - --lime-6: #82c91e; - --lime-7: #74b816; - --lime-8: #66a80f; - --lime-9: #5c940d; - --lime-10: #4c7a0b; - --lime-11: #3c6109; - --lime-12: #2c4706; +:where(:root) { + --lime-0: #f4fce3; + --lime-1: #e9fac8; + --lime-2: #d8f5a2; + --lime-3: #c0eb75; + --lime-4: #a9e34b; + --lime-5: #94d82d; + --lime-6: #82c91e; + --lime-7: #74b816; + --lime-8: #66a80f; + --lime-9: #5c940d; + --lime-10: #4c7a0b; + --lime-11: #3c6109; + --lime-12: #2c4706; } diff --git a/css/color/lime.hsl.css b/css/color/lime.hsl.css index b998852b..8abc9004 100644 --- a/css/color/lime.hsl.css +++ b/css/color/lime.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --lime-0-hsl: 79 81% 94%; - --lime-1-hsl: 80 83% 88%; - --lime-2-hsl: 81 81% 80%; - --lime-3-hsl: 82 75% 69%; - --lime-4-hsl: 83 73% 59%; - --lime-5-hsl: 84 69% 51%; - --lime-6-hsl: 85 74% 45%; - --lime-7-hsl: 85 79% 40%; - --lime-8-hsl: 86 84% 36%; - --lime-9-hsl: 85 84% 32%; - --lime-10-hsl: 85 83% 26%; - --lime-11-hsl: 85 83% 21%; - --lime-12-hsl: 85 84% 15%; +:where(:root) { + --lime-0-hsl: 79 81% 94%; + --lime-1-hsl: 80 83% 88%; + --lime-2-hsl: 81 81% 80%; + --lime-3-hsl: 82 75% 69%; + --lime-4-hsl: 83 73% 59%; + --lime-5-hsl: 84 69% 51%; + --lime-6-hsl: 85 74% 45%; + --lime-7-hsl: 85 79% 40%; + --lime-8-hsl: 86 84% 36%; + --lime-9-hsl: 85 84% 32%; + --lime-10-hsl: 85 83% 26%; + --lime-11-hsl: 85 83% 21%; + --lime-12-hsl: 85 84% 15%; } diff --git a/css/color/neon.p3.css b/css/color/neon.p3.css new file mode 100644 index 00000000..bbb6922d --- /dev/null +++ b/css/color/neon.p3.css @@ -0,0 +1,30 @@ +:where(:root) { + --neon-red: #ff5161; + --neon-red-glow: #d30302; + --neon-pink: #ff53cd; + --neon-pink-glow: #e10361; + --neon-purple: #9461fd; + --neon-purple-glow: #4003e6; + --neon-blue: #2dd9fe; + --neon-blue-glow: #00a3d5; + --neon-green: #00fe9b; + --neon-green-glow: #02c435; + --neon-yellow: #ffdb4e; + --neon-yellow-glow: #b48505; + --neon-white: #fefefe; + --neon-white-glow: #ffffff; +} + +@supports (background: color(display-p3 1 1 1)) { + @media (dynamic-range: high) { + :where(:root) { + --neon-red: color(display-p3 1 0 0); + --neon-pink: color(display-p3 1 0 1); + --neon-purple: color(display-p3 0 0 1); + --neon-blue: color(display-p3 0 1 1); + --neon-green: color(display-p3 0 1 0); + --neon-yellow: color(display-p3 1 1 0); + --neon-white: color(display-p3 1 1 1); + } + } +} diff --git a/css/color/orange.hex.css b/css/color/orange.hex.css index cec19756..0d6b3f05 100644 --- a/css/color/orange.hex.css +++ b/css/color/orange.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --orange-0: #fff4e6; - --orange-1: #ffe8cc; - --orange-2: #ffd8a8; - --orange-3: #ffc078; - --orange-4: #ffa94d; - --orange-5: #ff922b; - --orange-6: #fd7e14; - --orange-7: #f76707; - --orange-8: #e8590c; - --orange-9: #d9480f; - --orange-10: #bf400d; - --orange-11: #99330b; - --orange-12: #802b09; +:where(:root) { + --orange-0: #fff4e6; + --orange-1: #ffe8cc; + --orange-2: #ffd8a8; + --orange-3: #ffc078; + --orange-4: #ffa94d; + --orange-5: #ff922b; + --orange-6: #fd7e14; + --orange-7: #f76707; + --orange-8: #e8590c; + --orange-9: #d9480f; + --orange-10: #bf400d; + --orange-11: #99330b; + --orange-12: #802b09; } diff --git a/css/color/orange.hsl.css b/css/color/orange.hsl.css index 24d1d890..5ffd88fe 100644 --- a/css/color/orange.hsl.css +++ b/css/color/orange.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --orange-0-hsl: 34 100% 95%; - --orange-1-hsl: 33 100% 90%; - --orange-2-hsl: 33 100% 83%; - --orange-3-hsl: 32 100% 74%; - --orange-4-hsl: 31 100% 65%; - --orange-5-hsl: 29 100% 58%; - --orange-6-hsl: 27 98% 54%; - --orange-7-hsl: 24 94% 50%; - --orange-8-hsl: 21 90% 48%; - --orange-9-hsl: 17 87% 45%; - --orange-10-hsl: 17 87% 40%; - --orange-11-hsl: 17 87% 32%; - --orange-12-hsl: 17 87% 27%; +:where(:root) { + --orange-0-hsl: 34 100% 95%; + --orange-1-hsl: 33 100% 90%; + --orange-2-hsl: 33 100% 83%; + --orange-3-hsl: 32 100% 74%; + --orange-4-hsl: 31 100% 65%; + --orange-5-hsl: 29 100% 58%; + --orange-6-hsl: 27 98% 54%; + --orange-7-hsl: 24 94% 50%; + --orange-8-hsl: 21 90% 48%; + --orange-9-hsl: 17 87% 45%; + --orange-10-hsl: 17 87% 40%; + --orange-11-hsl: 17 87% 32%; + --orange-12-hsl: 17 87% 27%; } diff --git a/css/color/pink.hex.css b/css/color/pink.hex.css index 2daca992..4201d05a 100644 --- a/css/color/pink.hex.css +++ b/css/color/pink.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --pink-0: #fff0f6; - --pink-1: #ffdeeb; - --pink-2: #fcc2d7; - --pink-3: #faa2c1; - --pink-4: #f783ac; - --pink-5: #f06595; - --pink-6: #e64980; - --pink-7: #d6336c; - --pink-8: #c2255c; - --pink-9: #a61e4d; - --pink-10: #8c1941; - --pink-11: #731536; - --pink-12: #59102a; +:where(:root) { + --pink-0: #fff0f6; + --pink-1: #ffdeeb; + --pink-2: #fcc2d7; + --pink-3: #faa2c1; + --pink-4: #f783ac; + --pink-5: #f06595; + --pink-6: #e64980; + --pink-7: #d6336c; + --pink-8: #c2255c; + --pink-9: #a61e4d; + --pink-10: #8c1941; + --pink-11: #731536; + --pink-12: #59102a; } diff --git a/css/color/pink.hsl.css b/css/color/pink.hsl.css index 61295f79..2954255e 100644 --- a/css/color/pink.hsl.css +++ b/css/color/pink.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --pink-0-hsl: 336 100% 97%; - --pink-1-hsl: 336 100% 94%; - --pink-2-hsl: 338 91% 87%; - --pink-3-hsl: 339 90% 81%; - --pink-4-hsl: 339 88% 74%; - --pink-5-hsl: 339 82% 67%; - --pink-6-hsl: 339 76% 59%; - --pink-7-hsl: 339 67% 52%; - --pink-8-hsl: 339 68% 45%; - --pink-9-hsl: 339 69% 38%; - --pink-10-hsl: 339 70% 32%; - --pink-11-hsl: 339 69% 27%; - --pink-12-hsl: 339 70% 21%; +:where(:root) { + --pink-0-hsl: 336 100% 97%; + --pink-1-hsl: 336 100% 94%; + --pink-2-hsl: 338 91% 87%; + --pink-3-hsl: 339 90% 81%; + --pink-4-hsl: 339 88% 74%; + --pink-5-hsl: 339 82% 67%; + --pink-6-hsl: 339 76% 59%; + --pink-7-hsl: 339 67% 52%; + --pink-8-hsl: 339 68% 45%; + --pink-9-hsl: 339 69% 38%; + --pink-10-hsl: 339 70% 32%; + --pink-11-hsl: 339 69% 27%; + --pink-12-hsl: 339 70% 21%; } diff --git a/css/color/purple.hex.css b/css/color/purple.hex.css index f61b8935..3c5ca30b 100644 --- a/css/color/purple.hex.css +++ b/css/color/purple.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --purple-0: #f8f0fc; - --purple-1: #f3d9fa; - --purple-2: #eebefa; - --purple-3: #e599f7; - --purple-4: #da77f2; - --purple-5: #cc5de8; - --purple-6: #be4bdb; - --purple-7: #ae3ec9; - --purple-8: #9c36b5; - --purple-9: #862e9c; - --purple-10: #702682; - --purple-11: #5a1e69; - --purple-12: #44174f; +:where(:root) { + --purple-0: #f8f0fc; + --purple-1: #f3d9fa; + --purple-2: #eebefa; + --purple-3: #e599f7; + --purple-4: #da77f2; + --purple-5: #cc5de8; + --purple-6: #be4bdb; + --purple-7: #ae3ec9; + --purple-8: #9c36b5; + --purple-9: #862e9c; + --purple-10: #702682; + --purple-11: #5a1e69; + --purple-12: #44174f; } diff --git a/css/color/purple.hsl.css b/css/color/purple.hsl.css index 576a2472..0873257a 100644 --- a/css/color/purple.hsl.css +++ b/css/color/purple.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --purple-0-hsl: 280 67% 96%; - --purple-1-hsl: 287 77% 92%; - --purple-2-hsl: 288 86% 86%; - --purple-3-hsl: 289 85% 78%; - --purple-4-hsl: 288 83% 71%; - --purple-5-hsl: 288 75% 64%; - --purple-6-hsl: 288 67% 58%; - --purple-7-hsl: 288 56% 52%; - --purple-8-hsl: 288 54% 46%; - --purple-9-hsl: 288 54% 40%; - --purple-10-hsl: 288 55% 33%; - --purple-11-hsl: 288 56% 26%; - --purple-12-hsl: 288 55% 20%; +:where(:root) { + --purple-0-hsl: 280 67% 96%; + --purple-1-hsl: 287 77% 92%; + --purple-2-hsl: 288 86% 86%; + --purple-3-hsl: 289 85% 78%; + --purple-4-hsl: 288 83% 71%; + --purple-5-hsl: 288 75% 64%; + --purple-6-hsl: 288 67% 58%; + --purple-7-hsl: 288 56% 52%; + --purple-8-hsl: 288 54% 46%; + --purple-9-hsl: 288 54% 40%; + --purple-10-hsl: 288 55% 33%; + --purple-11-hsl: 288 56% 26%; + --purple-12-hsl: 288 55% 20%; } diff --git a/css/color/red.hex.css b/css/color/red.hex.css index 9438fb47..473e69c3 100644 --- a/css/color/red.hex.css +++ b/css/color/red.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --red-0: #fff5f5; - --red-1: #ffe3e3; - --red-2: #ffc9c9; - --red-3: #ffa8a8; - --red-4: #ff8787; - --red-5: #ff6b6b; - --red-6: #fa5252; - --red-7: #f03e3e; - --red-8: #e03131; - --red-9: #c92a2a; - --red-10: #b02525; - --red-11: #962020; - --red-12: #7d1a1a; +:where(:root) { + --red-0: #fff5f5; + --red-1: #ffe3e3; + --red-2: #ffc9c9; + --red-3: #ffa8a8; + --red-4: #ff8787; + --red-5: #ff6b6b; + --red-6: #fa5252; + --red-7: #f03e3e; + --red-8: #e03131; + --red-9: #c92a2a; + --red-10: #b02525; + --red-11: #962020; + --red-12: #7d1a1a; } diff --git a/css/color/red.hsl.css b/css/color/red.hsl.css index cef10d09..b36248fb 100644 --- a/css/color/red.hsl.css +++ b/css/color/red.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --red-0-hsl: 0 100% 98%; - --red-1-hsl: 0 100% 95%; - --red-2-hsl: 0 100% 89%; - --red-3-hsl: 0 100% 83%; - --red-4-hsl: 0 100% 76%; - --red-5-hsl: 0 100% 71%; - --red-6-hsl: 0 94% 65%; - --red-7-hsl: 0 86% 59%; - --red-8-hsl: 0 74% 54%; - --red-9-hsl: 0 65% 48%; - --red-10-hsl: 0 65% 42%; - --red-11-hsl: 0 65% 36%; - --red-12-hsl: 0 66% 30%; +:where(:root) { + --red-0-hsl: 0 100% 98%; + --red-1-hsl: 0 100% 95%; + --red-2-hsl: 0 100% 89%; + --red-3-hsl: 0 100% 83%; + --red-4-hsl: 0 100% 76%; + --red-5-hsl: 0 100% 71%; + --red-6-hsl: 0 94% 65%; + --red-7-hsl: 0 86% 59%; + --red-8-hsl: 0 74% 54%; + --red-9-hsl: 0 65% 48%; + --red-10-hsl: 0 65% 42%; + --red-11-hsl: 0 65% 36%; + --red-12-hsl: 0 66% 30%; } diff --git a/css/color/sand.hex.css b/css/color/sand.hex.css index dfa0702a..850f25db 100644 --- a/css/color/sand.hex.css +++ b/css/color/sand.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --sand-0: #f8fafb; - --sand-1: #e6e4dc; - --sand-2: #d5cfbd; - --sand-3: #c2b9a0; - --sand-4: #aea58c; - --sand-5: #9a9178; - --sand-6: #867c65; - --sand-7: #736a53; - --sand-8: #5f5746; - --sand-9: #4b4639; - --sand-10: #38352d; - --sand-11: #252521; - --sand-12: #121210; +:where(:root) { + --sand-0: #f8fafb; + --sand-1: #e6e4dc; + --sand-2: #d5cfbd; + --sand-3: #c2b9a0; + --sand-4: #aea58c; + --sand-5: #9a9178; + --sand-6: #867c65; + --sand-7: #736a53; + --sand-8: #5f5746; + --sand-9: #4b4639; + --sand-10: #38352d; + --sand-11: #252521; + --sand-12: #121210; } diff --git a/css/color/sand.hsl.css b/css/color/sand.hsl.css index 8f59ae6c..922ed7a1 100644 --- a/css/color/sand.hsl.css +++ b/css/color/sand.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --sand-0-hsl: 200 27% 98%; - --sand-1-hsl: 48 17% 88%; - --sand-2-hsl: 45 22% 79%; - --sand-3-hsl: 44 22% 69%; - --sand-4-hsl: 44 17% 62%; - --sand-5-hsl: 44 14% 54%; - --sand-6-hsl: 42 14% 46%; - --sand-7-hsl: 43 16% 39%; - --sand-8-hsl: 41 15% 32%; - --sand-9-hsl: 43 14% 26%; - --sand-10-hsl: 44 11% 20%; - --sand-11-hsl: 60 6% 14%; - --sand-12-hsl: 60 6% 7%; +:where(:root) { + --sand-0-hsl: 200 27% 98%; + --sand-1-hsl: 48 17% 88%; + --sand-2-hsl: 45 22% 79%; + --sand-3-hsl: 44 22% 69%; + --sand-4-hsl: 44 17% 62%; + --sand-5-hsl: 44 14% 54%; + --sand-6-hsl: 42 14% 46%; + --sand-7-hsl: 43 16% 39%; + --sand-8-hsl: 41 15% 32%; + --sand-9-hsl: 43 14% 26%; + --sand-10-hsl: 44 11% 20%; + --sand-11-hsl: 60 6% 14%; + --sand-12-hsl: 60 6% 7%; } diff --git a/css/color/stone.hex.css b/css/color/stone.hex.css index 3bed374a..7accd47e 100644 --- a/css/color/stone.hex.css +++ b/css/color/stone.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --stone-0: #f8fafb; - --stone-1: #f2f4f6; - --stone-2: #ebedef; - --stone-3: #e0e4e5; - --stone-4: #d1d6d8; - --stone-5: #b1b6b9; - --stone-6: #979b9d; - --stone-7: #7e8282; - --stone-8: #666968; - --stone-9: #50514f; - --stone-10: #3a3a37; - --stone-11: #252521; - --stone-12: #121210; +:where(:root) { + --stone-0: #f8fafb; + --stone-1: #f2f4f6; + --stone-2: #ebedef; + --stone-3: #e0e4e5; + --stone-4: #d1d6d8; + --stone-5: #b1b6b9; + --stone-6: #979b9d; + --stone-7: #7e8282; + --stone-8: #666968; + --stone-9: #50514f; + --stone-10: #3a3a37; + --stone-11: #252521; + --stone-12: #121210; } diff --git a/css/color/stone.hsl.css b/css/color/stone.hsl.css index ba07a66f..8b217d07 100644 --- a/css/color/stone.hsl.css +++ b/css/color/stone.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --stone-0-hsl: 200 27% 98%; - --stone-1-hsl: 210 18% 96%; - --stone-2-hsl: 210 11% 93%; - --stone-3-hsl: 192 9% 89%; - --stone-4-hsl: 197 8% 83%; - --stone-5-hsl: 202 5% 71%; - --stone-6-hsl: 200 3% 60%; - --stone-7-hsl: 180 2% 50%; - --stone-8-hsl: 160 1% 41%; - --stone-9-hsl: 90 1% 31%; - --stone-10-hsl: 60 3% 22%; - --stone-11-hsl: 60 6% 14%; - --stone-12-hsl: 60 6% 7%; +:where(:root) { + --stone-0-hsl: 200 27% 98%; + --stone-1-hsl: 210 18% 96%; + --stone-2-hsl: 210 11% 93%; + --stone-3-hsl: 192 9% 89%; + --stone-4-hsl: 197 8% 83%; + --stone-5-hsl: 202 5% 71%; + --stone-6-hsl: 200 3% 60%; + --stone-7-hsl: 180 2% 50%; + --stone-8-hsl: 160 1% 41%; + --stone-9-hsl: 90 1% 31%; + --stone-10-hsl: 60 3% 22%; + --stone-11-hsl: 60 6% 14%; + --stone-12-hsl: 60 6% 7%; } diff --git a/css/color/teal.hex.css b/css/color/teal.hex.css index 8308e1ed..ac6385f2 100644 --- a/css/color/teal.hex.css +++ b/css/color/teal.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --teal-0: #e6fcf5; - --teal-1: #c3fae8; - --teal-2: #96f2d7; - --teal-3: #63e6be; - --teal-4: #38d9a9; - --teal-5: #20c997; - --teal-6: #12b886; - --teal-7: #0ca678; - --teal-8: #099268; - --teal-9: #087f5b; - --teal-10: #066649; - --teal-11: #054d37; - --teal-12: #033325; +:where(:root) { + --teal-0: #e6fcf5; + --teal-1: #c3fae8; + --teal-2: #96f2d7; + --teal-3: #63e6be; + --teal-4: #38d9a9; + --teal-5: #20c997; + --teal-6: #12b886; + --teal-7: #0ca678; + --teal-8: #099268; + --teal-9: #087f5b; + --teal-10: #066649; + --teal-11: #054d37; + --teal-12: #033325; } diff --git a/css/color/teal.hsl.css b/css/color/teal.hsl.css index 443f9b4f..87f2b3c3 100644 --- a/css/color/teal.hsl.css +++ b/css/color/teal.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --teal-0-hsl: 161 79% 95%; - --teal-1-hsl: 160 85% 87%; - --teal-2-hsl: 162 78% 77%; - --teal-3-hsl: 162 72% 65%; - --teal-4-hsl: 162 68% 54%; - --teal-5-hsl: 162 73% 46%; - --teal-6-hsl: 162 82% 40%; - --teal-7-hsl: 162 87% 35%; - --teal-8-hsl: 162 88% 30%; - --teal-9-hsl: 162 88% 26%; - --teal-10-hsl: 162 89% 21%; - --teal-11-hsl: 162 88% 16%; - --teal-12-hsl: 163 89% 11%; +:where(:root) { + --teal-0-hsl: 161 79% 95%; + --teal-1-hsl: 160 85% 87%; + --teal-2-hsl: 162 78% 77%; + --teal-3-hsl: 162 72% 65%; + --teal-4-hsl: 162 68% 54%; + --teal-5-hsl: 162 73% 46%; + --teal-6-hsl: 162 82% 40%; + --teal-7-hsl: 162 87% 35%; + --teal-8-hsl: 162 88% 30%; + --teal-9-hsl: 162 88% 26%; + --teal-10-hsl: 162 89% 21%; + --teal-11-hsl: 162 88% 16%; + --teal-12-hsl: 163 89% 11%; } diff --git a/css/color/violet.hex.css b/css/color/violet.hex.css index 5701833e..dec89bf3 100644 --- a/css/color/violet.hex.css +++ b/css/color/violet.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --violet-0: #f3f0ff; - --violet-1: #e5dbff; - --violet-2: #d0bfff; - --violet-3: #b197fc; - --violet-4: #9775fa; - --violet-5: #845ef7; - --violet-6: #7950f2; - --violet-7: #7048e8; - --violet-8: #6741d9; - --violet-9: #5f3dc4; - --violet-10: #5235ab; - --violet-11: #462d91; - --violet-12: #3a2578; +:where(:root) { + --violet-0: #f3f0ff; + --violet-1: #e5dbff; + --violet-2: #d0bfff; + --violet-3: #b197fc; + --violet-4: #9775fa; + --violet-5: #845ef7; + --violet-6: #7950f2; + --violet-7: #7048e8; + --violet-8: #6741d9; + --violet-9: #5f3dc4; + --violet-10: #5235ab; + --violet-11: #462d91; + --violet-12: #3a2578; } diff --git a/css/color/violet.hsl.css b/css/color/violet.hsl.css index 4d2e545f..b30d40d3 100644 --- a/css/color/violet.hsl.css +++ b/css/color/violet.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --violet-0-hsl: 252 100% 97%; - --violet-1-hsl: 257 100% 93%; - --violet-2-hsl: 256 100% 87%; - --violet-3-hsl: 255 94% 79%; - --violet-4-hsl: 255 93% 72%; - --violet-5-hsl: 255 91% 67%; - --violet-6-hsl: 255 86% 63%; - --violet-7-hsl: 255 78% 60%; - --violet-8-hsl: 255 67% 55%; - --violet-9-hsl: 255 53% 50%; - --violet-10-hsl: 255 53% 44%; - --violet-11-hsl: 255 53% 37%; - --violet-12-hsl: 255 53% 31%; +:where(:root) { + --violet-0-hsl: 252 100% 97%; + --violet-1-hsl: 257 100% 93%; + --violet-2-hsl: 256 100% 87%; + --violet-3-hsl: 255 94% 79%; + --violet-4-hsl: 255 93% 72%; + --violet-5-hsl: 255 91% 67%; + --violet-6-hsl: 255 86% 63%; + --violet-7-hsl: 255 78% 60%; + --violet-8-hsl: 255 67% 55%; + --violet-9-hsl: 255 53% 50%; + --violet-10-hsl: 255 53% 44%; + --violet-11-hsl: 255 53% 37%; + --violet-12-hsl: 255 53% 31%; } diff --git a/css/color/yellow.hex.css b/css/color/yellow.hex.css index 9c346fc7..a9535deb 100644 --- a/css/color/yellow.hex.css +++ b/css/color/yellow.hex.css @@ -1,15 +1,15 @@ -:where(html) { - --yellow-0: #fff9db; - --yellow-1: #fff3bf; - --yellow-2: #ffec99; - --yellow-3: #ffe066; - --yellow-4: #ffd43b; - --yellow-5: #fcc419; - --yellow-6: #fab005; - --yellow-7: #f59f00; - --yellow-8: #f08c00; - --yellow-9: #e67700; - --yellow-10: #b35c00; - --yellow-11: #804200; - --yellow-12: #663500; +:where(:root) { + --yellow-0: #fff9db; + --yellow-1: #fff3bf; + --yellow-2: #ffec99; + --yellow-3: #ffe066; + --yellow-4: #ffd43b; + --yellow-5: #fcc419; + --yellow-6: #fab005; + --yellow-7: #f59f00; + --yellow-8: #f08c00; + --yellow-9: #e67700; + --yellow-10: #b35c00; + --yellow-11: #804200; + --yellow-12: #663500; } diff --git a/css/color/yellow.hsl.css b/css/color/yellow.hsl.css index bfd1b65b..cda53af3 100644 --- a/css/color/yellow.hsl.css +++ b/css/color/yellow.hsl.css @@ -1,15 +1,15 @@ -:where(html) { - --yellow-0-hsl: 50 100% 93%; - --yellow-1-hsl: 49 100% 87%; - --yellow-2-hsl: 49 100% 80%; - --yellow-3-hsl: 48 100% 70%; - --yellow-4-hsl: 47 100% 62%; - --yellow-5-hsl: 45 97% 54%; - --yellow-6-hsl: 42 96% 50%; - --yellow-7-hsl: 39 100% 48%; - --yellow-8-hsl: 35 100% 47%; - --yellow-9-hsl: 31 100% 45%; - --yellow-10-hsl: 31 100% 35%; - --yellow-11-hsl: 31 100% 25%; - --yellow-12-hsl: 31 100% 20%; +:where(:root) { + --yellow-0-hsl: 50 100% 93%; + --yellow-1-hsl: 49 100% 87%; + --yellow-2-hsl: 49 100% 80%; + --yellow-3-hsl: 48 100% 70%; + --yellow-4-hsl: 47 100% 62%; + --yellow-5-hsl: 45 97% 54%; + --yellow-6-hsl: 42 96% 50%; + --yellow-7-hsl: 39 100% 48%; + --yellow-8-hsl: 35 100% 47%; + --yellow-9-hsl: 31 100% 45%; + --yellow-10-hsl: 31 100% 35%; + --yellow-11-hsl: 31 100% 25%; + --yellow-12-hsl: 31 100% 20%; } diff --git a/css/experiments/inline-writing-mode-switch.css b/css/experiments/inline-writing-mode-switch.css index 2f0bb1f2..6035817a 100644 --- a/css/experiments/inline-writing-mode-switch.css +++ b/css/experiments/inline-writing-mode-switch.css @@ -1,4 +1,4 @@ -:where(html) { +:where(:root) { --isLTR: 1; --isRTL: -1; diff --git a/css/masks/corner-cuts.css b/css/masks/corner-cuts.css index b47d3156..996f78fe 100644 --- a/css/masks/corner-cuts.css +++ b/css/masks/corner-cuts.css @@ -1,26 +1,53 @@ -:where(html) { - --mask-corner-cut-circles-1: radial-gradient(1rem at 1rem 1rem,#0000 99%,#000) -1rem -1rem; - --mask-corner-cut-circles-2: radial-gradient(2rem at 2rem 2rem,#0000 99%,#000) -2rem -2rem; - --mask-corner-cut-circles-3: radial-gradient(4rem at 4rem 4rem,#0000 99%,#000) -4rem -4rem; - --mask-corner-cut-squares-1: conic-gradient(at calc(2*1rem) calc(2*1rem),#000 75%,#0000 0) -1rem -1rem; - --mask-corner-cut-squares-2: conic-gradient(at calc(2*2rem) calc(2*2rem),#000 75%,#0000 0) -2rem -2rem; - --mask-corner-cut-squares-3: conic-gradient(at calc(2*4rem) calc(2*4rem),#000 75%,#0000 0) -4rem -4rem; - --mask-corner-cut-angles-1: - conic-gradient(from -45deg at 1rem 1rem,#0000 25%,#000 0) - -1rem 0 /100% 51% repeat-x, - conic-gradient(from 135deg at 1rem calc(100% - 1rem),#0000 25%,#000 0) - -1rem 100%/100% 51% repeat-x - ; - --mask-corner-cut-angles-2: - conic-gradient(from -45deg at 2rem 2rem,#0000 25%,#000 0) - -2rem 0 /100% 51% repeat-x, - conic-gradient(from 135deg at 2rem calc(100% - 2rem),#0000 25%,#000 0) - -2rem 100%/100% 51% repeat-x - ; - --mask-corner-cut-angles-3: - conic-gradient(from -45deg at 4rem 4rem,#0000 25%,#000 0) - -4rem 0 /100% 51% repeat-x, - conic-gradient(from 135deg at 4rem calc(100% - 4rem),#0000 25%,#000 0) - -4rem 100%/100% 51% repeat-x - ; +:where(:root) { + --mask-corner-cut-circles-1: radial-gradient( + 1rem at 1rem 1rem, + #0000 99%, + #000 + ) -1rem -1rem; + --mask-corner-cut-circles-2: radial-gradient( + 2rem at 2rem 2rem, + #0000 99%, + #000 + ) -2rem -2rem; + --mask-corner-cut-circles-3: radial-gradient( + 4rem at 4rem 4rem, + #0000 99%, + #000 + ) -4rem -4rem; + --mask-corner-cut-squares-1: conic-gradient( + at calc(2 * 1rem) calc(2 * 1rem), + #000 75%, + #0000 0 + ) -1rem -1rem; + --mask-corner-cut-squares-2: conic-gradient( + at calc(2 * 2rem) calc(2 * 2rem), + #000 75%, + #0000 0 + ) -2rem -2rem; + --mask-corner-cut-squares-3: conic-gradient( + at calc(2 * 4rem) calc(2 * 4rem), + #000 75%, + #0000 0 + ) -4rem -4rem; + --mask-corner-cut-angles-1: conic-gradient( + from -45deg at 1rem 1rem, + #0000 25%, + #000 0 + ) -1rem 0 /100% 51% repeat-x, + conic-gradient(from 135deg at 1rem calc(100% - 1rem), #0000 25%, #000 0) -1rem + 100%/100% 51% repeat-x; + --mask-corner-cut-angles-2: conic-gradient( + from -45deg at 2rem 2rem, + #0000 25%, + #000 0 + ) -2rem 0 /100% 51% repeat-x, + conic-gradient(from 135deg at 2rem calc(100% - 2rem), #0000 25%, #000 0) -2rem + 100%/100% 51% repeat-x; + --mask-corner-cut-angles-3: conic-gradient( + from -45deg at 4rem 4rem, + #0000 25%, + #000 0 + ) -4rem 0 /100% 51% repeat-x, + conic-gradient(from 135deg at 4rem calc(100% - 4rem), #0000 25%, #000 0) -4rem + 100%/100% 51% repeat-x; } diff --git a/css/masks/edges.css b/css/masks/edges.css index bcff9799..ec9febca 100644 --- a/css/masks/edges.css +++ b/css/masks/edges.css @@ -1,76 +1,123 @@ -:where(html) { - --mask-edge-scoop-bottom: radial-gradient(20px at 50% 100%,#0000 97%,#000) 50% / calc(1.9 * 20px) 100%; - --mask-edge-scoop-top: radial-gradient(20px at 50% 0,#0000 97%,#000) 50% / calc(1.9 * 20px) 100%; - --mask-edge-scoop-vertical: radial-gradient(20px at 50% 20px,#0000 97%,#000) 50% -20px/ calc(1.9 * 20px) 100%; - --mask-edge-scoop-left: radial-gradient(20px at 0 50%,#0000 97%,#000) 50%/ 100% calc(1.9 * 20px); - --mask-edge-scoop-right: radial-gradient(20px at 100% 50%,#0000 97%,#000) 50%/ 100% calc(1.9 * 20px); - --mask-edge-scoop-horizontal: radial-gradient(20px at 20px 50%,#0000 97%,#000) -20px/ 100% calc(1.9 * 20px); - --mask-edge-scalloped: - radial-gradient(farthest-side,#000 97%,#0000) 0 0 / 20px 20px round, - linear-gradient(#000 0 0) 50%/calc(100% - 20px) calc(100% - 20px) no-repeat - ; - --mask-edge-scalloped-bottom: - linear-gradient(to top,#0000 20px,#000 0), - radial-gradient(20px at top,#000 97%,#0000) bottom / calc(1.9 * 20px) 20px - ; - --mask-edge-scalloped-top: - linear-gradient(to bottom,#0000 20px,#000 0), - radial-gradient(20px at bottom,#000 97%,#0000) top / calc(1.9 * 20px) 20px - ; - --mask-edge-scalloped-vertical: - linear-gradient(0deg,#0000 calc(2 * 20px),#000 0) 0 20px, - radial-gradient(20px,#000 97%,#0000) 50% / calc(1.9 * 20px) calc(2 * 20px) repeat space - ; - --mask-edge-scalloped-left: - linear-gradient(to right,#0000 20px,#000 0), - radial-gradient(20px at right,#000 97%,#0000) left / 20px calc(1.9 * 20px) - ; - --mask-edge-scalloped-right: - linear-gradient(to left,#0000 20px,#000 0), - radial-gradient(20px at left,#000 97%,#0000) right / 20px calc(1.9 * 20px) - ; - --mask-edge-scalloped-horizontal: - linear-gradient(-90deg,#0000 calc(2 * 20px),#000 0) 20px, - radial-gradient(20px,#000 97%,#0000) 50% / calc(2 * 20px) calc(1.9 * 20px) space repeat - ; - --mask-edge-drip-bottom: - radial-gradient(20px at bottom,#0000 97%,#000) 50% calc(100% - 20px) / calc(2 * 20px) 100% repeat-x, - radial-gradient(20px at 25% 50%,#000 97%,#0000) calc(50% - 20px) 99% / calc(4 * 20px) calc(2 * 20px) repeat-x - ; - --mask-edge-drip-top: - radial-gradient(20px at top,#0000 97%,#000) 50% 20px / calc(2 * 20px) 100% repeat-x, - radial-gradient(20px at 25% 50%,#000 97%,#0000) calc(50% - 20px) 1% / calc(4 * 20px) calc(2 * 20px) repeat-x - ; - --mask-edge-drip-vertical: - radial-gradient(20px at top ,#0000 97%,#000) 50% 20px / calc(2 * 20px) 51% repeat-x, - radial-gradient(20px at bottom,#0000 97%,#000) 50% calc(100% - 20px) / calc(2 * 20px) 51% repeat-x, - radial-gradient(20px at 25% 50%,#000 97%,#0000) calc(50% - 20px) 1% / calc(4 * 20px) calc(2 * 20px) repeat-x, - radial-gradient(20px at 25% 50%,#000 97%,#0000) calc(50% - 3*20px) 99% / calc(4 * 20px) calc(2 * 20px) repeat-x - ; - --mask-edge-drip-left: - radial-gradient(20px at left,#0000 97%,#000) 20px 50% / 100% calc(2 * 20px) repeat-y, - radial-gradient(20px at 50% 25%,#000 97%,#0000) 1% calc(50% - 20px) / calc(2 * 20px) calc(4 * 20px) repeat-y - ; - --mask-edge-drip-right: - radial-gradient(20px at right,#0000 97%,#000) calc(100% - 20px) 50% / 100% calc(2 * 20px) repeat-y, - radial-gradient(20px at 50% 25%,#000 97%,#0000) 99% calc(50% - 20px) / calc(2 * 20px) calc(4 * 20px) repeat-y - ; - --mask-edge-drip-horizontal: - radial-gradient(20px at left ,#0000 97%,#000) 20px 50% / 51% calc(2 * 20px) repeat-y, - radial-gradient(20px at right,#0000 97%,#000) calc(100% - 20px) 50% / 51% calc(2 * 20px) repeat-y, - radial-gradient(20px at 50% 25%,#000 97%,#0000) 1% calc(50% - 20px) / calc(2 * 20px) calc(4 * 20px) repeat-y, - radial-gradient(20px at 50% 25%,#000 97%,#0000) 99% calc(50% - 3*20px) / calc(2 * 20px) calc(4 * 20px) repeat-y - ; - --mask-edge-zig-zag-top: conic-gradient(from 135deg at top,#0000,#000 1deg 90deg,#0000 91deg) 50% / calc(2 * 20px) 100%; - --mask-edge-zig-zag-bottom: conic-gradient(from -45deg at bottom,#0000,#000 1deg 90deg,#0000 91deg) 50% / calc(2 * 20px) 100%; - --mask-edge-zig-zag-left: conic-gradient(from 45deg at left,#0000,#000 1deg 90deg,#0000 91deg) 50% / 100% calc(2 * 20px); - --mask-edge-zig-zag-right: conic-gradient(from -135deg at right,#0000,#000 1deg 90deg,#0000 91deg) 50% / 100% calc(2 * 20px); - --mask-edge-zig-zag-horizontal: - conic-gradient(from 45deg at left ,#0000,#000 1deg 90deg,#0000 91deg) left / 51% calc(2 * 20px) repeat-y, - conic-gradient(from -135deg at right,#0000,#000 1deg 90deg,#0000 91deg) right / 51% calc(2 * 20px) repeat-y - ; - --mask-edge-zig-zag-vertical: - conic-gradient(from 135deg at top ,#0000,#000 1deg 90deg,#0000 91deg) top / calc(2 * 20px) 51% repeat-x, - conic-gradient(from -45deg at bottom,#0000,#000 1deg 90deg,#0000 91deg) bottom / calc(2 * 20px) 51% repeat-x - ; +:where(:root) { + --mask-edge-scoop-bottom: radial-gradient(20px at 50% 100%, #0000 97%, #000) + 50% / calc(1.9 * 20px) 100%; + --mask-edge-scoop-top: radial-gradient(20px at 50% 0, #0000 97%, #000) 50% / + calc(1.9 * 20px) 100%; + --mask-edge-scoop-vertical: radial-gradient(20px at 50% 20px, #0000 97%, #000) + 50% -20px / calc(1.9 * 20px) 100%; + --mask-edge-scoop-left: radial-gradient(20px at 0 50%, #0000 97%, #000) 50%/ 100% + calc(1.9 * 20px); + --mask-edge-scoop-right: radial-gradient(20px at 100% 50%, #0000 97%, #000) + 50%/ 100% calc(1.9 * 20px); + --mask-edge-scoop-horizontal: radial-gradient( + 20px at 20px 50%, + #0000 97%, + #000 + ) -20px/ 100% calc(1.9 * 20px); + --mask-edge-scalloped: radial-gradient(farthest-side, #000 97%, #0000) 0 0 / + 20px 20px round, + linear-gradient(#000 0 0) 50% / calc(100% - 20px) calc(100% - 20px) + no-repeat; + --mask-edge-scalloped-bottom: linear-gradient(to top, #0000 20px, #000 0), + radial-gradient(20px at top, #000 97%, #0000) bottom / calc(1.9 * 20px) 20px; + --mask-edge-scalloped-top: linear-gradient(to bottom, #0000 20px, #000 0), + radial-gradient(20px at bottom, #000 97%, #0000) top / calc(1.9 * 20px) 20px; + --mask-edge-scalloped-vertical: linear-gradient( + 0deg, + #0000 calc(2 * 20px), + #000 0 + ) + 0 20px, + radial-gradient(20px, #000 97%, #0000) 50% / calc(1.9 * 20px) calc(2 * 20px) + repeat space; + --mask-edge-scalloped-left: linear-gradient(to right, #0000 20px, #000 0), + radial-gradient(20px at right, #000 97%, #0000) left / 20px calc(1.9 * 20px); + --mask-edge-scalloped-right: linear-gradient(to left, #0000 20px, #000 0), + radial-gradient(20px at left, #000 97%, #0000) right / 20px calc(1.9 * 20px); + --mask-edge-scalloped-horizontal: linear-gradient( + -90deg, + #0000 calc(2 * 20px), + #000 0 + ) + 20px, + radial-gradient(20px, #000 97%, #0000) 50% / calc(2 * 20px) calc(1.9 * 20px) + space repeat; + --mask-edge-drip-bottom: radial-gradient(20px at bottom, #0000 97%, #000) 50% + calc(100% - 20px) / calc(2 * 20px) 100% repeat-x, + radial-gradient(20px at 25% 50%, #000 97%, #0000) calc(50% - 20px) 99% / + calc(4 * 20px) calc(2 * 20px) repeat-x; + --mask-edge-drip-top: radial-gradient(20px at top, #0000 97%, #000) 50% 20px / + calc(2 * 20px) 100% repeat-x, + radial-gradient(20px at 25% 50%, #000 97%, #0000) calc(50% - 20px) 1% / + calc(4 * 20px) calc(2 * 20px) repeat-x; + --mask-edge-drip-vertical: radial-gradient(20px at top, #0000 97%, #000) 50% + 20px / calc(2 * 20px) 51% repeat-x, + radial-gradient(20px at bottom, #0000 97%, #000) 50% calc(100% - 20px) / + calc(2 * 20px) 51% repeat-x, + radial-gradient(20px at 25% 50%, #000 97%, #0000) calc(50% - 20px) 1% / + calc(4 * 20px) calc(2 * 20px) repeat-x, + radial-gradient(20px at 25% 50%, #000 97%, #0000) calc(50% - 3 * 20px) 99% / + calc(4 * 20px) calc(2 * 20px) repeat-x; + --mask-edge-drip-left: radial-gradient(20px at left, #0000 97%, #000) 20px 50% / + 100% calc(2 * 20px) repeat-y, + radial-gradient(20px at 50% 25%, #000 97%, #0000) 1% calc(50% - 20px) / + calc(2 * 20px) calc(4 * 20px) repeat-y; + --mask-edge-drip-right: radial-gradient(20px at right, #0000 97%, #000) + calc(100% - 20px) 50% / 100% calc(2 * 20px) repeat-y, + radial-gradient(20px at 50% 25%, #000 97%, #0000) 99% calc(50% - 20px) / + calc(2 * 20px) calc(4 * 20px) repeat-y; + --mask-edge-drip-horizontal: radial-gradient(20px at left, #0000 97%, #000) + 20px 50% / 51% calc(2 * 20px) repeat-y, + radial-gradient(20px at right, #0000 97%, #000) calc(100% - 20px) 50% / 51% + calc(2 * 20px) repeat-y, + radial-gradient(20px at 50% 25%, #000 97%, #0000) 1% calc(50% - 20px) / + calc(2 * 20px) calc(4 * 20px) repeat-y, + radial-gradient(20px at 50% 25%, #000 97%, #0000) 99% calc(50% - 3 * 20px) / + calc(2 * 20px) calc(4 * 20px) repeat-y; + --mask-edge-zig-zag-top: conic-gradient( + from 135deg at top, + #0000, + #000 1deg 90deg, + #0000 91deg + ) + 50% / calc(2 * 20px) 100%; + --mask-edge-zig-zag-bottom: conic-gradient( + from -45deg at bottom, + #0000, + #000 1deg 90deg, + #0000 91deg + ) + 50% / calc(2 * 20px) 100%; + --mask-edge-zig-zag-left: conic-gradient( + from 45deg at left, + #0000, + #000 1deg 90deg, + #0000 91deg + ) + 50% / 100% calc(2 * 20px); + --mask-edge-zig-zag-right: conic-gradient( + from -135deg at right, + #0000, + #000 1deg 90deg, + #0000 91deg + ) + 50% / 100% calc(2 * 20px); + --mask-edge-zig-zag-horizontal: conic-gradient( + from 45deg at left, + #0000, + #000 1deg 90deg, + #0000 91deg + ) + left / 51% calc(2 * 20px) repeat-y, + conic-gradient(from -135deg at right, #0000, #000 1deg 90deg, #0000 91deg) + right / 51% calc(2 * 20px) repeat-y; + --mask-edge-zig-zag-vertical: conic-gradient( + from 135deg at top, + #0000, + #000 1deg 90deg, + #0000 91deg + ) + top / calc(2 * 20px) 51% repeat-x, + conic-gradient(from -45deg at bottom, #0000, #000 1deg 90deg, #0000 91deg) + bottom / calc(2 * 20px) 51% repeat-x; } diff --git a/css/masks/grunge.css b/css/masks/grunge.css new file mode 100644 index 00000000..e69de29b diff --git a/css/packs/focus-highlight.css b/css/packs/focus-highlight.css index fdce7bfd..e630f502 100644 --- a/css/packs/focus-highlight.css +++ b/css/packs/focus-highlight.css @@ -1,4 +1,4 @@ -:where(html) { +:where(:root) { --highlight-size: 10px; --highlight-color: hsl(0 0% 0% / 20%); diff --git a/css/packs/layouts.css b/css/packs/layouts.css index f457de27..b96e2103 100644 --- a/css/packs/layouts.css +++ b/css/packs/layouts.css @@ -1,4 +1,4 @@ -:where(html) { +:where(:root) { --grid-cell: [stack] 1fr / [stack] 1fr; --grid-cell-name: stack; diff --git a/css/packs/utilities/index.css b/css/packs/utilities/index.css index 2a33e9f3..3b5aa30b 100644 --- a/css/packs/utilities/index.css +++ b/css/packs/utilities/index.css @@ -3,11 +3,10 @@ border-radius: var(--_rounded, var(--radius-2)); } -/* :where(.rounded-match) { - --_rounded: 0; - overflow: clip; - overflow-clip-margin: content-box; -} */ +:where(.rounded-match) { + overflow: clip; + overflow-clip-margin: content-box; +} :where(.padding) { --_padding: initial; @@ -164,6 +163,10 @@ font-size: var(--font-size-5); } +:where(.square) { + aspect-ratio: 1; +} + :where(.round) { aspect-ratio: 1; border-radius: var(--radius-round); diff --git a/css/packs/utilities/vanilla.css b/css/packs/utilities/vanilla.css index 6e650a1a..d85d7196 100644 --- a/css/packs/utilities/vanilla.css +++ b/css/packs/utilities/vanilla.css @@ -122,8 +122,12 @@ font-size: 3rem; } +:where(.square) { + aspect-ratio: 1; +} + :where(.round) { aspect-ratio: 1; - border-radius: 1e4px; + border-radius: 1e9px; overflow: clip; } diff --git a/css/svg/squircles.css b/css/svg/squircles.css index c8173136..cf558655 100644 --- a/css/svg/squircles.css +++ b/css/svg/squircles.css @@ -1,4 +1,4 @@ -:where(html) { +:where(:root) { --squircle-1: url("data:image/svg+xml,%3Csvg viewbox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d=' M 0, 75 C 0, 18.75 18.75, 0 75, 0 S 150, 18.75 150, 75 131.25, 150 75, 150 0, 131.25 0, 75 ' fill='%23FADB5F' transform='rotate( 0, 100, 100 ) translate( 25 25 )'%3E%3C/path%3E%3C/svg%3E"); --squircle-2: url("data:image/svg+xml,%3Csvg viewbox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d=' M 0, 75 C 0, 13.500000000000004 13.500000000000004, 0 75, 0 S 150, 13.500000000000004 150, 75 136.5, 150 75, 150 0, 136.5 0, 75 ' fill='%23FADB5F' transform='rotate( 0, 100, 100 ) translate( 25 25 )'%3E%3C/path%3E%3C/svg%3E"); --squircle-3: url("data:image/svg+xml,%3Csvg viewbox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d=' M 0, 75 C 0, 5.999999999999997 5.999999999999997, 0 75, 0 S 150, 5.999999999999997 150, 75 144, 150 75, 150 0, 144 0, 75 ' fill='%23FADB5F' transform='rotate( 0, 100, 100 ) translate( 25 25 )'%3E%3C/path%3E%3C/svg%3E"); diff --git a/css/z-index.css b/css/z-index.css index ed97002e..86fd0c83 100644 --- a/css/z-index.css +++ b/css/z-index.css @@ -1,8 +1,10 @@ -:where(html) { +:where(:root) { --layer-1: 1; --layer-2: 2; --layer-3: 3; --layer-4: 4; --layer-5: 5; + --layer-bottom: var(--layer-1); + --layer-top: var(--layer-5); --layer-important: 2147483647; } diff --git a/js/svg/noises.js b/js/svg/noises.js index dec3e71a..98fe5d9d 100644 --- a/js/svg/noises.js +++ b/js/svg/noises.js @@ -13,3 +13,8 @@ export const NoiseFilters = [ 'contrast(200%) brightness(500%)', 'contrast(200%) brightness(1000%)', ] + +export default { + Noises, + NoiseFilters, +} diff --git a/package.json b/package.json index bbd22d6f..7d65705a 100644 --- a/package.json +++ b/package.json @@ -18,10 +18,10 @@ "gradients", "color" ], - "style": "open-props.min.css", + "style": "index.css", "source": "js/index.js", "main": "js/index.js", - "unpkg": "open-props.min.css", + "unpkg": "index.css", "module": "js/index.js", "exports": { ".": { @@ -42,21 +42,22 @@ "scripts": { "test": "ava test/basic.test.cjs", "build": "concurrently npm:lib:* -m 25", - "lib:main": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/index.css -o open-props.min.css", - "lib:main:v2": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/index.v2.css -o open-props.v2.css", - "lib:normalize": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/packs/normalize/index.css -o normalize.min.css", - "lib:normalize:v2": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/packs/normalize/index.v2.css -o normalize.v2.css", - "lib:buttons": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/packs/buttons/index.css -o buttons.min.css", - "lib:forms": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/packs/forms/index.css -o forms.min.css", - "lib:animate": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/packs/animate/index.css -o animate.min.css", - "lib:utilities": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/packs/utilities/index.css -o utilities.min.css", - "lib:general-utilities": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/packs/utilities/vanilla.css -o general-utilities.min.css", - "lib:animations": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/motion/animations.css -o animations.min.css", - "lib:easings": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/motion/easings.css -o easings.min.css", - "lib:color:palette:oklch": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/color/palette.oklch.css -o palette.min.css", - "lib:color:hues:oklch": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/color/hues.oklch.css -o hues.oklch.min.css", - "lib:color:hex": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/color/index.hex.css -o hex.min.css", - "lib:color:hsl": "lightningcss --bundle --custom-media --minify -t 'last 2 versions' css/color/index.hsl.css -o hsl.min.css" + "lib:main": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/index.css -o open-props.min.css", + "lib:main:v2": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/index.v2.css -o index.css", + "lib:normalize": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/packs/normalize/index.css -o normalize.min.css", + "lib:normalize:v2": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/packs/normalize/index.v2.css -o normalize.css", + "lib:buttons": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/packs/buttons/index.css -o buttons.css", + "lib:forms": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/packs/forms/index.css -o forms.css", + "lib:animate": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/packs/animate/index.css -o animate.css", + "lib:utilities": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/packs/utilities/index.css -o utilities.css", + "lib:general-utilities": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/packs/utilities/vanilla.css -o general-utilities.css", + "lib:animations": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/motion/animations.css -o animations.css", + "lib:easings": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/motion/easings.css -o easings.css", + "lib:color:palette:oklch": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/color/palette.oklch.css -o palette.css", + "lib:color:hues:oklch": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/color/hues.oklch.css -o hues.oklch.css", + "lib:color:neon": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/color/neon.p3.css -o neon.p3.css", + "lib:color:hex": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/color/index.hex.css -o hex.css", + "lib:color:hsl": "lightningcss --bundle --custom-media --minify -t 'last 2 Chrome versions, last 2 Safari versions, last 2 Firefox versions' css/color/index.hsl.css -o hsl.css" }, "devDependencies": { "ava": "^5.3.1",