ghibli.css raw

   1  .theme-ghibli {
   2    --radius: 0.625rem;
   3  
   4    /* Logo colors */
   5    --logo-ink: #000000;
   6    --logo-accent: #000000;
   7  
   8    /* App colors */
   9    --background: oklch(0.91 0.05 82.78);
  10    --foreground: oklch(0.41 0.08 78.86);
  11    --card: oklch(0.92 0.04 84.56);
  12    --card-foreground: oklch(0.41 0.08 74.04);
  13    --popover: oklch(0.92 0.04 84.56);
  14    --popover-foreground: oklch(0.41 0.08 74.04);
  15    --primary: oklch(0.71 0.1 111.96);
  16    --primary-foreground: oklch(0.98 0.01 2.18);
  17    --secondary: oklch(0.88 0.05 83.32);
  18    --secondary-foreground: oklch(0.51 0.08 78.21);
  19    --muted: oklch(0.86 0.06 82.94);
  20    --muted-foreground: oklch(0.51 0.08 74.78);
  21    --accent: oklch(0.86 0.05 85.12);
  22    --accent-foreground: oklch(0.26 0.02 356.72);
  23    --destructive: oklch(0.63 0.24 29.21);
  24    --border: oklch(0.74 0.06 79.64);
  25    --input: oklch(0.74 0.06 79.64);
  26    --ring: var(--primary);
  27    --chart-1: oklch(0.66 0.19 41.68);
  28    --chart-2: oklch(0.7 0.12 183.58);
  29    --chart-3: oklch(0.48 0.08 211.35);
  30    --chart-4: oklch(0.84 0.17 84.99);
  31    --chart-5: oklch(0.74 0.17 60.02);
  32    --sidebar: oklch(0.87 0.06 84.46);
  33    --sidebar-foreground: oklch(0.41 0.08 78.86);
  34    --sidebar-primary: oklch(0.26 0.02 356.72);
  35    --sidebar-primary-foreground: oklch(0.98 0.01 2.18);
  36    --sidebar-accent: oklch(0.83 0.06 84.44);
  37    --sidebar-accent-foreground: oklch(0.26 0.02 356.72);
  38    --sidebar-border: oklch(0.91 0 0);
  39    --sidebar-ring: var(--primary);
  40  
  41    /* Custom colors */
  42    --positive: oklch(0.15 0.04 140);
  43    --positive-foreground: oklch(0.65 0.25 140);
  44    --warning: oklch(0.12 0.03 60);
  45    --warning-foreground: oklch(0.75 0.2 60);
  46  
  47    /* Custom shadows */
  48    --shadow-2xs: 0 1px 3px 0px oklch(0 0 0 / 0.05);
  49    --shadow-xs: 0 1px 3px 0px oklch(0 0 0 / 0.05);
  50    --shadow-sm:
  51      0 1px 3px 0px oklch(0 0 0 / 0.1), 0 1px 2px -1px oklch(0 0 0 / 0.1);
  52    --shadow: 0 1px 3px 0px oklch(0 0 0 / 0.1), 0 1px 2px -1px oklch(0 0 0 / 0.1);
  53    --shadow-md:
  54      0 1px 3px 0px oklch(0 0 0 / 0.1), 0 2px 4px -1px oklch(0 0 0 / 0.1);
  55    --shadow-lg:
  56      0 1px 3px 0px oklch(0 0 0 / 0.1), 0 4px 6px -1px oklch(0 0 0 / 0.1);
  57    --shadow-xl:
  58      0 1px 3px 0px oklch(0 0 0 / 0.1), 0 8px 10px -1px oklch(0 0 0 / 0.1);
  59    --shadow-2xl: 0 1px 3px 0px oklch(0 0 0 / 0.25);
  60  }
  61  
  62  .theme-ghibli.dark {
  63    /* Logo colors */
  64    --logo-ink: #ffffff;
  65    --logo-accent: #ffffff;
  66  
  67    /* App colors */
  68    --background: oklch(0.2 0.01 52.89);
  69    --foreground: oklch(0.88 0.05 79.11);
  70    --card: oklch(0.25 0.01 48.28);
  71    --card-foreground: oklch(0.88 0.05 79.11);
  72    --popover: oklch(0.25 0.01 48.28);
  73    --popover-foreground: oklch(0.88 0.05 79.11);
  74    --primary: oklch(0.64 0.05 114.58);
  75    --primary-foreground: oklch(0.98 0.01 2.18);
  76    --secondary: oklch(0.33 0.02 60.7);
  77    --secondary-foreground: oklch(0.88 0.05 83.32);
  78    --muted: oklch(0.27 0.01 39.35);
  79    --muted-foreground: oklch(0.74 0.06 79.64);
  80    --accent: oklch(0.33 0.02 60.7);
  81    --accent-foreground: oklch(0.86 0.05 85.12);
  82    --destructive: oklch(0.63 0.24 29.21);
  83    --border: oklch(0.33 0.02 60.7);
  84    --input: oklch(0.33 0.02 60.7);
  85    --ring: var(--primary);
  86    --chart-1: oklch(0.66 0.19 41.68);
  87    --chart-2: oklch(0.7 0.12 183.58);
  88    --chart-3: oklch(0.48 0.08 211.35);
  89    --chart-4: oklch(0.84 0.17 84.99);
  90    --chart-5: oklch(0.74 0.17 60.02);
  91    --sidebar: oklch(0.23 0.01 60.9);
  92    --sidebar-foreground: oklch(0.88 0.05 79.11);
  93    --sidebar-primary: oklch(0.64 0.05 114.58);
  94    --sidebar-primary-foreground: oklch(0.98 0.01 2.18);
  95    --sidebar-accent: oklch(0.33 0.02 60.7);
  96    --sidebar-accent-foreground: oklch(0.86 0.05 85.12);
  97    --sidebar-border: oklch(0.33 0.02 60.7);
  98    --sidebar-ring: var(--primary);
  99  
 100    /* Custom colors */
 101    --positive: oklch(0.12 0.03 140);
 102    --positive-foreground: oklch(0.75 0.3 140);
 103    --warning: oklch(0.1 0.02 60);
 104    --warning-foreground: oklch(0.8 0.25 60);
 105  
 106    /* Custom shadows */
 107    --shadow-2xs: 0 1px 3px 0px oklch(0 0 0 / 0.05);
 108    --shadow-xs: 0 1px 3px 0px oklch(0 0 0 / 0.05);
 109    --shadow-sm:
 110      0 1px 3px 0px oklch(0 0 0 / 0.1), 0 1px 2px -1px oklch(0 0 0 / 0.1);
 111    --shadow: 0 1px 3px 0px oklch(0 0 0 / 0.1), 0 1px 2px -1px oklch(0 0 0 / 0.1);
 112    --shadow-md:
 113      0 1px 3px 0px oklch(0 0 0 / 0.1), 0 2px 4px -1px oklch(0 0 0 / 0.1);
 114    --shadow-lg:
 115      0 1px 3px 0px oklch(0 0 0 / 0.1), 0 4px 6px -1px oklch(0 0 0 / 0.1);
 116    --shadow-xl:
 117      0 1px 3px 0px oklch(0 0 0 / 0.1), 0 8px 10px -1px oklch(0 0 0 / 0.1);
 118    --shadow-2xl: 0 1px 3px 0px oklch(0 0 0 / 0.25);
 119  }
 120