feat: ✨ add light mode and css theme

Signed-off-by: Suyashtnt <[email protected]>

build/dark/kleur.css

@@ -0,0 +1,57 @@
+:root {
+  --background: lch(3%, 7, 290);
+  --base100: lch(25%, 9, 289);
+  --base200: lch(36%, 8, 289);
+  --base300: lch(46%, 7, 284);
+  --base400: lch(56%, 5, 287);
+  --base500: lch(67%, 4, 291);
+  --base600: lch(77%, 3, 290);
+  --blue100: lch(25%, 23, 253);
+  --blue200: lch(36%, 28, 252);
+  --blue300: lch(46%, 34, 253);
+  --blue400: lch(57%, 39, 252);
+  --blue500: lch(67%, 44, 249);
+  --blue600: lch(77%, 42, 237);
+  --green100: lch(25%, 37, 146);
+  --green200: lch(35%, 47, 146);
+  --green300: lch(46%, 56, 147);
+  --green400: lch(56%, 64, 147);
+  --green500: lch(67%, 72, 148);
+  --green600: lch(77%, 76, 150);
+  --orange100: lch(25%, 37, 72);
+  --orange200: lch(36%, 47, 73);
+  --orange300: lch(46%, 56, 73);
+  --orange400: lch(56%, 66, 73);
+  --orange500: lch(67%, 74, 75);
+  --orange600: lch(77%, 75, 76);
+  --purple100: lch(25%, 30, 300);
+  --purple200: lch(36%, 38, 299);
+  --purple300: lch(46%, 44, 299);
+  --purple400: lch(56%, 50, 299);
+  --purple500: lch(67%, 54, 299);
+  --purple600: lch(77%, 39, 299);
+  --red100: lch(25%, 55, 35);
+  --red200: lch(35%, 65, 35);
+  --red300: lch(46%, 72, 34);
+  --red400: lch(56%, 73, 33);
+  --red500: lch(67%, 58, 32);
+  --red600: lch(77%, 36, 32);
+  --teal100: lch(25%, 20, 189);
+  --teal200: lch(35%, 25, 189);
+  --teal300: lch(46%, 30, 189);
+  --teal400: lch(56%, 35, 190);
+  --teal500: lch(67%, 40, 190);
+  --teal600: lch(77%, 45, 190);
+  --primary100: lch(25%, 30, 300);
+  --primary200: lch(36%, 38, 299);
+  --primary300: lch(46%, 44, 299);
+  --primary400: lch(56%, 50, 299);
+  --primary500: lch(67%, 54, 299);
+  --primary600: lch(77%, 39, 298);
+  --secondary100: lch(25%, 23, 253);
+  --secondary200: lch(36%, 28, 252);
+  --secondary300: lch(46%, 34, 253);
+  --secondary400: lch(57%, 39, 252);
+  --secondary500: lch(67%, 44, 249);
+  --secondary600: lch(77%, 42, 237);
+}

deno.json

@@ -1,7 +1,7 @@
 {
   "imports": {
     "std/": "https://deno.land/[email protected]/",
-    "culori/fn": "npm:culori@4",
+    "chroma": "npm:chroma-js@2",
     "@adobe/leonardo-contrast-colors": "npm:@adobe/leonardo-contrast-colors",
     "mustache": "https://deno.land/x/[email protected]/mod.ts",
     "yaml": "https://esm.sh/[email protected]"
@@ -11,4 +11,4 @@
     "dev": "deno run --watch mod.ts",
     "build": "deno run -A build.ts"
   }
-}
+}