From 909ab7f9448a1048ee55ab5c8ac031f4cfc672ff Mon Sep 17 00:00:00 2001 From: dev Date: Thu, 4 Jun 2026 23:56:51 +0200 Subject: [PATCH] feat(eidos): wide-gamut OKLCH output, default-on (RFC Phase 2, strategy A) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Each palette step is now emitted twice: the hex as a universal fallback, then an oklch() sibling that wins where supported (Chrome 111+/Safari 15.4+/Firefox 113+). The token layer is now OKLCH-native and wide-gamut-ready, with NO @media and NO config flag (it is the default behaviour). - render-css `appendColorScaleDeclarations`: hex line + `oklch()` sibling per `--scale-{name}-{step}`. Only opaque, parseable steps get the sibling; empty/ non-color values keep just the fallback. `--primitive-*`/`--color-*` are var() refs (untouched); alpha scales stay color-mix/rgba. - generated/base.css regenerated (+744 oklch sibling lines: 31 scales x 12 x 2 modes). Honest scope: the shipped Radix palette is authored in sRGB hex, so its oklch() siblings are sRGB-equivalent (verified: --scale-purple-9 -> oklch(0.5556 0.1829 305.86) paints #8e4ec6) -- identical today. The win is the OKLCH-native foundation: an OKLCH-authored theme or a vivid generated scheme now renders wider on P3 with no extra work. Making the SHIPPED palette visibly wide-gamut is Phase 3. Tests: full eidos suite green except 3 pre-existing words-track failures (confirmed unrelated via baseline). Docs: RFC §7 (status) + THEMING §27 + README ref row. Co-Authored-By: Claude Opus 4.8 (1M context) --- src/uix/eidos/COLOR_ENGINE_RFC.md | 16 +- src/uix/eidos/README.md | 1 + src/uix/eidos/THEMING.md | 26 ++ src/uix/eidos/generated/base.css | 744 ++++++++++++++++++++++++++++++ src/uix/eidos/lib/render-css.ts | 12 +- 5 files changed, 796 insertions(+), 3 deletions(-) diff --git a/src/uix/eidos/COLOR_ENGINE_RFC.md b/src/uix/eidos/COLOR_ENGINE_RFC.md index cef3b3c29..2c7e51dc0 100644 --- a/src/uix/eidos/COLOR_ENGINE_RFC.md +++ b/src/uix/eidos/COLOR_ENGINE_RFC.md @@ -368,7 +368,21 @@ const result = eidos.applyColorScheme('#8e4ec6', { ## 7. Salida wide-gamut (P3 + sRGB) -Dos estrategias; el motor soporta ambas vía opción de config, default = **A**. +**Estado: estrategia A implementada, default-on** (2026-06-04). `render-css` emite por +cada paso de paleta el **hex (fallback universal)** + un hermano **`oklch()`** que gana +donde se soporta (`appendColorScaleDeclarations`). SIN flag de config: es el +comportamiento por defecto. La estrategia B (P3 explícito vía `@media`) NO está +implementada (se añadiría como opción si una app necesita afinar valores P3 a mano). + +**Honestidad sobre el efecto visible**: la paleta por defecto (Radix) está autorada en +**hex sRGB**, así que su `oklch()` es **sRGB-equivalente** — no hay datos P3 que +recuperar de un sRGB, se ve idéntico hoy (verificado: `--scale-purple-9` → +`oklch(0.5556 0.1829 305.86)` pinta `#8e4ec6`). El valor es que el token-layer es ahora +**OKLCH-nativo y wide-gamut-ready**: un tema autorado en OKLCH, o un esquema generado +con un seed vívido, renderiza más saturado en P3 **sin trabajo extra**. Hacer la paleta +SHIPPED visiblemente wide-gamut es Fase 3 (autorar/generar la paleta en OKLCH). + +Dos estrategias (histórico de diseño): ### A. OKLCH-directo + fallback hex (recomendado · estilo Tailwind v4) diff --git a/src/uix/eidos/README.md b/src/uix/eidos/README.md index ffabc3416..c32e2c60a 100644 --- a/src/uix/eidos/README.md +++ b/src/uix/eidos/README.md @@ -577,6 +577,7 @@ Resumen rápido de lo que cubre, para no duplicar aquí: | **Correcciones P2: texto on-solid por luminancia + superficies translúcidas** | §24 | | **Modelo de color: paleta (31 escalas) + roles (alias) + intents (auto-derivados)** | §25 | | **Theme builder en runtime: `eidos.applyColorScheme(seed)` (motor `uix.color`)** | §26 | +| **Salida wide-gamut OKLCH default-on (hex fallback + `oklch()` sibling)** | §27 | Lo que sigue en este README son las decisiones operativas de la **capa visual como módulo** (typography sourcing, picker patterns, API diff --git a/src/uix/eidos/THEMING.md b/src/uix/eidos/THEMING.md index 0cef174af..5dd8e8848 100644 --- a/src/uix/eidos/THEMING.md +++ b/src/uix/eidos/THEMING.md @@ -55,6 +55,7 @@ 24. [Correcciones P2 del engine (2026-06-02)](#24-correcciones-p2-del-engine-2026-06-02) 25. [Modelo de color — paleta + roles/intents derivados](#25-modelo-de-color--paleta--rolesintents-derivados-2026-06-02) 26. [Theme builder en runtime — `eidos.applyColorScheme`](#26-theme-builder-en-runtime--eidosapplycolorscheme-2026-06-04) +27. [Salida wide-gamut OKLCH (default-on)](#27-salida-wide-gamut-oklch-default-on-2026-06-04) --- @@ -2179,6 +2180,31 @@ Demo en vivo: `/temas/color` (el builder usa el mismo `buildScheme`). Tests: --- +## 27. Salida wide-gamut OKLCH (default-on) (2026-06-04) + +RFC §7 estrategia A, **implementada por defecto**. Cada paso de paleta se emite dos +veces: el **hex como fallback universal** + un hermano **`oklch()`** que gana donde el +navegador lo soporta (Chrome 111+ / Safari 15.4+ / Firefox 113+). + +```css +:root { + --scale-purple-9: #8e4ec6; /* fallback sRGB */ + --scale-purple-9: oklch(0.5556 0.1829 305.86); /* gana -> gamut del display */ +} +``` + +- **Solo las hojas opacas** `--scale-{name}-{step}` ganan el hermano; las capas + `--primitive-*` / `--color-*` son `var()` (heredan) y las alpha siguen como + `color-mix` / rgba. Valores vacíos / no-color no reciben hermano. +- **sRGB idéntico**: el hex y el `oklch()` derivado de un sRGB pintan el mismo color + (verificado: `--scale-purple-9` → `oklch(...)` pinta `#8e4ec6`). El wide-gamut REAL + aparece cuando el origen excede sRGB (tema OKLCH / esquema generado vívido). La + paleta Radix shipped es sRGB → idéntica hoy; wide-gamut **visible** de la paleta = Fase 3. +- **Default-on, sin flag**: es el comportamiento del framework. + `render-css.ts > appendColorScaleDeclarations`. + +--- + **Última revisión**: 2026-06-04. Si algo en este doc no coincide con el código, el código gana — pero abre un issue para que actualicemos el doc. diff --git a/src/uix/eidos/generated/base.css b/src/uix/eidos/generated/base.css index d44098364..9df5fa2b9 100644 --- a/src/uix/eidos/generated/base.css +++ b/src/uix/eidos/generated/base.css @@ -4923,17 +4923,29 @@ [data-theme='base-light'], [data-theme='light'] { --scale-gray-1: #fcfcfc; + --scale-gray-1: oklch(0.9911 0 0); --scale-gray-2: #f9f9f9; + --scale-gray-2: oklch(0.9821 0 0); --scale-gray-3: #f0f0f0; + --scale-gray-3: oklch(0.9551 0 0); --scale-gray-4: #e8e8e8; + --scale-gray-4: oklch(0.931 0 0); --scale-gray-5: #e0e0e0; + --scale-gray-5: oklch(0.9067 0 0); --scale-gray-6: #d9d9d9; + --scale-gray-6: oklch(0.8853 0 0); --scale-gray-7: #cecece; + --scale-gray-7: oklch(0.8514 0 0); --scale-gray-8: #bbbbbb; + --scale-gray-8: oklch(0.7921 0 0); --scale-gray-9: #8d8d8d; + --scale-gray-9: oklch(0.6434 0 0); --scale-gray-10: #838383; + --scale-gray-10: oklch(0.61 0 0); --scale-gray-11: #646464; + --scale-gray-11: oklch(0.5032 0 0); --scale-gray-12: #202020; + --scale-gray-12: oklch(0.2435 0 0); --scale-gray-a1: rgb(0 0 0 / 0.0118); --scale-gray-a2: rgb(0 0 0 / 0.0235); --scale-gray-a3: rgb(0 0 0 / 0.0588); @@ -4947,17 +4959,29 @@ --scale-gray-a11: rgb(0 0 0 / 0.6078); --scale-gray-a12: rgb(0 0 0 / 0.8745); --scale-slate-1: #fcfcfd; + --scale-slate-1: oklch(0.9913 0.0013 286.38); --scale-slate-2: #f9f9fb; + --scale-slate-2: oklch(0.9827 0.0026 286.35); --scale-slate-3: #f0f0f3; + --scale-slate-3: oklch(0.956 0.004 286.32); --scale-slate-4: #e8e8ec; + --scale-slate-4: oklch(0.9321 0.0054 286.3); --scale-slate-5: #e0e1e6; + --scale-slate-5: oklch(0.9104 0.0068 277.16); --scale-slate-6: #d9d9e0; + --scale-slate-6: oklch(0.8873 0.0095 286.2); --scale-slate-7: #cdced6; + --scale-slate-7: oklch(0.853 0.0111 280.45); --scale-slate-8: #b9bbc6; + --scale-slate-8: oklch(0.7938 0.0156 277.79); --scale-slate-9: #8b8d98; + --scale-slate-9: oklch(0.6453 0.0165 277.7); --scale-slate-10: #80838d; + --scale-slate-10: oklch(0.6108 0.0155 272.56); --scale-slate-11: #60646c; + --scale-slate-11: oklch(0.5025 0.0136 264.44); --scale-slate-12: #1c2024; + --scale-slate-12: oklch(0.2411 0.0097 248.23); --scale-slate-a1: rgb(0 0 85 / 0.0118); --scale-slate-a2: rgb(0 0 85 / 0.0235); --scale-slate-a3: rgb(0 0 51 / 0.0588); @@ -4971,17 +4995,29 @@ --scale-slate-a11: rgb(0 6 19 / 0.6235); --scale-slate-a12: rgb(0 4 9 / 0.8902); --scale-blue-1: #fbfdff; + --scale-blue-1: oklch(0.9931 0.0034 247.86); --scale-blue-2: #f4faff; + --scale-blue-2: oklch(0.982 0.0092 242.83); --scale-blue-3: #e6f4fe; + --scale-blue-3: oklch(0.9597 0.0201 238.66); --scale-blue-4: #d5efff; + --scale-blue-4: oklch(0.9381 0.035 234.8); --scale-blue-5: #c2e5ff; + --scale-blue-5: oklch(0.9051 0.0513 240.31); --scale-blue-6: #acd8fc; + --scale-blue-6: oklch(0.8633 0.0682 243.32); --scale-blue-7: #8ec8f6; + --scale-blue-7: oklch(0.8098 0.0887 243.05); --scale-blue-8: #5eb1ef; + --scale-blue-8: oklch(0.7336 0.1214 243.09); --scale-blue-9: #0090ff; + --scale-blue-9: oklch(0.6493 0.193 251.78); --scale-blue-10: #0588f0; + --scale-blue-10: oklch(0.6223 0.1831 251.7); --scale-blue-11: #0d74ce; + --scale-blue-11: oklch(0.5558 0.1622 252.19); --scale-blue-12: #113264; + --scale-blue-12: oklch(0.324 0.0964 258.82); --scale-blue-a1: rgb(0 128 255 / 0.0157); --scale-blue-a2: rgb(0 139 255 / 0.0431); --scale-blue-a3: rgb(0 143 245 / 0.098); @@ -4995,17 +5031,29 @@ --scale-blue-a11: rgb(0 109 203 / 0.949); --scale-blue-a12: rgb(0 35 89 / 0.9333); --scale-cyan-1: #fafdfe; + --scale-cyan-1: oklch(0.9921 0.0035 219.53); --scale-cyan-2: #f2fafb; + --scale-cyan-2: oklch(0.9794 0.0086 205.9); --scale-cyan-3: #def7f9; + --scale-cyan-3: oklch(0.9586 0.0263 202.56); --scale-cyan-4: #caf1f6; + --scale-cyan-4: oklch(0.9321 0.0409 205.98); --scale-cyan-5: #b5e9f0; + --scale-cyan-5: oklch(0.9004 0.0539 206.45); --scale-cyan-6: #9ddde7; + --scale-cyan-6: oklch(0.8579 0.0659 208.14); --scale-cyan-7: #7dcedc; + --scale-cyan-7: oklch(0.8045 0.0816 209.7); --scale-cyan-8: #3db9cf; + --scale-cyan-8: oklch(0.7276 0.1102 211.93); --scale-cyan-9: #00a2c7; + --scale-cyan-9: oklch(0.66 0.1217 221.74); --scale-cyan-10: #0797b9; + --scale-cyan-10: oklch(0.627 0.1143 221.5); --scale-cyan-11: #107d98; + --scale-cyan-11: oklch(0.547 0.0966 220.75); --scale-cyan-12: #0d3c48; + --scale-cyan-12: oklch(0.3314 0.0527 218.83); --scale-cyan-a1: rgb(0 153 204 / 0.0196); --scale-cyan-a2: rgb(0 157 177 / 0.051); --scale-cyan-a3: rgb(0 193 209 / 0.1294); @@ -5019,17 +5067,29 @@ --scale-cyan-a11: rgb(0 116 145 / 0.9373); --scale-cyan-a12: rgb(0 50 62 / 0.949); --scale-teal-1: #fafefd; + --scale-teal-1: oklch(0.9937 0.0044 179.74); --scale-teal-2: #f3fbf9; + --scale-teal-2: oklch(0.9815 0.0088 179.61); --scale-teal-3: #e0f8f3; + --scale-teal-3: oklch(0.9603 0.0259 181.86); --scale-teal-4: #ccf3ea; + --scale-teal-4: oklch(0.934 0.0421 179.8); --scale-teal-5: #b8eae0; + --scale-teal-5: oklch(0.8995 0.0531 181.47); --scale-teal-6: #a1ded2; + --scale-teal-6: oklch(0.8558 0.0643 181.17); --scale-teal-7: #83cdc1; + --scale-teal-7: oklch(0.7964 0.076 182.97); --scale-teal-8: #53b9ab; + --scale-teal-8: oklch(0.7214 0.0974 183.28); --scale-teal-9: #12a594; + --scale-teal-9: oklch(0.6491 0.1136 181.96); --scale-teal-10: #0d9b8a; + --scale-teal-10: oklch(0.6193 0.1094 181.3); --scale-teal-11: #008573; + --scale-teal-11: oklch(0.5521 0.101 178.79); --scale-teal-12: #0d3d38; + --scale-teal-12: oklch(0.3272 0.0507 184.99); --scale-teal-a1: rgb(0 204 153 / 0.0196); --scale-teal-a2: rgb(0 170 128 / 0.0471); --scale-teal-a3: rgb(0 197 156 / 0.1216); @@ -5043,17 +5103,29 @@ --scale-teal-a11: rgb(0 133 115 / 1); --scale-teal-a12: rgb(0 51 45 / 0.949); --scale-green-1: #fbfefc; + --scale-green-1: oklch(0.9942 0.0041 157.18); --scale-green-2: #f4fbf6; + --scale-green-2: oklch(0.9814 0.0099 155.1); --scale-green-3: #e6f6eb; + --scale-green-3: oklch(0.9582 0.0223 155.92); --scale-green-4: #d6f1df; + --scale-green-4: oklch(0.9335 0.0372 156.43); --scale-green-5: #c4e8d1; + --scale-green-5: oklch(0.8988 0.0489 157.25); --scale-green-6: #adddc0; + --scale-green-6: oklch(0.8558 0.0641 158.2); --scale-green-7: #8eceaa; + --scale-green-7: oklch(0.7982 0.0832 159.15); --scale-green-8: #5bb98b; + --scale-green-8: oklch(0.7156 0.1133 160.28); --scale-green-9: #30a46c; + --scale-green-9: oklch(0.6406 0.1329 157.68); --scale-green-10: #2b9a66; + --scale-green-10: oklch(0.6115 0.1266 158.23); --scale-green-11: #218358; + --scale-green-11: oklch(0.5435 0.1116 159.5); --scale-green-12: #193b2d; + --scale-green-12: oklch(0.322 0.0475 164.53); --scale-green-a1: rgb(0 191 64 / 0.0157); --scale-green-a2: rgb(0 162 46 / 0.0431); --scale-green-a3: rgb(0 163 51 / 0.098); @@ -5067,17 +5139,29 @@ --scale-green-a11: rgb(0 113 63 / 0.8706); --scale-green-a12: rgb(0 38 22 / 0.902); --scale-yellow-1: #fdfdf9; + --scale-yellow-1: oklch(0.9929 0.0053 106.49); --scale-yellow-2: #fffce8; + --scale-yellow-2: oklch(0.9881 0.0263 99.9); --scale-yellow-3: #fffbd1; + --scale-yellow-3: oklch(0.9807 0.0544 102.85); --scale-yellow-4: #fff8bb; + --scale-yellow-4: oklch(0.9701 0.078 102.24); --scale-yellow-5: #fef2a4; + --scale-yellow-5: oklch(0.9531 0.0983 100.54); --scale-yellow-6: #f9e68c; + --scale-yellow-6: oklch(0.9211 0.1125 97.73); --scale-yellow-7: #efd36c; + --scale-yellow-7: oklch(0.8699 0.1268 94.4); --scale-yellow-8: #ebbc00; + --scale-yellow-8: oklch(0.8138 0.1663 90.49); --scale-yellow-9: #f5d90a; + --scale-yellow-9: oklch(0.8815 0.182 99.75); --scale-yellow-10: #f7ce00; + --scale-yellow-10: oklch(0.8613 0.1767 94.35); --scale-yellow-11: #946800; + --scale-yellow-11: oklch(0.5488 0.1138 79.47); --scale-yellow-12: #35290f; + --scale-yellow-12: oklch(0.2882 0.0439 84.56); --scale-yellow-a1: rgb(170 170 0 / 0.0235); --scale-yellow-a2: rgb(255 222 0 / 0.0902); --scale-yellow-a3: rgb(255 233 0 / 0.1804); @@ -5091,17 +5175,29 @@ --scale-yellow-a11: rgb(148 104 0 / 1); --scale-yellow-a12: rgb(40 28 0 / 0.9412); --scale-amber-1: #fefdfb; + --scale-amber-1: oklch(0.9943 0.0028 84.56); --scale-amber-2: #fefbe9; + --scale-amber-2: oklch(0.9856 0.0238 99.1); --scale-amber-3: #fff7c2; + --scale-amber-3: oklch(0.9695 0.0684 100.39); --scale-amber-4: #ffee9c; + --scale-amber-4: oklch(0.9447 0.1034 97.91); --scale-amber-5: #fbe577; + --scale-amber-5: oklch(0.918 0.1326 98.23); --scale-amber-6: #f3d673; + --scale-amber-6: oklch(0.8804 0.1233 93.39); --scale-amber-7: #e9c162; + --scale-amber-7: oklch(0.8273 0.1224 86.69); --scale-amber-8: #e2a336; + --scale-amber-8: oklch(0.7577 0.1403 76.72); --scale-amber-9: #ffc53d; + --scale-amber-9: oklch(0.8537 0.1572 84.13); --scale-amber-10: #ffba18; + --scale-amber-10: oklch(0.8313 0.1679 80.85); --scale-amber-11: #ab6400; + --scale-amber-11: oklch(0.5706 0.1291 63.94); --scale-amber-12: #4f3422; + --scale-amber-12: oklch(0.3522 0.0486 54.17); --scale-amber-a1: rgb(191 128 0 / 0.0157); --scale-amber-a2: rgb(243 209 0 / 0.0863); --scale-amber-a3: rgb(255 222 0 / 0.2392); @@ -5115,17 +5211,29 @@ --scale-amber-a11: rgb(171 100 0 / 1); --scale-amber-a12: rgb(52 21 0 / 0.8667); --scale-orange-1: #fefcfb; + --scale-orange-1: oklch(0.9923 0.0025 48.72); --scale-orange-2: #fff7ed; + --scale-orange-2: oklch(0.9796 0.0158 73.68); --scale-orange-3: #ffefd6; + --scale-orange-3: oklch(0.9583 0.0371 79.11); --scale-orange-4: #ffdfb5; + --scale-orange-4: oklch(0.92 0.0651 74.37); --scale-orange-5: #ffd19a; + --scale-orange-5: oklch(0.8879 0.0875 71.31); --scale-orange-6: #ffc182; + --scale-orange-6: oklch(0.8537 0.1068 66.02); --scale-orange-7: #f5ae73; + --scale-orange-7: oklch(0.8059 0.1123 59.96); --scale-orange-8: #ec9455; + --scale-orange-8: oklch(0.745 0.1322 54.68); --scale-orange-9: #f76b15; + --scale-orange-9: oklch(0.6908 0.1909 45.02); --scale-orange-10: #ef5f00; + --scale-orange-10: oklch(0.6624 0.1946 43.46); --scale-orange-11: #cc4e00; + --scale-orange-11: oklch(0.5855 0.1743 42.74); --scale-orange-12: #582d1d; + --scale-orange-12: oklch(0.3499 0.0685 40.83); --scale-orange-a1: rgb(191 64 0 / 0.0157); --scale-orange-a2: rgb(255 142 0 / 0.0706); --scale-orange-a3: rgb(255 155 0 / 0.1608); @@ -5139,17 +5247,29 @@ --scale-orange-a11: rgb(204 78 0 / 1); --scale-orange-a12: rgb(67 18 0 / 0.8863); --scale-red-1: #fffcfc; + --scale-red-1: oklch(0.9934 0.0032 17.21); --scale-red-2: #fff7f7; + --scale-red-2: oklch(0.9823 0.0086 17.3); --scale-red-3: #feebec; + --scale-red-3: oklch(0.9555 0.0207 13.86); --scale-red-4: #ffdbdc; + --scale-red-4: oklch(0.9217 0.0401 16); --scale-red-5: #ffcdce; + --scale-red-5: oklch(0.892 0.0567 16.93); --scale-red-6: #fdbdbe; + --scale-red-6: oklch(0.8569 0.0741 17.68); --scale-red-7: #f4a9aa; + --scale-red-7: oklch(0.807 0.0888 18.32); --scale-red-8: #eb8e90; + --scale-red-8: oklch(0.7443 0.1133 18.75); --scale-red-9: #e5484d; + --scale-red-9: oklch(0.6256 0.1933 23.03); --scale-red-10: #dc3e42; + --scale-red-10: oklch(0.599 0.1947 24.04); --scale-red-11: #ce2c31; + --scale-red-11: oklch(0.557 0.1974 25.17); --scale-red-12: #641723; + --scale-red-12: oklch(0.339 0.1089 16.6); --scale-red-a1: rgb(255 0 0 / 0.0118); --scale-red-a2: rgb(255 0 0 / 0.0314); --scale-red-a3: rgb(242 0 13 / 0.0784); @@ -5163,17 +5283,29 @@ --scale-red-a11: rgb(196 0 6 / 0.8275); --scale-red-a12: rgb(85 0 13 / 0.9098); --scale-pink-1: #fffcfe; + --scale-pink-1: oklch(0.9939 0.0041 337.35); --scale-pink-2: #fff7fc; + --scale-pink-2: oklch(0.9837 0.0107 339.33); --scale-pink-3: #feeef8; + --scale-pink-3: oklch(0.9646 0.0216 339.57); --scale-pink-4: #fce5f3; + --scale-pink-4: oklch(0.9444 0.031 340.55); --scale-pink-5: #f9d8ec; + --scale-pink-5: oklch(0.9154 0.0448 341.02); --scale-pink-6: #f3c6e2; + --scale-pink-6: oklch(0.8738 0.0625 340.71); --scale-pink-7: #ecadd4; + --scale-pink-7: oklch(0.8178 0.0888 341.61); --scale-pink-8: #e38ec3; + --scale-pink-8: oklch(0.7501 0.122 342.45); --scale-pink-9: #d6409f; + --scale-pink-9: oklch(0.6168 0.2076 346); --scale-pink-10: #d23197; + --scale-pink-10: oklch(0.5948 0.2167 347.04); --scale-pink-11: #cd1d8d; + --scale-pink-11: oklch(0.5703 0.2245 348.52); --scale-pink-12: #651249; + --scale-pink-12: oklch(0.3498 0.1289 345.36); --scale-pink-a1: rgb(255 0 170 / 0.0118); --scale-pink-a2: rgb(255 0 159 / 0.0314); --scale-pink-a3: rgb(240 0 150 / 0.0667); @@ -5187,17 +5319,29 @@ --scale-pink-a11: rgb(199 0 126 / 0.8863); --scale-pink-a12: rgb(89 0 59 / 0.9294); --scale-purple-1: #fefcfe; + --scale-purple-1: oklch(0.9932 0.0034 325.6); --scale-purple-2: #fbf7fe; + --scale-purple-2: oklch(0.9812 0.0101 311.18); --scale-purple-3: #f7edfe; + --scale-purple-3: oklch(0.9588 0.0249 311.71); --scale-purple-4: #f2e2fc; + --scale-purple-4: oklch(0.9333 0.0386 312.65); --scale-purple-5: #ead5f9; + --scale-purple-5: oklch(0.9012 0.0534 311.25); --scale-purple-6: #e0c4f4; + --scale-purple-6: oklch(0.8592 0.0718 311.05); --scale-purple-7: #d1afec; + --scale-purple-7: oklch(0.8043 0.0918 309.69); --scale-purple-8: #be93e4; + --scale-purple-8: oklch(0.7331 0.1225 307.97); --scale-purple-9: #8e4ec6; + --scale-purple-9: oklch(0.5556 0.1829 305.86); --scale-purple-10: #8347b9; + --scale-purple-10: oklch(0.5246 0.1755 305.39); --scale-purple-11: #8145b5; + --scale-purple-11: oklch(0.5168 0.1733 305.88); --scale-purple-12: #402060; + --scale-purple-12: oklch(0.3222 0.1102 303.84); --scale-purple-a1: rgb(170 0 170 / 0.0118); --scale-purple-a2: rgb(128 0 223 / 0.0314); --scale-purple-a3: rgb(142 0 241 / 0.0706); @@ -5211,17 +5355,29 @@ --scale-purple-a11: rgb(82 0 154 / 0.7294); --scale-purple-a12: rgb(37 0 73 / 0.8745); --scale-mauve-1: #fdfcfd; + --scale-mauve-1: oklch(0.9921 0.0017 325.59); --scale-mauve-2: #faf9fb; + --scale-mauve-2: oklch(0.9834 0.0028 308.43); --scale-mauve-3: #f2eff3; + --scale-mauve-3: oklch(0.9556 0.0062 317.75); --scale-mauve-4: #eae7ec; + --scale-mauve-4: oklch(0.9317 0.0074 312.3); --scale-mauve-5: #e3dfe6; + --scale-mauve-5: oklch(0.9088 0.0103 311.17); --scale-mauve-6: #dbd8e0; + --scale-mauve-6: oklch(0.8869 0.0113 303.09); --scale-mauve-7: #d0cdd7; + --scale-mauve-7: oklch(0.8537 0.0141 299.76); --scale-mauve-8: #bcbac7; + --scale-mauve-8: oklch(0.7945 0.0183 293.05); --scale-mauve-9: #8e8c99; + --scale-mauve-9: oklch(0.646 0.0193 292.92); --scale-mauve-10: #84828e; + --scale-mauve-10: oklch(0.6123 0.018 293.51); --scale-mauve-11: #65636d; + --scale-mauve-11: oklch(0.505 0.0158 295); --scale-mauve-12: #211f26; + --scale-mauve-12: oklch(0.2445 0.0134 298.46); --scale-mauve-a1: rgb(85 0 85 / 0.0118); --scale-mauve-a2: rgb(43 0 85 / 0.0235); --scale-mauve-a3: rgb(48 0 64 / 0.0627); @@ -5235,17 +5391,29 @@ --scale-mauve-a11: rgb(3 0 16 / 0.6118); --scale-mauve-a12: rgb(2 0 8 / 0.8784); --scale-sage-1: #fbfdfc; + --scale-sage-1: oklch(0.9923 0.0025 165.08); --scale-sage-2: #f7f9f8; + --scale-sage-2: oklch(0.9803 0.0025 165.08); --scale-sage-3: #eef1f0; + --scale-sage-3: oklch(0.9556 0.0035 174.48); --scale-sage-4: #e6e9e8; + --scale-sage-4: oklch(0.9314 0.0035 174.48); --scale-sage-5: #dfe2e0; + --scale-sage-5: oklch(0.9099 0.0042 157.17); --scale-sage-6: #d7dad9; + --scale-sage-6: oklch(0.8858 0.0035 174.47); --scale-sage-7: #cbcfcd; + --scale-sage-7: oklch(0.8508 0.0052 164.98); --scale-sage-8: #b8bcba; + --scale-sage-8: oklch(0.7915 0.0052 164.97); --scale-sage-9: #868e8b; + --scale-sage-9: oklch(0.6392 0.0103 171.61); --scale-sage-10: #7c8481; + --scale-sage-10: oklch(0.6057 0.0105 171.57); --scale-sage-11: #5f6563; + --scale-sage-11: oklch(0.5008 0.0081 174.11); --scale-sage-12: #1a211e; + --scale-sage-12: oklch(0.2396 0.0117 167.56); --scale-sage-a1: rgb(0 128 64 / 0.0157); --scale-sage-a2: rgb(0 64 32 / 0.0314); --scale-sage-a3: rgb(0 45 30 / 0.0667); @@ -5259,17 +5427,29 @@ --scale-sage-a11: rgb(0 10 6 / 0.6275); --scale-sage-a12: rgb(0 8 4 / 0.898); --scale-olive-1: #fcfdfc; + --scale-olive-1: oklch(0.993 0.0017 145.56); --scale-olive-2: #f8faf8; + --scale-olive-2: oklch(0.983 0.0034 145.55); --scale-olive-3: #eff1ef; + --scale-olive-3: oklch(0.9561 0.0034 145.55); --scale-olive-4: #e7e9e7; + --scale-olive-4: oklch(0.9319 0.0034 145.55); --scale-olive-5: #dfe2df; + --scale-olive-5: oklch(0.9096 0.0052 145.53); --scale-olive-6: #d7dad7; + --scale-olive-6: oklch(0.8852 0.0052 145.53); --scale-olive-7: #cccfcc; + --scale-olive-7: oklch(0.8513 0.0052 145.53); --scale-olive-8: #b9bcb8; + --scale-olive-8: oklch(0.7917 0.0065 137.78); --scale-olive-9: #898e87; + --scale-olive-9: oklch(0.6404 0.0118 136.58); --scale-olive-10: #7f847d; + --scale-olive-10: oklch(0.607 0.0119 136.59); --scale-olive-11: #60655f; + --scale-olive-11: oklch(0.5004 0.0112 140.5); --scale-olive-12: #1d211c; + --scale-olive-12: oklch(0.2417 0.011 139.43); --scale-olive-a1: rgb(0 85 0 / 0.0118); --scale-olive-a2: rgb(0 73 0 / 0.0275); --scale-olive-a3: rgb(0 32 0 / 0.0627); @@ -5283,17 +5463,29 @@ --scale-olive-a11: rgb(2 10 0 / 0.6275); --scale-olive-a12: rgb(1 6 0 / 0.8902); --scale-sand-1: #fdfdfc; + --scale-sand-1: oklch(0.9938 0.0013 106.42); --scale-sand-2: #f9f9f8; + --scale-sand-2: oklch(0.9818 0.0013 106.42); --scale-sand-3: #f1f0ef; + --scale-sand-3: oklch(0.9556 0.0017 67.8); --scale-sand-4: #e9e8e6; + --scale-sand-4: oklch(0.9312 0.0029 84.56); --scale-sand-5: #e2e1de; + --scale-sand-5: oklch(0.9097 0.0042 91.45); --scale-sand-6: #dad9d6; + --scale-sand-6: oklch(0.8852 0.0042 91.45); --scale-sand-7: #cfceca; + --scale-sand-7: oklch(0.8511 0.0056 95.11); --scale-sand-8: #bcbbb5; + --scale-sand-8: oklch(0.7911 0.0084 98.91); --scale-sand-9: #8d8d86; + --scale-sand-9: oklch(0.6413 0.0102 106.68); --scale-sand-10: #82827c; + --scale-sand-10: oklch(0.6048 0.0089 106.66); --scale-sand-11: #63635e; + --scale-sand-11: oklch(0.4981 0.0078 106.68); --scale-sand-12: #21201c; + --scale-sand-12: oklch(0.2431 0.0076 95.37); --scale-sand-a1: rgb(85 85 0 / 0.0118); --scale-sand-a2: rgb(36 36 0 / 0.0275); --scale-sand-a3: rgb(32 16 0 / 0.0627); @@ -5307,17 +5499,29 @@ --scale-sand-a11: rgb(8 8 0 / 0.6314); --scale-sand-a12: rgb(6 4 0 / 0.8902); --scale-tomato-1: #fffcfc; + --scale-tomato-1: oklch(0.9934 0.0032 17.21); --scale-tomato-2: #fff8f7; + --scale-tomato-2: oklch(0.9842 0.0076 27.23); --scale-tomato-3: #feebe7; + --scale-tomato-3: oklch(0.9541 0.0215 31.78); --scale-tomato-4: #ffdcd3; + --scale-tomato-4: oklch(0.9212 0.041 34.76); --scale-tomato-5: #ffcdc2; + --scale-tomato-5: oklch(0.889 0.059 32.56); --scale-tomato-6: #fdbdaf; + --scale-tomato-6: oklch(0.8532 0.077 32.63); --scale-tomato-7: #f5a898; + --scale-tomato-7: oklch(0.802 0.0946 32.19); --scale-tomato-8: #ec8e7b; + --scale-tomato-8: oklch(0.7409 0.1184 32.25); --scale-tomato-9: #e54d2e; + --scale-tomato-9: oklch(0.6271 0.1936 33.34); --scale-tomato-10: #dd4425; + --scale-tomato-10: oklch(0.6035 0.1947 33.22); --scale-tomato-11: #d13415; + --scale-tomato-11: oklch(0.5665 0.1978 32.73); --scale-tomato-12: #5c271f; + --scale-tomato-12: oklch(0.3459 0.0798 30.39); --scale-tomato-a1: rgb(255 0 0 / 0.0118); --scale-tomato-a2: rgb(255 32 0 / 0.0314); --scale-tomato-a3: rgb(244 43 0 / 0.0941); @@ -5331,17 +5535,29 @@ --scale-tomato-a11: rgb(205 34 0 / 0.9176); --scale-tomato-a12: rgb(69 9 0 / 0.8784); --scale-ruby-1: #fffcfd; + --scale-ruby-1: oklch(0.9936 0.0034 354.69); --scale-ruby-2: #fff7f8; + --scale-ruby-2: oklch(0.9826 0.0087 8.54); --scale-ruby-3: #feeaed; + --scale-ruby-3: oklch(0.9538 0.0221 7.18); --scale-ruby-4: #ffdce1; + --scale-ruby-4: oklch(0.925 0.0393 8.14); --scale-ruby-5: #ffced6; + --scale-ruby-5: oklch(0.896 0.0562 7.27); --scale-ruby-6: #f8bfc8; + --scale-ruby-6: oklch(0.8582 0.0664 8); --scale-ruby-7: #efacb8; + --scale-ruby-7: oklch(0.8107 0.0799 7.15); --scale-ruby-8: #e592a3; + --scale-ruby-8: oklch(0.7489 0.1021 6.5); --scale-ruby-9: #e54666; + --scale-ruby-9: oklch(0.6284 0.1949 13.15); --scale-ruby-10: #dc3b5d; + --scale-ruby-10: oklch(0.6012 0.1967 13.52); --scale-ruby-11: #ca244d; + --scale-ruby-11: oklch(0.5489 0.1985 13.9); --scale-ruby-12: #64172b; + --scale-ruby-12: oklch(0.341 0.1095 10); --scale-ruby-a1: rgb(255 0 85 / 0.0118); --scale-ruby-a2: rgb(255 0 32 / 0.0314); --scale-ruby-a3: rgb(243 0 36 / 0.0824); @@ -5355,17 +5571,29 @@ --scale-ruby-a11: rgb(193 0 48 / 0.8588); --scale-ruby-a12: rgb(85 0 22 / 0.9098); --scale-crimson-1: #fffcfd; + --scale-crimson-1: oklch(0.9936 0.0034 354.69); --scale-crimson-2: #fef7f9; + --scale-crimson-2: oklch(0.9821 0.0079 357.79); --scale-crimson-3: #ffe9f0; + --scale-crimson-3: oklch(0.9536 0.0256 356.28); --scale-crimson-4: #fedce7; + --scale-crimson-4: oklch(0.9258 0.0401 356.41); --scale-crimson-5: #facedd; + --scale-crimson-5: oklch(0.8934 0.053 355.77); --scale-crimson-6: #f3bed1; + --scale-crimson-6: oklch(0.8541 0.0653 355.16); --scale-crimson-7: #eaacc3; + --scale-crimson-7: oklch(0.8087 0.078 354.94); --scale-crimson-8: #e093b2; + --scale-crimson-8: oklch(0.7493 0.1002 354.02); --scale-crimson-9: #e93d82; + --scale-crimson-9: oklch(0.6341 0.213 1.28); --scale-crimson-10: #df3478; + --scale-crimson-10: oklch(0.6075 0.2106 2.23); --scale-crimson-11: #cb1d63; + --scale-crimson-11: oklch(0.5522 0.2073 4.49); --scale-crimson-12: #621639; + --scale-crimson-12: oklch(0.3409 0.1129 356.94); --scale-crimson-a1: rgb(255 0 85 / 0.0118); --scale-crimson-a2: rgb(223 0 64 / 0.0314); --scale-crimson-a3: rgb(255 0 81 / 0.0863); @@ -5379,17 +5607,29 @@ --scale-crimson-a11: rgb(196 0 79 / 0.8863); --scale-crimson-a12: rgb(83 0 38 / 0.9137); --scale-plum-1: #fefcff; + --scale-plum-1: oklch(0.9934 0.0045 314.81); --scale-plum-2: #fdf7fd; + --scale-plum-2: oklch(0.9824 0.0101 325.65); --scale-plum-3: #fbebfb; + --scale-plum-3: oklch(0.9573 0.0272 325.79); --scale-plum-4: #f7def8; + --scale-plum-4: oklch(0.9286 0.0438 324.76); --scale-plum-5: #f2d1f3; + --scale-plum-5: oklch(0.8985 0.0579 325.14); --scale-plum-6: #e9c2ec; + --scale-plum-6: oklch(0.8606 0.071 323.89); --scale-plum-7: #deade3; + --scale-plum-7: oklch(0.8093 0.0915 323.31); --scale-plum-8: #cf91d8; + --scale-plum-8: oklch(0.7413 0.1202 322.24); --scale-plum-9: #ab4aba; + --scale-plum-9: oklch(0.5787 0.1877 322.11); --scale-plum-10: #a144af; + --scale-plum-10: oklch(0.5519 0.1812 322.24); --scale-plum-11: #953ea3; + --scale-plum-11: oklch(0.5216 0.1727 321.89); --scale-plum-12: #53195d; + --scale-plum-12: oklch(0.3377 0.1251 321.42); --scale-plum-a1: rgb(170 0 255 / 0.0118); --scale-plum-a2: rgb(191 0 191 / 0.0314); --scale-plum-a3: rgb(204 0 204 / 0.0784); @@ -5403,17 +5643,29 @@ --scale-plum-a11: rgb(115 0 133 / 0.7569); --scale-plum-a12: rgb(64 0 75 / 0.902); --scale-violet-1: #fdfcfe; + --scale-violet-1: oklch(0.9924 0.0028 308.43); --scale-violet-2: #faf8ff; + --scale-violet-2: oklch(0.9826 0.0095 299.24); --scale-violet-3: #f4f0fe; + --scale-violet-3: oklch(0.9623 0.0191 299.07); --scale-violet-4: #ebe4ff; + --scale-violet-4: oklch(0.9325 0.037 297.54); --scale-violet-5: #e1d9ff; + --scale-violet-5: oklch(0.9035 0.0522 294.99); --scale-violet-6: #d4cafe; + --scale-violet-6: oklch(0.8642 0.0721 293.65); --scale-violet-7: #c2b5f5; + --scale-violet-7: oklch(0.8062 0.0902 293.59); --scale-violet-8: #aa99ec; + --scale-violet-8: oklch(0.7297 0.1193 292.6); --scale-violet-9: #6e56cf; + --scale-violet-9: oklch(0.5417 0.179 288.03); --scale-violet-10: #654dc4; + --scale-violet-10: oklch(0.5109 0.1775 287.68); --scale-violet-11: #6550b9; + --scale-violet-11: oklch(0.5078 0.1589 288.64); --scale-violet-12: #2f265f; + --scale-violet-12: oklch(0.3128 0.0975 286.57); --scale-violet-a1: rgb(85 0 170 / 0.0118); --scale-violet-a2: rgb(73 0 255 / 0.0275); --scale-violet-a3: rgb(68 0 238 / 0.0588); @@ -5427,17 +5679,29 @@ --scale-violet-a11: rgb(31 0 153 / 0.6863); --scale-violet-a12: rgb(11 0 67 / 0.851); --scale-iris-1: #fdfdff; + --scale-iris-1: oklch(0.9946 0.0026 286.35); --scale-iris-2: #f8f8ff; + --scale-iris-2: oklch(0.9811 0.0093 286.23); --scale-iris-3: #f0f1fe; + --scale-iris-3: oklch(0.9612 0.0174 282.54); --scale-iris-4: #e6e7ff; + --scale-iris-4: oklch(0.9344 0.0324 283.85); --scale-iris-5: #dadcff; + --scale-iris-5: oklch(0.9039 0.0478 282.81); --scale-iris-6: #cbcdff; + --scale-iris-6: oklch(0.8634 0.0692 283.05); --scale-iris-7: #b8baf8; + --scale-iris-7: oklch(0.8092 0.0872 282.83); --scale-iris-8: #9b9ef0; + --scale-iris-8: oklch(0.7293 0.1182 281.44); --scale-iris-9: #5b5bd6; + --scale-iris-9: oklch(0.5403 0.1841 278.28); --scale-iris-10: #5151cd; + --scale-iris-10: oklch(0.5087 0.1869 277.45); --scale-iris-11: #5753c6; + --scale-iris-11: oklch(0.5111 0.1739 279.84); --scale-iris-12: #272962; + --scale-iris-12: oklch(0.3143 0.0988 277.56); --scale-iris-a1: rgb(0 0 255 / 0.0078); --scale-iris-a2: rgb(0 0 255 / 0.0275); --scale-iris-a3: rgb(0 17 238 / 0.0588); @@ -5451,17 +5715,29 @@ --scale-iris-a11: rgb(6 0 170 / 0.6745); --scale-iris-a12: rgb(0 2 70 / 0.8471); --scale-indigo-1: #fdfdfe; + --scale-indigo-1: oklch(0.9943 0.0013 286.38); --scale-indigo-2: #f7f9ff; + --scale-indigo-2: oklch(0.9823 0.0083 271.33); --scale-indigo-3: #edf2fe; + --scale-indigo-3: oklch(0.9609 0.017 267.79); --scale-indigo-4: #e1e9ff; + --scale-indigo-4: oklch(0.9346 0.031 269.82); --scale-indigo-5: #d2deff; + --scale-indigo-5: oklch(0.9019 0.0471 269.62); --scale-indigo-6: #c1d0ff; + --scale-indigo-6: oklch(0.862 0.0675 271.09); --scale-indigo-7: #abbdf9; + --scale-indigo-7: oklch(0.8062 0.0875 271.41); --scale-indigo-8: #8da4ef; + --scale-indigo-8: oklch(0.7309 0.1123 270.43); --scale-indigo-9: #3e63dd; + --scale-indigo-9: oklch(0.5438 0.191 267.01); --scale-indigo-10: #3358d4; + --scale-indigo-10: oklch(0.5106 0.1954 266.58); --scale-indigo-11: #3a5bc7; + --scale-indigo-11: oklch(0.5092 0.1725 267.17); --scale-indigo-12: #1f2d5c; + --scale-indigo-12: oklch(0.3126 0.0858 268.6); --scale-indigo-a1: rgb(0 0 128 / 0.0078); --scale-indigo-a2: rgb(0 64 255 / 0.0314); --scale-indigo-a3: rgb(0 71 241 / 0.0706); @@ -5475,17 +5751,29 @@ --scale-indigo-a11: rgb(0 43 183 / 0.7725); --scale-indigo-a12: rgb(0 16 69 / 0.8784); --scale-jade-1: #fbfefd; + --scale-jade-1: oklch(0.9945 0.0034 174.49); --scale-jade-2: #f4fbf7; + --scale-jade-2: oklch(0.9817 0.0091 161.36); --scale-jade-3: #e6f7ed; + --scale-jade-3: oklch(0.9608 0.0222 160.23); --scale-jade-4: #d6f1e3; + --scale-jade-4: oklch(0.9346 0.0339 163.22); --scale-jade-5: #c3e9d7; + --scale-jade-5: oklch(0.9019 0.0466 165.05); --scale-jade-6: #acdec8; + --scale-jade-6: oklch(0.8595 0.0601 166.24); --scale-jade-7: #8bceb6; + --scale-jade-7: oklch(0.7997 0.0763 169.89); --scale-jade-8: #56ba9f; + --scale-jade-8: oklch(0.7214 0.1026 173.12); --scale-jade-9: #29a383; + --scale-jade-9: oklch(0.6422 0.115 170.73); --scale-jade-10: #26997b; + --scale-jade-10: oklch(0.613 0.1096 170.85); --scale-jade-11: #208368; + --scale-jade-11: oklch(0.5475 0.0983 170.05); --scale-jade-12: #1d3b31; + --scale-jade-12: oklch(0.3254 0.0406 170.08); --scale-jade-a1: rgb(0 191 128 / 0.0157); --scale-jade-a2: rgb(0 162 70 / 0.0431); --scale-jade-a3: rgb(0 173 71 / 0.098); @@ -5499,17 +5787,29 @@ --scale-jade-a11: rgb(0 113 82 / 0.8745); --scale-jade-a12: rgb(0 34 23 / 0.8863); --scale-grass-1: #fbfefb; + --scale-grass-1: oklch(0.9939 0.005 145.54); --scale-grass-2: #f5fbf5; + --scale-grass-2: oklch(0.9819 0.0101 145.5); --scale-grass-3: #e9f6e9; + --scale-grass-3: oklch(0.9599 0.022 145.4); --scale-grass-4: #daf1db; + --scale-grass-4: oklch(0.9353 0.0381 146.47); --scale-grass-5: #c9e8ca; + --scale-grass-5: oklch(0.9004 0.052 145.99); --scale-grass-6: #b2ddb5; + --scale-grass-6: oklch(0.8563 0.071 146.77); --scale-grass-7: #94ce9a; + --scale-grass-7: oklch(0.7978 0.0943 147.26); --scale-grass-8: #65ba74; + --scale-grass-8: oklch(0.7174 0.1308 148.14); --scale-grass-9: #46a758; + --scale-grass-9: oklch(0.6512 0.1468 147.39); --scale-grass-10: #3e9b4f; + --scale-grass-10: oklch(0.6152 0.1422 147.19); --scale-grass-11: #2a7e3b; + --scale-grass-11: oklch(0.5262 0.1294 147.2); --scale-grass-12: #203c25; + --scale-grass-12: oklch(0.3266 0.053 148.59); --scale-grass-a1: rgb(0 191 0 / 0.0157); --scale-grass-a2: rgb(0 153 0 / 0.0392); --scale-grass-a3: rgb(0 151 0 / 0.0863); @@ -5523,17 +5823,29 @@ --scale-grass-a11: rgb(0 101 20 / 0.8353); --scale-grass-a12: rgb(0 32 6 / 0.8745); --scale-brown-1: #fefdfc; + --scale-brown-1: oklch(0.9945 0.0017 67.8); --scale-brown-2: #fcf9f6; + --scale-brown-2: oklch(0.9836 0.0051 67.76); --scale-brown-3: #f6eee7; + --scale-brown-3: oklch(0.9534 0.0128 63.92); --scale-brown-4: #f0e4d9; + --scale-brown-4: oklch(0.9254 0.0198 65.13); --scale-brown-5: #ebdaca; + --scale-brown-5: oklch(0.8978 0.0286 65.74); --scale-brown-6: #e4cdb7; + --scale-brown-6: oklch(0.8616 0.0394 66.01); --scale-brown-7: #dcbc9f; + --scale-brown-7: oklch(0.8154 0.0538 64.15); --scale-brown-8: #cea37e; + --scale-brown-8: oklch(0.7459 0.0716 62.1); --scale-brown-9: #ad7f58; + --scale-brown-9: oklch(0.6329 0.0785 60.98); --scale-brown-10: #a07553; + --scale-brown-10: oklch(0.5974 0.0724 59.14); --scale-brown-11: #815e46; + --scale-brown-11: oklch(0.5122 0.0582 55.45); --scale-brown-12: #3e332e; + --scale-brown-12: oklch(0.3314 0.0181 45.86); --scale-brown-a1: rgb(170 85 0 / 0.0118); --scale-brown-a2: rgb(170 85 0 / 0.0353); --scale-brown-a3: rgb(159 74 0 / 0.0941); @@ -5547,17 +5859,29 @@ --scale-brown-a11: rgb(81 33 0 / 0.7255); --scale-brown-a12: rgb(20 6 0 / 0.8196); --scale-sky-1: #f9feff; + --scale-sky-1: oklch(0.9936 0.0055 211.04); --scale-sky-2: #f1fafd; + --scale-sky-2: oklch(0.9792 0.0103 219.59); --scale-sky-3: #e1f6fd; + --scale-sky-3: oklch(0.9598 0.024 219.72); --scale-sky-4: #d1f0fa; + --scale-sky-4: oklch(0.9358 0.0351 219.19); --scale-sky-5: #bee7f5; + --scale-sky-5: oklch(0.9033 0.0467 220.56); --scale-sky-6: #a9daed; + --scale-sky-6: oklch(0.8604 0.0571 223.65); --scale-sky-7: #8dcae3; + --scale-sky-7: oklch(0.8063 0.0716 225.48); --scale-sky-8: #60b3d7; + --scale-sky-8: oklch(0.7283 0.0961 228.43); --scale-sky-9: #7ce2fe; + --scale-sky-9: oklch(0.8611 0.1027 217.8); --scale-sky-10: #74daf8; + --scale-sky-10: oklch(0.8378 0.1038 219.37); --scale-sky-11: #00749e; + --scale-sky-11: oklch(0.5255 0.1079 232.55); --scale-sky-12: #1d3e56; + --scale-sky-12: oklch(0.3507 0.0572 242.37); --scale-sky-a1: rgb(0 213 255 / 0.0235); --scale-sky-a2: rgb(0 164 219 / 0.0549); --scale-sky-a3: rgb(0 179 238 / 0.1176); @@ -5571,17 +5895,29 @@ --scale-sky-a11: rgb(0 116 158 / 1); --scale-sky-a12: rgb(0 37 64 / 0.8863); --scale-mint-1: #f9fefd; + --scale-mint-1: oklch(0.993 0.0054 183.03); --scale-mint-2: #f2fbf9; + --scale-mint-2: oklch(0.9808 0.0098 181.42); --scale-mint-3: #ddf9f2; + --scale-mint-3: oklch(0.9599 0.0306 178.93); --scale-mint-4: #c8f4e9; + --scale-mint-4: oklch(0.9332 0.0476 178.33); --scale-mint-5: #b3ecde; + --scale-mint-5: oklch(0.9002 0.0611 178.06); --scale-mint-6: #9ce0d0; + --scale-mint-6: oklch(0.8568 0.072 178.17); --scale-mint-7: #7ecfbd; + --scale-mint-7: oklch(0.7973 0.0841 178.23); --scale-mint-8: #4cbba5; + --scale-mint-8: oklch(0.7221 0.1063 177.84); --scale-mint-9: #86ead4; + --scale-mint-9: oklch(0.8696 0.0999 177.98); --scale-mint-10: #7de0cb; + --scale-mint-10: oklch(0.8401 0.0988 178.42); --scale-mint-11: #027864; + --scale-mint-11: oklch(0.5117 0.0955 175.6); --scale-mint-12: #16433c; + --scale-mint-12: oklch(0.3496 0.0505 181.31); --scale-mint-a1: rgb(0 213 170 / 0.0235); --scale-mint-a2: rgb(0 177 137 / 0.051); --scale-mint-a3: rgb(0 210 158 / 0.1333); @@ -5595,17 +5931,29 @@ --scale-mint-a11: rgb(0 119 99 / 0.9922); --scale-mint-a12: rgb(0 49 42 / 0.9137); --scale-lime-1: #fcfdfa; + --scale-lime-1: oklch(0.9925 0.0041 121.56); --scale-lime-2: #f8faf3; + --scale-lime-2: oklch(0.9817 0.0094 119.57); --scale-lime-3: #eef6d6; + --scale-lime-3: oklch(0.9588 0.0428 118.62); --scale-lime-4: #e2f0bd; + --scale-lime-4: oklch(0.9319 0.0683 120.2); --scale-lime-5: #d3e7a6; + --scale-lime-5: oklch(0.8973 0.0876 122.06); --scale-lime-6: #c2da91; + --scale-lime-6: oklch(0.8532 0.0991 123.29); --scale-lime-7: #abc978; + --scale-lime-7: oklch(0.7948 0.1116 125.43); --scale-lime-8: #8db654; + --scale-lime-8: oklch(0.725 0.1351 128.23); --scale-lime-9: #bdee63; + --scale-lime-9: oklch(0.8874 0.1747 126.09); --scale-lime-10: #b0e64c; + --scale-lime-10: oklch(0.8588 0.1879 126.75); --scale-lime-11: #5c7c2f; + --scale-lime-11: oklch(0.5444 0.1114 128.6); --scale-lime-12: #37401c; + --scale-lime-12: oklch(0.3537 0.0573 120.98); --scale-lime-a1: rgb(102 153 0 / 0.0196); --scale-lime-a2: rgb(106 149 0 / 0.0471); --scale-lime-a3: rgb(149 199 0 / 0.1608); @@ -5619,17 +5967,29 @@ --scale-lime-a11: rgb(55 94 0 / 0.8157); --scale-lime-a12: rgb(30 40 0 / 0.8902); --scale-gold-1: #fefdfb; + --scale-gold-1: oklch(0.9943 0.0028 84.56); --scale-gold-2: #fcfcec; + --scale-gold-2: oklch(0.9868 0.021 106.78); --scale-gold-3: #f9f9ca; + --scale-gold-3: oklch(0.9705 0.0607 107.48); --scale-gold-4: #f6f1a9; + --scale-gold-4: oklch(0.9455 0.0912 104.64); --scale-gold-5: #efe98a; + --scale-gold-5: oklch(0.9185 0.1172 105.32); --scale-gold-6: #e8da83; + --scale-gold-6: oklch(0.881 0.1092 100.29); --scale-gold-7: #dec571; + --scale-gold-7: oklch(0.8268 0.108 93.28); --scale-gold-8: #d6a94a; + --scale-gold-8: oklch(0.7582 0.1235 83.43); --scale-gold-9: #d4af37; + --scale-gold-9: oklch(0.7665 0.1387 91.06); --scale-gold-10: #f0c142; + --scale-gold-10: oklch(0.8311 0.1481 87.75); --scale-gold-11: #a16a19; + --scale-gold-11: oklch(0.5698 0.1139 70.69); --scale-gold-12: #4c3623; + --scale-gold-12: oklch(0.3529 0.0438 61.5); --scale-gold-a1: rgb(191 128 0 / 0.0157); --scale-gold-a2: rgb(215 215 0 / 0.0745); --scale-gold-a3: rgb(226 226 0 / 0.2078); @@ -5643,17 +6003,29 @@ --scale-gold-a11: rgb(151 90 0 / 0.902); --scale-gold-a12: rgb(48 22 0 / 0.8627); --scale-bronze-1: #fdfcfb; + --scale-bronze-1: oklch(0.9916 0.0017 67.8); --scale-bronze-2: #fbf8f0; + --scale-bronze-2: oklch(0.9792 0.011 89.72); --scale-bronze-3: #f6f2de; + --scale-bronze-3: oklch(0.9589 0.0267 97.61); --scale-bronze-4: #f0e4c3; + --scale-bronze-4: oklch(0.92 0.0453 90.4); --scale-bronze-5: #ebd8ad; + --scale-bronze-5: oklch(0.8871 0.0601 86.97); --scale-bronze-6: #e7cb98; + --scale-bronze-6: oklch(0.8536 0.0735 82.27); --scale-bronze-7: #ddb987; + --scale-bronze-7: oklch(0.8055 0.0776 75.41); --scale-bronze-8: #d1a36b; + --scale-bronze-8: oklch(0.7455 0.091 71.17); --scale-bronze-9: #cd7f32; + --scale-bronze-9: oklch(0.6661 0.1315 61.29); --scale-bronze-10: #ce7c30; + --scale-bronze-10: oklch(0.6619 0.1344 59.3); --scale-bronze-11: #af6826; + --scale-bronze-11: oklch(0.5851 0.1199 59.21); --scale-bronze-12: #4d3421; + --scale-bronze-12: oklch(0.3493 0.0472 57.68); --scale-bronze-a1: rgb(128 64 0 / 0.0157); --scale-bronze-a2: rgb(187 136 0 / 0.0588); --scale-bronze-a3: rgb(185 155 0 / 0.1294); @@ -6012,17 +6384,29 @@ [data-theme='base-dark'], [data-theme='dark'] { --scale-gray-1: #111111; + --scale-gray-1: oklch(0.1776 0 0); --scale-gray-2: #191919; + --scale-gray-2: oklch(0.2134 0 0); --scale-gray-3: #222222; + --scale-gray-3: oklch(0.252 0 0); --scale-gray-4: #2a2a2a; + --scale-gray-4: oklch(0.285 0 0); --scale-gray-5: #313131; + --scale-gray-5: oklch(0.3132 0 0); --scale-gray-6: #3a3a3a; + --scale-gray-6: oklch(0.3485 0 0); --scale-gray-7: #484848; + --scale-gray-7: oklch(0.4017 0 0); --scale-gray-8: #606060; + --scale-gray-8: oklch(0.4891 0 0); --scale-gray-9: #6e6e6e; + --scale-gray-9: oklch(0.5382 0 0); --scale-gray-10: #7b7b7b; + --scale-gray-10: oklch(0.5829 0 0); --scale-gray-11: #b4b4b4; + --scale-gray-11: oklch(0.7699 0 0); --scale-gray-12: #eeeeee; + --scale-gray-12: oklch(0.9491 0 0); --scale-gray-a1: rgb(255 255 255 / 0.0667); --scale-gray-a2: rgb(255 255 255 / 0.098); --scale-gray-a3: rgb(255 255 255 / 0.1333); @@ -6036,17 +6420,29 @@ --scale-gray-a11: rgb(255 255 255 / 0.7059); --scale-gray-a12: rgb(255 255 255 / 0.9333); --scale-slate-1: #111113; + --scale-slate-1: oklch(0.1785 0.0041 285.98); --scale-slate-2: #18191b; + --scale-slate-2: oklch(0.2132 0.0042 264.48); --scale-slate-3: #212225; + --scale-slate-3: oklch(0.2521 0.0058 271.18); --scale-slate-4: #272a2d; + --scale-slate-4: oklch(0.2832 0.007 248.07); --scale-slate-5: #2e3135; + --scale-slate-5: oklch(0.3118 0.0083 255.56); --scale-slate-6: #363a3f; + --scale-slate-6: oklch(0.3466 0.0103 253.97); --scale-slate-7: #43484e; + --scale-slate-7: oklch(0.3993 0.0121 252.94); --scale-slate-8: #5a6169; + --scale-slate-8: oklch(0.4893 0.0155 251.69); --scale-slate-9: #696e77; + --scale-slate-9: oklch(0.537 0.0153 262.34); --scale-slate-10: #777b84; + --scale-slate-10: oklch(0.5825 0.0145 266.63); --scale-slate-11: #b0b4ba; + --scale-slate-11: oklch(0.7686 0.0096 258.34); --scale-slate-12: #edeef0; + --scale-slate-12: oklch(0.9489 0.0029 264.54); --scale-slate-a1: rgb(228 228 255 / 0.0745); --scale-slate-a2: rgb(227 236 255 / 0.1059); --scale-slate-a3: rgb(227 234 255 / 0.1451); @@ -6060,17 +6456,29 @@ --scale-slate-a11: rgb(241 247 255 / 0.7294); --scale-slate-a12: rgb(252 253 255 / 0.9412); --scale-blue-1: #0d1520; + --scale-blue-1: oklch(0.1936 0.0255 256.49); --scale-blue-2: #111927; + --scale-blue-2: oklch(0.2129 0.0303 261.25); --scale-blue-3: #0d2847; + --scale-blue-3: oklch(0.2745 0.0663 253.93); --scale-blue-4: #003362; + --scale-blue-4: oklch(0.3201 0.0968 252.35); --scale-blue-5: #004074; + --scale-blue-5: oklch(0.3671 0.1059 250.7); --scale-blue-6: #104d87; + --scale-blue-6: oklch(0.416 0.1133 252.01); --scale-blue-7: #205d9e; + --scale-blue-7: oklch(0.4741 0.1219 253.09); --scale-blue-8: #2870bd; + --scale-blue-8: oklch(0.5406 0.1395 253.17); --scale-blue-9: #0090ff; + --scale-blue-9: oklch(0.6493 0.193 251.78); --scale-blue-10: #3b9eff; + --scale-blue-10: oklch(0.6884 0.1693 251.4); --scale-blue-11: #70b8ff; + --scale-blue-11: oklch(0.7642 0.1257 249.46); --scale-blue-12: #c2e6ff; + --scale-blue-12: oklch(0.9071 0.051 238.45); --scale-blue-a1: rgb(104 167 255 / 0.1255); --scale-blue-a2: rgb(111 163 255 / 0.1529); --scale-blue-a3: rgb(47 144 255 / 0.2784); @@ -6084,17 +6492,29 @@ --scale-blue-a11: rgb(112 184 255 / 1); --scale-blue-a12: rgb(194 230 255 / 1); --scale-cyan-1: #0b161a; + --scale-cyan-1: oklch(0.1917 0.0178 222.83); --scale-cyan-2: #101b20; + --scale-cyan-2: oklch(0.214 0.0186 227.95); --scale-cyan-3: #082c36; + --scale-cyan-3: oklch(0.2733 0.0434 220.38); --scale-cyan-4: #003848; + --scale-cyan-4: oklch(0.3164 0.0593 223.7); --scale-cyan-5: #004558; + --scale-cyan-5: oklch(0.3626 0.068 223.74); --scale-cyan-6: #045468; + --scale-cyan-6: oklch(0.4135 0.0747 221.5); --scale-cyan-7: #12677e; + --scale-cyan-7: oklch(0.4777 0.0827 221.64); --scale-cyan-8: #11809c; + --scale-cyan-8: oklch(0.5566 0.0985 221.11); --scale-cyan-9: #00a2c7; + --scale-cyan-9: oklch(0.66 0.1217 221.74); --scale-cyan-10: #23afd0; + --scale-cyan-10: oklch(0.6988 0.1195 218.86); --scale-cyan-11: #4ccce6; + --scale-cyan-11: oklch(0.7854 0.1158 213.8); --scale-cyan-12: #b6ecf7; + --scale-cyan-12: oklch(0.9095 0.0569 211.5); --scale-cyan-a1: rgb(108 216 255 / 0.102); --scale-cyan-a2: rgb(128 215 255 / 0.1255); --scale-cyan-a3: rgb(38 208 255 / 0.2118); @@ -6108,17 +6528,29 @@ --scale-cyan-a11: rgb(84 226 255 / 0.902); --scale-cyan-a12: rgb(188 244 255 / 0.9686); --scale-teal-1: #0d1514; + --scale-teal-1: oklch(0.1872 0.0122 186.67); --scale-teal-2: #111c1b; + --scale-teal-2: oklch(0.2155 0.0159 189); --scale-teal-3: #0d2d2a; + --scale-teal-3: oklch(0.2725 0.0377 186.76); --scale-teal-4: #023b37; + --scale-teal-4: oklch(0.3178 0.0543 187.27); --scale-teal-5: #084843; + --scale-teal-5: oklch(0.3633 0.0601 186.64); --scale-teal-6: #145750; + --scale-teal-6: oklch(0.4144 0.0655 184.75); --scale-teal-7: #1c6961; + --scale-teal-7: oklch(0.4731 0.0737 184.95); --scale-teal-8: #207e73; + --scale-teal-8: oklch(0.5374 0.0861 183.49); --scale-teal-9: #12a594; + --scale-teal-9: oklch(0.6491 0.1136 181.96); --scale-teal-10: #0eb39e; + --scale-teal-10: oklch(0.688 0.1228 180.31); --scale-teal-11: #0bd8b6; + --scale-teal-11: oklch(0.7886 0.1467 175.73); --scale-teal-12: #adf0dd; + --scale-teal-12: oklch(0.9051 0.0721 175.13); --scale-teal-a1: rgb(158 255 243 / 0.0824); --scale-teal-a2: rgb(155 255 246 / 0.1098); --scale-teal-a3: rgb(74 255 238 / 0.1765); @@ -6132,17 +6564,29 @@ --scale-teal-a11: rgb(13 255 215 / 0.8471); --scale-teal-a12: rgb(184 255 235 / 0.9412); --scale-green-1: #0e1512; + --scale-green-1: oklch(0.1873 0.0123 167.01); --scale-green-2: #121b17; + --scale-green-2: oklch(0.2117 0.0154 165.91); --scale-green-3: #132d21; + --scale-green-3: oklch(0.2721 0.0396 162.17); --scale-green-4: #113b29; + --scale-green-4: oklch(0.3173 0.0569 161.84); --scale-green-5: #174933; + --scale-green-5: oklch(0.3649 0.066 161.23); --scale-green-6: #20573e; + --scale-green-6: oklch(0.4124 0.0721 160.95); --scale-green-7: #28684a; + --scale-green-7: oklch(0.467 0.0823 160.24); --scale-green-8: #2f7c57; + --scale-green-8: oklch(0.528 0.0963 159.39); --scale-green-9: #30a46c; + --scale-green-9: oklch(0.6406 0.1329 157.68); --scale-green-10: #33b074; + --scale-green-10: oklch(0.6746 0.1406 157.7); --scale-green-11: #3dd68c; + --scale-green-11: oklch(0.7794 0.1655 157.29); --scale-green-12: #b1f1cb; + --scale-green-12: oklch(0.9048 0.083 158.18); --scale-green-a1: rgb(170 255 219 / 0.0824); --scale-green-a2: rgb(170 255 217 / 0.1059); --scale-green-a3: rgb(108 255 187 / 0.1765); @@ -6156,17 +6600,29 @@ --scale-green-a11: rgb(73 255 167 / 0.8392); --scale-green-a12: rgb(187 255 215 / 0.9451); --scale-yellow-1: #14120b; + --scale-yellow-1: oklch(0.1821 0.0139 94.03); --scale-yellow-2: #1b180f; + --scale-yellow-2: oklch(0.2095 0.0174 91.81); --scale-yellow-3: #2d2305; + --scale-yellow-3: oklch(0.2609 0.0472 90.26); --scale-yellow-4: #362b00; + --scale-yellow-4: oklch(0.2929 0.06 93.8); --scale-yellow-5: #433500; + --scale-yellow-5: oklch(0.3346 0.0685 92.46); --scale-yellow-6: #524202; + --scale-yellow-6: oklch(0.3849 0.0776 92.91); --scale-yellow-7: #665417; + --scale-yellow-7: oklch(0.452 0.0809 91.97); --scale-yellow-8: #836a21; + --scale-yellow-8: oklch(0.5349 0.0947 89.38); --scale-yellow-9: #ffe629; + --scale-yellow-9: oklch(0.9176 0.1838 100.94); --scale-yellow-10: #ffff57; + --scale-yellow-10: oklch(0.9711 0.1819 109.36); --scale-yellow-11: #f5e147; + --scale-yellow-11: oklch(0.9001 0.1664 101.72); --scale-yellow-12: #f6eeb4; + --scale-yellow-12: oklch(0.9415 0.0748 101.11); --scale-yellow-a1: rgb(255 230 140 / 0.0784); --scale-yellow-a2: rgb(255 227 142 / 0.1059); --scale-yellow-a3: rgb(255 198 28 / 0.1765); @@ -6180,17 +6636,29 @@ --scale-yellow-a11: rgb(255 234 74 / 0.9608); --scale-yellow-a12: rgb(255 247 187 / 0.9647); --scale-amber-1: #16120c; + --scale-amber-1: oklch(0.185 0.0134 77.8); --scale-amber-2: #1d180f; + --scale-amber-2: oklch(0.212 0.0184 81.99); --scale-amber-3: #302008; + --scale-amber-3: oklch(0.2578 0.0442 74.48); --scale-amber-4: #3f2700; + --scale-amber-4: oklch(0.2955 0.0627 73.88); --scale-amber-5: #4d3000; + --scale-amber-5: oklch(0.3363 0.0717 72.9); --scale-amber-6: #5c3d05; + --scale-amber-6: oklch(0.3863 0.0784 75.25); --scale-amber-7: #714f19; + --scale-amber-7: oklch(0.4542 0.0824 74.96); --scale-amber-8: #8f6424; + --scale-amber-8: oklch(0.5364 0.0964 73.44); --scale-amber-9: #ffc53d; + --scale-amber-9: oklch(0.8537 0.1572 84.13); --scale-amber-10: #ffd60a; + --scale-amber-10: oklch(0.8849 0.1805 94.78); --scale-amber-11: #ffca16; + --scale-amber-11: oklch(0.8617 0.173 89.02); --scale-amber-12: #ffe7b3; + --scale-amber-12: oklch(0.9351 0.0717 86.07); --scale-amber-a1: rgb(255 209 139 / 0.0863); --scale-amber-a2: rgb(255 211 132 / 0.1137); --scale-amber-a3: rgb(255 170 43 / 0.1882); @@ -6204,17 +6672,29 @@ --scale-amber-a11: rgb(255 202 22 / 1); --scale-amber-a12: rgb(255 231 179 / 1); --scale-orange-1: #17120e; + --scale-orange-1: oklch(0.1869 0.0114 60.68); --scale-orange-2: #1e160f; + --scale-orange-2: oklch(0.2078 0.0185 62.72); --scale-orange-3: #331e0b; + --scale-orange-3: oklch(0.2579 0.0447 60.79); --scale-orange-4: #462100; + --scale-orange-4: oklch(0.2937 0.0713 56.7); --scale-orange-5: #562800; + --scale-orange-5: oklch(0.3339 0.0833 54.38); --scale-orange-6: #66350c; + --scale-orange-6: oklch(0.3849 0.0867 54.98); --scale-orange-7: #7e451d; + --scale-orange-7: oklch(0.4523 0.0945 52.66); --scale-orange-8: #a35829; + --scale-orange-8: oklch(0.5406 0.1156 50.05); --scale-orange-9: #f76b15; + --scale-orange-9: oklch(0.6908 0.1909 45.02); --scale-orange-10: #ff801f; + --scale-orange-10: oklch(0.7327 0.1818 50.86); --scale-orange-11: #ffa057; + --scale-orange-11: oklch(0.7888 0.1434 56.21); --scale-orange-12: #ffe0c2; + --scale-orange-12: oklch(0.9247 0.0524 66.17); --scale-orange-a1: rgb(255 200 155 / 0.0902); --scale-orange-a2: rgb(255 187 128 / 0.1176); --scale-orange-a3: rgb(255 150 55 / 0.2); @@ -6228,17 +6708,29 @@ --scale-orange-a11: rgb(255 160 87 / 1); --scale-orange-a12: rgb(255 224 194 / 1); --scale-red-1: #191111; + --scale-red-1: oklch(0.188 0.0135 18.42); --scale-red-2: #201314; + --scale-red-2: oklch(0.2046 0.0217 14.06); --scale-red-3: #3b1219; + --scale-red-3: oklch(0.251 0.0649 12.69); --scale-red-4: #500f1c; + --scale-red-4: oklch(0.2893 0.0951 14.33); --scale-red-5: #611623; + --scale-red-5: oklch(0.3321 0.1067 15.53); --scale-red-6: #72232d; + --scale-red-6: oklch(0.3814 0.1108 16.8); --scale-red-7: #8c333a; + --scale-red-7: oklch(0.4502 0.1211 18.77); --scale-red-8: #b54548; + --scale-red-8: oklch(0.5436 0.1458 21.76); --scale-red-9: #e5484d; + --scale-red-9: oklch(0.6256 0.1933 23.03); --scale-red-10: #ec5d5e; + --scale-red-10: oklch(0.6634 0.1774 22.85); --scale-red-11: #ff9592; + --scale-red-11: oklch(0.7804 0.1281 22.14); --scale-red-12: #ffd1d9; + --scale-red-12: oklch(0.9024 0.0527 6.45); --scale-red-a1: rgb(255 173 173 / 0.098); --scale-red-a2: rgb(255 151 159 / 0.1255); --scale-red-a3: rgb(255 78 108 / 0.2314); @@ -6252,17 +6744,29 @@ --scale-red-a11: rgb(255 149 146 / 1); --scale-red-a12: rgb(255 209 217 / 1); --scale-pink-1: #191117; + --scale-pink-1: oklch(0.1906 0.0175 335.35); --scale-pink-2: #21121d; + --scale-pink-2: oklch(0.2076 0.0316 337); --scale-pink-3: #37172f; + --scale-pink-3: oklch(0.2616 0.0625 337.59); --scale-pink-4: #4b143d; + --scale-pink-4: oklch(0.2986 0.0981 339.42); --scale-pink-5: #591c47; + --scale-pink-5: oklch(0.338 0.1047 341.18); --scale-pink-6: #692955; + --scale-pink-6: oklch(0.3884 0.1075 341.41); --scale-pink-7: #833869; + --scale-pink-7: oklch(0.4583 0.1197 342.9); --scale-pink-8: #a84885; + --scale-pink-8: oklch(0.5462 0.1449 343.97); --scale-pink-9: #d6409f; + --scale-pink-9: oklch(0.6168 0.2076 346); --scale-pink-10: #de51a8; + --scale-pink-10: oklch(0.6495 0.197 345.96); --scale-pink-11: #ff8dcc; + --scale-pink-11: oklch(0.7846 0.155 346.97); --scale-pink-12: #fdd1ea; + --scale-pink-12: oklch(0.9055 0.0588 343.22); --scale-pink-a1: rgb(255 173 235 / 0.098); --scale-pink-a2: rgb(255 139 224 / 0.1294); --scale-pink-a3: rgb(255 107 218 / 0.2157); @@ -6276,17 +6780,29 @@ --scale-pink-a11: rgb(255 141 204 / 1); --scale-pink-a12: rgb(255 211 236 / 0.9922); --scale-purple-1: #18111b; + --scale-purple-1: oklch(0.1913 0.0225 315.59); --scale-purple-2: #1e1523; + --scale-purple-2: oklch(0.2137 0.0299 313.13); --scale-purple-3: #301c3b; + --scale-purple-3: oklch(0.2677 0.0612 312.61); --scale-purple-4: #3d224e; + --scale-purple-4: oklch(0.3088 0.0818 310.8); --scale-purple-5: #48295c; + --scale-purple-5: oklch(0.3447 0.092 310.5); --scale-purple-6: #54346b; + --scale-purple-6: oklch(0.3887 0.0964 309.45); --scale-purple-7: #664282; + --scale-purple-7: oklch(0.4486 0.1079 308.61); --scale-purple-8: #8457aa; + --scale-purple-8: oklch(0.5412 0.1326 307.57); --scale-purple-9: #8e4ec6; + --scale-purple-9: oklch(0.5556 0.1829 305.86); --scale-purple-10: #9a5cd0; + --scale-purple-10: oklch(0.5955 0.1768 306.45); --scale-purple-11: #d19dff; + --scale-purple-11: oklch(0.7807 0.1452 307.74); --scale-purple-12: #ecd9fa; + --scale-purple-12: oklch(0.9107 0.0487 310.99); --scale-purple-a1: rgb(227 161 255 / 0.1059); --scale-purple-a2: rgb(219 153 255 / 0.1373); --scale-purple-a3: rgb(207 121 255 / 0.2314); @@ -6300,17 +6816,29 @@ --scale-purple-a11: rgb(209 157 255 / 1); --scale-purple-a12: rgb(241 221 255 / 0.9804); --scale-mauve-1: #121113; + --scale-mauve-1: oklch(0.1797 0.0043 308.19); --scale-mauve-2: #1a191b; + --scale-mauve-2: oklch(0.2154 0.0041 308.25); --scale-mauve-3: #232225; + --scale-mauve-3: oklch(0.2543 0.0057 301.13); --scale-mauve-4: #2b292d; + --scale-mauve-4: oklch(0.2846 0.0077 308.16); --scale-mauve-5: #323035; + --scale-mauve-5: oklch(0.3132 0.0092 303.92); --scale-mauve-6: #3c393f; + --scale-mauve-6: oklch(0.3499 0.011 308.11); --scale-mauve-7: #49474e; + --scale-mauve-7: oklch(0.4024 0.0119 298.9); --scale-mauve-8: #625f69; + --scale-mauve-8: oklch(0.4917 0.0162 299.48); --scale-mauve-9: #6f6d78; + --scale-mauve-9: oklch(0.5403 0.0171 294.16); --scale-mauve-10: #7c7a85; + --scale-mauve-10: oklch(0.5849 0.0168 294.22); --scale-mauve-11: #b5b2bc; + --scale-mauve-11: oklch(0.7691 0.0144 299.72); --scale-mauve-12: #eeeef0; + --scale-mauve-12: oklch(0.9497 0.0027 286.35); --scale-mauve-a1: rgb(242 228 255 / 0.0745); --scale-mauve-a2: rgb(246 236 255 / 0.1059); --scale-mauve-a3: rgb(241 234 255 / 0.1451); @@ -6324,17 +6852,29 @@ --scale-mauve-a11: rgb(246 241 255 / 0.7373); --scale-mauve-a12: rgb(253 253 255 / 0.9412); --scale-sage-1: #101211; + --scale-sage-1: oklch(0.1795 0.0038 164.58); --scale-sage-2: #171918; + --scale-sage-2: oklch(0.2108 0.0036 164.68); --scale-sage-3: #202221; + --scale-sage-3: oklch(0.2495 0.0035 164.77); --scale-sage-4: #272a29; + --scale-sage-4: oklch(0.2816 0.0047 174.1); --scale-sage-5: #2e3130; + --scale-sage-5: oklch(0.3098 0.0046 174.15); --scale-sage-6: #373b39; + --scale-sage-6: oklch(0.3478 0.0064 164.65); --scale-sage-7: #444947; + --scale-sage-7: oklch(0.4001 0.0073 170.09); --scale-sage-8: #5b625f; + --scale-sage-8: oklch(0.489 0.0099 168.42); --scale-sage-9: #63706b; + --scale-sage-9: oklch(0.5327 0.0175 170.54); --scale-sage-10: #717d79; + --scale-sage-10: oklch(0.5785 0.0155 173.79); --scale-sage-11: #adb5b2; + --scale-sage-11: oklch(0.7659 0.0099 171.7); --scale-sage-12: #eceeed; + --scale-sage-12: oklch(0.9473 0.0025 165.07); --scale-sage-a1: rgb(227 255 241 / 0.0706); --scale-sage-a2: rgb(235 255 245 / 0.098); --scale-sage-a3: rgb(240 255 248 / 0.1333); @@ -6348,17 +6888,29 @@ --scale-sage-a11: rgb(244 255 251 / 0.7098); --scale-sage-a12: rgb(253 255 254 / 0.9333); --scale-olive-1: #111210; + --scale-olive-1: oklch(0.1802 0.0043 128.73); --scale-olive-2: #181917; + --scale-olive-2: oklch(0.2115 0.0042 128.68); --scale-olive-3: #212220; + --scale-olive-3: oklch(0.2501 0.004 128.64); --scale-olive-4: #282a27; + --scale-olive-4: oklch(0.2819 0.0061 134.94); --scale-olive-5: #2f312e; + --scale-olive-5: oklch(0.3101 0.006 134.92); --scale-olive-6: #383a36; + --scale-olive-6: oklch(0.3451 0.0073 128.7); --scale-olive-7: #454843; + --scale-olive-7: oklch(0.3972 0.0091 132.53); --scale-olive-8: #5c625b; + --scale-olive-8: oklch(0.4886 0.0133 141.23); --scale-olive-9: #687066; + --scale-olive-9: oklch(0.5352 0.0181 139.44); --scale-olive-10: #767d74; + --scale-olive-10: oklch(0.581 0.0159 138.72); --scale-olive-11: #afb5ad; + --scale-olive-11: oklch(0.766 0.013 137.79); --scale-olive-12: #eceeec; + --scale-olive-12: oklch(0.947 0.0034 145.55); --scale-olive-a1: rgb(241 255 227 / 0.0706); --scale-olive-a2: rgb(245 255 235 / 0.098); --scale-olive-a3: rgb(248 255 240 / 0.1333); @@ -6372,17 +6924,29 @@ --scale-olive-a11: rgb(247 255 244 / 0.7098); --scale-olive-a12: rgb(253 255 253 / 0.9333); --scale-sand-1: #111110; + --scale-sand-1: oklch(0.1772 0.002 106.6); --scale-sand-2: #191918; + --scale-sand-2: oklch(0.213 0.0019 106.56); --scale-sand-3: #222221; + --scale-sand-3: oklch(0.2516 0.0019 106.53); --scale-sand-4: #2a2a28; + --scale-sand-4: oklch(0.2843 0.0036 106.63); --scale-sand-5: #31312e; + --scale-sand-5: oklch(0.3121 0.0052 106.7); --scale-sand-6: #3b3a37; + --scale-sand-6: oklch(0.3484 0.0053 91.54); --scale-sand-7: #494844; + --scale-sand-7: oklch(0.4013 0.0067 95.22); --scale-sand-8: #62605b; + --scale-sand-8: oklch(0.4893 0.0082 88.7); --scale-sand-9: #6f6d66; + --scale-sand-9: oklch(0.5344 0.011 93.67); --scale-sand-10: #7c7b74; + --scale-sand-10: oklch(0.5816 0.0106 100.11); --scale-sand-11: #b5b3ad; + --scale-sand-11: oklch(0.7666 0.0087 91.51); --scale-sand-12: #eeeeec; + --scale-sand-12: oklch(0.9486 0.0027 106.45); --scale-sand-a1: rgb(255 255 240 / 0.0667); --scale-sand-a2: rgb(255 255 245 / 0.098); --scale-sand-a3: rgb(255 255 248 / 0.1333); @@ -6396,17 +6960,29 @@ --scale-sand-a11: rgb(255 252 244 / 0.7098); --scale-sand-a12: rgb(255 255 253 / 0.9333); --scale-tomato-1: #181111; + --scale-tomato-1: oklch(0.1866 0.0117 18.26); --scale-tomato-2: #1f1513; + --scale-tomato-2: oklch(0.2078 0.017 31.43); --scale-tomato-3: #391714; + --scale-tomato-3: oklch(0.2547 0.0548 26.76); --scale-tomato-4: #4e1511; + --scale-tomato-4: oklch(0.2902 0.0866 27.76); --scale-tomato-5: #5e1c16; + --scale-tomato-5: oklch(0.3311 0.0975 28.63); --scale-tomato-6: #6e2920; + --scale-tomato-6: oklch(0.38 0.1003 29.9); --scale-tomato-7: #853a2d; + --scale-tomato-7: oklch(0.4464 0.1063 31.61); --scale-tomato-8: #ac4d39; + --scale-tomato-8: oklch(0.5381 0.1294 33.41); --scale-tomato-9: #e54d2e; + --scale-tomato-9: oklch(0.6271 0.1936 33.34); --scale-tomato-10: #ec6142; + --scale-tomato-10: oklch(0.6643 0.1786 34.09); --scale-tomato-11: #ff977d; + --scale-tomato-11: oklch(0.7794 0.131 34.91); --scale-tomato-12: #fbd3cb; + --scale-tomato-12: oklch(0.8987 0.0465 31.23); --scale-tomato-a1: rgb(255 181 181 / 0.0941); --scale-tomato-a2: rgb(255 173 156 / 0.1216); --scale-tomato-a3: rgb(255 103 89 / 0.2235); @@ -6420,17 +6996,29 @@ --scale-tomato-a11: rgb(255 151 125 / 1); --scale-tomato-a12: rgb(255 214 206 / 0.9843); --scale-ruby-1: #191113; + --scale-ruby-1: oklch(0.1888 0.0139 1.87); --scale-ruby-2: #1e1517; + --scale-ruby-2: oklch(0.2079 0.0151 3.65); --scale-ruby-3: #3a141e; + --scale-ruby-3: oklch(0.2541 0.0612 6.05); --scale-ruby-4: #4e1325; + --scale-ruby-4: oklch(0.2925 0.0892 6.07); --scale-ruby-5: #5e1a2e; + --scale-ruby-5: oklch(0.3341 0.0997 6.48); --scale-ruby-6: #6f2539; + --scale-ruby-6: oklch(0.382 0.1059 7.06); --scale-ruby-7: #883447; + --scale-ruby-7: oklch(0.4482 0.1158 9.12); --scale-ruby-8: #b3445a; + --scale-ruby-8: oklch(0.5432 0.1448 11.27); --scale-ruby-9: #e54666; + --scale-ruby-9: oklch(0.6284 0.1949 13.15); --scale-ruby-10: #ec5a72; + --scale-ruby-10: oklch(0.6639 0.1803 13.63); --scale-ruby-11: #ff949d; + --scale-ruby-11: oklch(0.7814 0.1289 15.1); --scale-ruby-12: #fed2e1; + --scale-ruby-12: oklch(0.9055 0.0528 355.75); --scale-ruby-a1: rgb(255 173 194 / 0.098); --scale-ruby-a2: rgb(255 179 196 / 0.1176); --scale-ruby-a3: rgb(255 88 132 / 0.2275); @@ -6444,17 +7032,29 @@ --scale-ruby-a11: rgb(255 148 157 / 1); --scale-ruby-a12: rgb(255 211 226 / 0.9961); --scale-crimson-1: #191114; + --scale-crimson-1: oklch(0.1893 0.0145 354.17); --scale-crimson-2: #201318; + --scale-crimson-2: oklch(0.2062 0.0232 354.54); --scale-crimson-3: #381525; + --scale-crimson-3: oklch(0.255 0.0598 353.51); --scale-crimson-4: #4d122f; + --scale-crimson-4: oklch(0.2932 0.0935 354.29); --scale-crimson-5: #5c1839; + --scale-crimson-5: oklch(0.332 0.1045 354.53); --scale-crimson-6: #6d2545; + --scale-crimson-6: oklch(0.3826 0.1079 355.87); --scale-crimson-7: #873356; + --scale-crimson-7: oklch(0.4501 0.1207 357.14); --scale-crimson-8: #b0436e; + --scale-crimson-8: oklch(0.5431 0.1479 358.72); --scale-crimson-9: #e93d82; + --scale-crimson-9: oklch(0.6341 0.213 1.28); --scale-crimson-10: #ee518a; + --scale-crimson-10: oklch(0.6631 0.1974 1.85); --scale-crimson-11: #ff92ad; + --scale-crimson-11: oklch(0.7825 0.1338 4.74); --scale-crimson-12: #fdd3e8; + --scale-crimson-12: oklch(0.9085 0.0541 346.63); --scale-crimson-a1: rgb(255 173 204 / 0.098); --scale-crimson-a2: rgb(255 151 191 / 0.1255); --scale-crimson-a3: rgb(255 96 168 / 0.2196); @@ -6468,17 +7068,29 @@ --scale-crimson-a11: rgb(255 146 173 / 1); --scale-crimson-a12: rgb(255 213 234 / 0.9922); --scale-plum-1: #181118; + --scale-plum-1: oklch(0.1897 0.0177 326.25); --scale-plum-2: #201320; + --scale-plum-2: oklch(0.21 0.0318 326.64); --scale-plum-3: #351a35; + --scale-plum-3: oklch(0.2673 0.0609 327.11); --scale-plum-4: #451d47; + --scale-plum-4: oklch(0.3072 0.0874 325.61); --scale-plum-5: #512454; + --scale-plum-5: oklch(0.3438 0.0967 325.02); --scale-plum-6: #5e3061; + --scale-plum-6: oklch(0.389 0.0972 324.96); --scale-plum-7: #734079; + --scale-plum-7: oklch(0.456 0.1074 323.21); --scale-plum-8: #92549c; + --scale-plum-8: oklch(0.545 0.1281 321.88); --scale-plum-9: #ab4aba; + --scale-plum-9: oklch(0.5787 0.1877 322.11); --scale-plum-10: #b658c4; + --scale-plum-10: oklch(0.6162 0.1818 322.3); --scale-plum-11: #e796f3; + --scale-plum-11: oklch(0.7861 0.1536 322.22); --scale-plum-12: #f4d4f4; + --scale-plum-12: oklch(0.9061 0.055 326.02); --scale-plum-a1: rgb(255 181 255 / 0.0941); --scale-plum-a2: rgb(255 151 255 / 0.1255); --scale-plum-a3: rgb(255 125 255 / 0.2078); @@ -6492,17 +7104,29 @@ --scale-plum-a11: rgb(242 157 255 / 0.9529); --scale-plum-a12: rgb(255 222 255 / 0.9569); --scale-violet-1: #14121f; + --scale-violet-1: oklch(0.1914 0.0261 290.76); --scale-violet-2: #1b1525; + --scale-violet-2: oklch(0.2111 0.032 300.93); --scale-violet-3: #291f43; + --scale-violet-3: oklch(0.2707 0.0655 294.41); --scale-violet-4: #33255b; + --scale-violet-4: oklch(0.3118 0.093 292.08); --scale-violet-5: #3c2e69; + --scale-violet-5: oklch(0.3492 0.0991 291.33); --scale-violet-6: #473876; + --scale-violet-6: oklch(0.3889 0.1021 292.12); --scale-violet-7: #56468b; + --scale-violet-7: oklch(0.4445 0.1103 291.97); --scale-violet-8: #6958ad; + --scale-violet-8: oklch(0.5177 0.1305 290.29); --scale-violet-9: #6e56cf; + --scale-violet-9: oklch(0.5417 0.179 288.03); --scale-violet-10: #7d66d9; + --scale-violet-10: oklch(0.5886 0.1692 289.35); --scale-violet-11: #baa7ff; + --scale-violet-11: oklch(0.7778 0.1246 293.19); --scale-violet-12: #e2ddfe; + --scale-violet-12: oklch(0.9117 0.045 292.44); --scale-violet-a1: rgb(165 148 255 / 0.1216); --scale-violet-a2: rgb(186 145 255 / 0.1451); --scale-violet-a3: rgb(156 118 255 / 0.2627); @@ -6516,17 +7140,29 @@ --scale-violet-a11: rgb(186 167 255 / 1); --scale-violet-a12: rgb(227 222 255 / 0.9961); --scale-iris-1: #13131e; + --scale-iris-1: oklch(0.1924 0.0221 284.13); --scale-iris-2: #171625; + --scale-iris-2: oklch(0.2091 0.0295 286.61); --scale-iris-3: #202248; + --scale-iris-3: oklch(0.2722 0.0694 278.46); --scale-iris-4: #262a65; + --scale-iris-4: oklch(0.3181 0.1023 275.99); --scale-iris-5: #303374; + --scale-iris-5: oklch(0.3568 0.1095 277.31); --scale-iris-6: #3d3e82; + --scale-iris-6: oklch(0.4004 0.1117 279.45); --scale-iris-7: #4a4a95; + --scale-iris-7: oklch(0.4485 0.1199 280.42); --scale-iris-8: #5958b1; + --scale-iris-8: oklch(0.5068 0.1377 280.8); --scale-iris-9: #5b5bd6; + --scale-iris-9: oklch(0.5403 0.1841 278.28); --scale-iris-10: #6e6ade; + --scale-iris-10: oklch(0.5868 0.1717 281.26); --scale-iris-11: #b1a9ff; + --scale-iris-11: oklch(0.7743 0.1215 287.46); --scale-iris-12: #e0dffe; + --scale-iris-12: oklch(0.914 0.042 287.02); --scale-iris-a1: rgb(162 162 255 / 0.1176); --scale-iris-a2: rgb(159 152 255 / 0.1451); --scale-iris-a3: rgb(113 120 255 / 0.2824); @@ -6540,17 +7176,29 @@ --scale-iris-a11: rgb(177 169 255 / 1); --scale-iris-a12: rgb(225 224 255 / 0.9961); --scale-indigo-1: #11131f; + --scale-indigo-1: oklch(0.1909 0.0246 276.53); --scale-indigo-2: #141726; + --scale-indigo-2: oklch(0.2094 0.0302 274.84); --scale-indigo-3: #182449; + --scale-indigo-3: oklch(0.2716 0.0705 267.98); --scale-indigo-4: #1d2e62; + --scale-indigo-4: oklch(0.3185 0.0946 267.25); --scale-indigo-5: #253974; + --scale-indigo-5: oklch(0.3625 0.1044 267.03); --scale-indigo-6: #304384; + --scale-indigo-6: oklch(0.4033 0.1112 268.76); --scale-indigo-7: #3a4f97; + --scale-indigo-7: oklch(0.4491 0.1201 268.94); --scale-indigo-8: #435db1; + --scale-indigo-8: oklch(0.5021 0.1366 268.25); --scale-indigo-9: #3e63dd; + --scale-indigo-9: oklch(0.5438 0.191 267.01); --scale-indigo-10: #5472e4; + --scale-indigo-10: oklch(0.5891 0.1758 269.3); --scale-indigo-11: #9eb1ff; + --scale-indigo-11: oklch(0.7759 0.1138 273.02); --scale-indigo-12: #d6e1ff; + --scale-indigo-12: oklch(0.9108 0.0427 269.55); --scale-indigo-a1: rgb(140 156 255 / 0.1216); --scale-indigo-a2: rgb(134 154 255 / 0.149); --scale-indigo-a3: rgb(84 126 255 / 0.2863); @@ -6564,17 +7212,29 @@ --scale-indigo-a11: rgb(158 177 255 / 1); --scale-indigo-a12: rgb(214 225 255 / 1); --scale-jade-1: #0d1512; + --scale-jade-1: oklch(0.1864 0.0135 169.78); --scale-jade-2: #121c18; + --scale-jade-2: oklch(0.2151 0.0165 168.2); --scale-jade-3: #0f2e22; + --scale-jade-3: oklch(0.2736 0.0434 165.19); --scale-jade-4: #0b3b2c; + --scale-jade-4: oklch(0.3162 0.0572 167.62); --scale-jade-5: #114837; + --scale-jade-5: oklch(0.3612 0.0639 168.17); --scale-jade-6: #1b5745; + --scale-jade-6: oklch(0.4127 0.0687 169.57); --scale-jade-7: #246854; + --scale-jade-7: oklch(0.4684 0.0758 170.27); --scale-jade-8: #2a7e68; + --scale-jade-8: oklch(0.5365 0.0875 172.23); --scale-jade-9: #29a383; + --scale-jade-9: oklch(0.6422 0.115 170.73); --scale-jade-10: #27b08b; + --scale-jade-10: oklch(0.6777 0.1256 169.57); --scale-jade-11: #1fd8a4; + --scale-jade-11: oklch(0.7852 0.1559 167.11); --scale-jade-12: #adf0d4; + --scale-jade-12: oklch(0.9027 0.0776 166.88); --scale-jade-a1: rgb(158 255 219 / 0.0824); --scale-jade-a2: rgb(164 255 219 / 0.1098); --scale-jade-a3: rgb(83 255 188 / 0.1804); @@ -6588,17 +7248,29 @@ --scale-jade-a11: rgb(37 255 194 / 0.8471); --scale-jade-a12: rgb(184 255 225 / 0.9412); --scale-grass-1: #0e1511; + --scale-grass-1: oklch(0.1869 0.0134 159.73); --scale-grass-2: #141a15; + --scale-grass-2: oklch(0.2097 0.0133 149.92); --scale-grass-3: #1b2a1e; + --scale-grass-3: oklch(0.2673 0.0301 150.16); --scale-grass-4: #1d3a24; + --scale-grass-4: oklch(0.3186 0.0527 150.3); --scale-grass-5: #25482d; + --scale-grass-5: oklch(0.3668 0.0619 149.85); --scale-grass-6: #2d5736; + --scale-grass-6: oklch(0.4164 0.0724 149.33); --scale-grass-7: #366740; + --scale-grass-7: oklch(0.468 0.0826 148.99); --scale-grass-8: #3e7949; + --scale-grass-8: oklch(0.5229 0.0973 148.32); --scale-grass-9: #46a758; + --scale-grass-9: oklch(0.6512 0.1468 147.39); --scale-grass-10: #53b365; + --scale-grass-10: oklch(0.6894 0.145 147.8); --scale-grass-11: #71d083; + --scale-grass-11: oklch(0.7797 0.1419 148.48); --scale-grass-12: #c2f0c2; + --scale-grass-12: oklch(0.9109 0.0781 144.9); --scale-grass-a1: rgb(170 255 206 / 0.0824); --scale-grass-a2: rgb(196 255 206 / 0.102); --scale-grass-a3: rgb(164 255 182 / 0.1647); @@ -6612,17 +7284,29 @@ --scale-grass-a11: rgb(139 255 161 / 0.8157); --scale-grass-a12: rgb(206 255 206 / 0.9412); --scale-brown-1: #12110f; + --scale-brown-1: oklch(0.178 0.0043 84.59); --scale-brown-2: #1c1816; + --scale-brown-2: oklch(0.213 0.0075 48.35); --scale-brown-3: #28211d; + --scale-brown-3: oklch(0.2544 0.0131 51.58); --scale-brown-4: #322922; + --scale-brown-4: oklch(0.2887 0.0182 59.85); --scale-brown-5: #3e3128; + --scale-brown-5: oklch(0.3247 0.0244 56.41); --scale-brown-6: #4d3c2f; + --scale-brown-6: oklch(0.3708 0.0321 58.97); --scale-brown-7: #614a39; + --scale-brown-7: oklch(0.4288 0.0412 57.84); --scale-brown-8: #7c5f46; + --scale-brown-8: oklch(0.5085 0.053 61.96); --scale-brown-9: #ad7f58; + --scale-brown-9: oklch(0.6329 0.0785 60.98); --scale-brown-10: #b88c67; + --scale-brown-10: oklch(0.6733 0.074 61.13); --scale-brown-11: #dbb594; + --scale-brown-11: oklch(0.7984 0.0627 62.71); --scale-brown-12: #f2e1ca; + --scale-brown-12: oklch(0.9174 0.0358 75.54); --scale-brown-a1: rgb(255 241 213 / 0.0706); --scale-brown-a2: rgb(255 219 200 / 0.1098); --scale-brown-a3: rgb(255 210 185 / 0.1569); @@ -6636,17 +7320,29 @@ --scale-brown-a11: rgb(255 211 172 / 0.8588); --scale-brown-a12: rgb(255 237 213 / 0.949); --scale-sky-1: #0d141f; + --scale-sky-1: oklch(0.19 0.025 259.24); --scale-sky-2: #111a27; + --scale-sky-2: oklch(0.2158 0.029 257.53); --scale-sky-3: #112840; + --scale-sky-3: oklch(0.2714 0.0535 251.29); --scale-sky-4: #113555; + --scale-sky-4: oklch(0.3208 0.0703 248.74); --scale-sky-5: #154467; + --scale-sky-5: oklch(0.3734 0.0782 244.92); --scale-sky-6: #1b537b; + --scale-sky-6: oklch(0.4262 0.0878 243.92); --scale-sky-7: #1f6692; + --scale-sky-7: oklch(0.4884 0.0982 240.81); --scale-sky-8: #197cae; + --scale-sky-8: oklch(0.5568 0.1145 237.44); --scale-sky-9: #7ce2fe; + --scale-sky-9: oklch(0.8611 0.1027 217.8); --scale-sky-10: #a8eeff; + --scale-sky-10: oklch(0.9085 0.0732 214.51); --scale-sky-11: #75c7f0; + --scale-sky-11: oklch(0.7927 0.0991 231.61); --scale-sky-12: #c2f3ff; + --scale-sky-12: oklch(0.934 0.0526 214.32); --scale-sky-a1: rgb(107 165 255 / 0.1216); --scale-sky-a2: rgb(111 170 255 / 0.1529); --scale-sky-a3: rgb(68 159 255 / 0.251); @@ -6660,17 +7356,29 @@ --scale-sky-a11: rgb(124 211 255 / 0.9412); --scale-sky-a12: rgb(194 243 255 / 1); --scale-mint-1: #0e1515; + --scale-mint-1: oklch(0.1886 0.0106 196.29); --scale-mint-2: #0f1b1b; + --scale-mint-2: oklch(0.2109 0.017 195.94); --scale-mint-3: #092c2b; + --scale-mint-3: oklch(0.2683 0.0391 192.36); --scale-mint-4: #003a38; + --scale-mint-4: oklch(0.3146 0.0542 190.98); --scale-mint-5: #004744; + --scale-mint-5: oklch(0.359 0.062 189.96); --scale-mint-6: #105650; + --scale-mint-6: oklch(0.4106 0.0662 186.24); --scale-mint-7: #1e685f; + --scale-mint-7: oklch(0.4702 0.0725 183.51); --scale-mint-8: #277f70; + --scale-mint-8: oklch(0.5408 0.0853 179.23); --scale-mint-9: #86ead4; + --scale-mint-9: oklch(0.8696 0.0999 177.98); --scale-mint-10: #a8f5e5; + --scale-mint-10: oklch(0.9156 0.079 180); --scale-mint-11: #58d5ba; + --scale-mint-11: oklch(0.7954 0.1181 176.46); --scale-mint-12: #c4f5e1; + --scale-mint-12: oklch(0.9306 0.057 168.28); --scale-mint-a1: rgb(170 255 255 / 0.0824); --scale-mint-a2: rgb(142 255 255 / 0.1059); --scale-mint-a3: rgb(52 255 249 / 0.1725); @@ -6684,17 +7392,29 @@ --scale-mint-a11: rgb(105 255 223 / 0.8353); --scale-mint-a12: rgb(204 255 234 / 0.9608); --scale-lime-1: #11130c; + --scale-lime-1: oklch(0.1819 0.0141 120.76); --scale-lime-2: #151a10; + --scale-lime-2: oklch(0.209 0.0205 129.62); --scale-lime-3: #1f2917; + --scale-lime-3: oklch(0.2656 0.0349 132.01); --scale-lime-4: #29371d; + --scale-lime-4: oklch(0.3165 0.0475 131.68); --scale-lime-5: #334423; + --scale-lime-5: oklch(0.3626 0.0575 131.03); --scale-lime-6: #3d522a; + --scale-lime-6: oklch(0.4103 0.0675 131.45); --scale-lime-7: #496231; + --scale-lime-7: oklch(0.4633 0.0794 131.08); --scale-lime-8: #577538; + --scale-lime-8: oklch(0.5241 0.0945 130.63); --scale-lime-9: #bdee63; + --scale-lime-9: oklch(0.8874 0.1747 126.09); --scale-lime-10: #d4ff70; + --scale-lime-10: oklch(0.9417 0.1757 123.76); --scale-lime-11: #bde56c; + --scale-lime-11: oklch(0.8683 0.1552 124.74); --scale-lime-12: #e3f7ba; + --scale-lime-12: oklch(0.9465 0.0819 122.7); --scale-lime-a1: rgb(228 255 161 / 0.0745); --scale-lime-a2: rgb(206 255 157 / 0.102); --scale-lime-a3: rgb(193 255 143 / 0.1608); @@ -6708,17 +7428,29 @@ --scale-lime-a11: rgb(210 255 120 / 0.898); --scale-lime-a12: rgb(234 255 192 / 0.9686); --scale-gold-1: #15120d; + --scale-gold-1: oklch(0.184 0.011 80.49); --scale-gold-2: #1c1810; + --scale-gold-2: oklch(0.211 0.0162 84.42); --scale-gold-3: #2d210c; + --scale-gold-3: oklch(0.2567 0.0384 79.65); --scale-gold-4: #3b2906; + --scale-gold-4: oklch(0.2952 0.0552 79.79); --scale-gold-5: #483308; + --scale-gold-5: oklch(0.3369 0.0636 80.47); --scale-gold-6: #564011; + --scale-gold-6: oklch(0.3861 0.069 82.55); --scale-gold-7: #6b5222; + --scale-gold-7: oklch(0.4544 0.0728 81.35); --scale-gold-8: #87682e; + --scale-gold-8: oklch(0.5364 0.0852 80.81); --scale-gold-9: #d4af37; + --scale-gold-9: oklch(0.7665 0.1387 91.06); --scale-gold-10: #efdc4c; + --scale-gold-10: oklch(0.885 0.1593 101.68); --scale-gold-11: #efd049; + --scale-gold-11: oklch(0.8604 0.1522 95.94); --scale-gold-12: #f8e9ba; + --scale-gold-12: oklch(0.9345 0.0629 92.45); --scale-gold-a1: rgb(255 219 158 / 0.0824); --scale-gold-a2: rgb(255 219 146 / 0.1098); --scale-gold-a3: rgb(255 187 68 / 0.1765); @@ -6732,17 +7464,29 @@ --scale-gold-a11: rgb(255 222 78 / 0.9373); --scale-gold-a12: rgb(255 240 191 / 0.9725); --scale-bronze-1: #15130f; + --scale-bronze-1: oklch(0.1876 0.0085 84.57); --scale-bronze-2: #1b1711; + --scale-bronze-2: oklch(0.2072 0.0131 77.91); --scale-bronze-3: #2c2212; + --scale-bronze-3: oklch(0.2591 0.031 78.49); --scale-bronze-4: #3b280d; + --scale-bronze-4: oklch(0.2935 0.0493 73.17); --scale-bronze-5: #493111; + --scale-bronze-5: oklch(0.3345 0.0576 71.16); --scale-bronze-6: #583e1d; + --scale-bronze-6: oklch(0.3855 0.06 70.89); --scale-bronze-7: #6e4f2c; + --scale-bronze-7: oklch(0.4528 0.0652 68.25); --scale-bronze-8: #8e653a; + --scale-bronze-8: oklch(0.5399 0.0792 66.09); --scale-bronze-9: #cd7f32; + --scale-bronze-9: oklch(0.6661 0.1315 61.29); --scale-bronze-10: #dd9849; + --scale-bronze-10: oklch(0.7331 0.1257 67.14); --scale-bronze-11: #e1b071; + --scale-bronze-11: oklch(0.7882 0.0986 72.56); --scale-bronze-12: #f2e4cc; + --scale-bronze-12: oklch(0.9237 0.0353 81.27); --scale-bronze-a1: rgb(255 231 182 / 0.0824); --scale-bronze-a2: rgb(255 217 161 / 0.1059); --scale-bronze-a3: rgb(255 197 104 / 0.1725); diff --git a/src/uix/eidos/lib/render-css.ts b/src/uix/eidos/lib/render-css.ts index efffc7cbf..e5caa23a0 100644 --- a/src/uix/eidos/lib/render-css.ts +++ b/src/uix/eidos/lib/render-css.ts @@ -51,7 +51,7 @@ import type { KeyframeStops, MotionConfig } from '$motion' -import { apcaLc, oklchToGammaRgb, safeParseColor, wcagContrastRatio } from '$color' +import { apcaLc, oklchToCss, oklchToGammaRgb, safeParseColor, wcagContrastRatio } from '$color' import { EidosCssVariableError, EidosThemeNotFoundError } from '../errors' export interface RenderThemeCssOptions { @@ -1601,7 +1601,15 @@ function appendColorScaleDeclarations( scale: ColorScale ): void { for (const step of COLOR_SCALE_STEPS) { - declarations.push(cssVar(`scale-${scaleName}-${step}`, scale[step])) + const value = scale[step] + // Wide-gamut output (RFC §7, strategy A): the hex stays as the universal + // fallback, then an `oklch()` sibling overrides it where supported — so the + // color uses the display's gamut (more saturated on P3) automatically, with + // NO `@media`, and renders identically in sRGB. Only opaque, parseable steps + // get the sibling; empty / non-color values keep just the fallback line. + declarations.push(cssVar(`scale-${scaleName}-${step}`, value)) + const oklch = safeParseColor(value) + if (oklch) declarations.push(cssVar(`scale-${scaleName}-${step}`, oklchToCss(oklch))) } }