omgkit 2.30.0 → 2.32.0

package/templates/design/themes/nature-organic/lavender.json

@@ -1,8 +1,464 @@
 {
+  "version": "2.0",
   "name": "Lavender",
   "id": "lavender",
   "category": "nature-organic",
-  "description": "Soft purple nature aesthetic inspired by Provence",
+  "description": "Soft purple nature aesthetic inspired by Provence - featuring 12-step color scales, effects, and animations",
+  "colorSystem": {
+    "type": "radix",
+    "version": "3.0"
+  },
+  "scales": {
+    "primary": {
+      "name": "violet",
+      "hue": 270,
+      "saturation": {
+        "light": {
+          "low": 30,
+          "high": 65
+        },
+        "dark": {
+          "low": 25,
+          "high": 60
+        }
+      },
+      "steps": {
+        "light": {
+          "1": "270 30% 99%",
+          "2": "270 35% 97%",
+          "3": "270 40% 93%",
+          "4": "270 45% 88%",
+          "5": "270 50% 82%",
+          "6": "270 55% 74%",
+          "7": "270 60% 62%",
+          "8": "270 55% 50%",
+          "9": "270 65% 45%",
+          "10": "270 65% 40%",
+          "11": "270 65% 32%",
+          "12": "270 70% 18%"
+        },
+        "dark": {
+          "1": "270 25% 7%",
+          "2": "270 30% 10%",
+          "3": "270 35% 14%",
+          "4": "270 40% 18%",
+          "5": "270 45% 22%",
+          "6": "270 50% 28%",
+          "7": "270 55% 35%",
+          "8": "270 40% 42%",
+          "9": "270 60% 45%",
+          "10": "270 55% 52%",
+          "11": "270 45% 65%",
+          "12": "270 35% 80%"
+        }
+      },
+      "alpha": {
+        "light": {
+          "1": "270 60% 45% / 0.05",
+          "2": "270 60% 45% / 0.1",
+          "3": "270 60% 45% / 0.15",
+          "4": "270 60% 45% / 0.2",
+          "5": "270 60% 45% / 0.3",
+          "6": "270 60% 45% / 0.4",
+          "7": "270 60% 45% / 0.5",
+          "8": "270 60% 45% / 0.6",
+          "9": "270 60% 45% / 0.7",
+          "10": "270 60% 45% / 0.8",
+          "11": "270 60% 45% / 0.9",
+          "12": "270 60% 45% / 0.95"
+        },
+        "dark": {
+          "1": "270 60% 50% / 0.05",
+          "2": "270 60% 50% / 0.1",
+          "3": "270 60% 50% / 0.15",
+          "4": "270 60% 50% / 0.2",
+          "5": "270 60% 50% / 0.3",
+          "6": "270 60% 50% / 0.4",
+          "7": "270 60% 50% / 0.5",
+          "8": "270 60% 50% / 0.6",
+          "9": "270 60% 50% / 0.7",
+          "10": "270 60% 50% / 0.8",
+          "11": "270 60% 50% / 0.9",
+          "12": "270 60% 50% / 0.95"
+        }
+      }
+    },
+    "neutral": {
+      "name": "gray",
+      "hue": 270,
+      "steps": {
+        "light": {
+          "1": "260 40% 99%",
+          "2": "260 40% 98%",
+          "3": "260 35% 96%",
+          "4": "260 30% 94%",
+          "5": "260 25% 91%",
+          "6": "260 20% 86%",
+          "7": "260 18% 78%",
+          "8": "260 16% 65%",
+          "9": "260 14% 50%",
+          "10": "260 12% 40%",
+          "11": "270 47% 11%",
+          "12": "270 84% 5%"
+        },
+        "dark": {
+          "1": "270 84% 5%",
+          "2": "270 50% 8%",
+          "3": "265 33% 17%",
+          "4": "265 30% 22%",
+          "5": "265 28% 28%",
+          "6": "265 26% 35%",
+          "7": "265 22% 45%",
+          "8": "265 20% 55%",
+          "9": "263 20% 65%",
+          "10": "263 18% 75%",
+          "11": "260 35% 88%",
+          "12": "260 40% 98%"
+        }
+      }
+    }
+  },
+  "semanticTokens": {
+    "light": {
+      "background": "0 0% 100%",
+      "foreground": {
+        "$ref": "scales.neutral.steps.light.12"
+      },
+      "surface": {
+        "$ref": "scales.neutral.steps.light.2"
+      },
+      "surface-hover": {
+        "$ref": "scales.neutral.steps.light.3"
+      },
+      "surface-active": {
+        "$ref": "scales.neutral.steps.light.4"
+      },
+      "primary": {
+        "$ref": "scales.primary.steps.light.9"
+      },
+      "primary-hover": {
+        "$ref": "scales.primary.steps.light.10"
+      },
+      "primary-foreground": "210 40% 98%",
+      "secondary": {
+        "$ref": "scales.neutral.steps.light.3"
+      },
+      "secondary-hover": {
+        "$ref": "scales.neutral.steps.light.4"
+      },
+      "secondary-foreground": {
+        "$ref": "scales.neutral.steps.light.11"
+      },
+      "muted": {
+        "$ref": "scales.neutral.steps.light.3"
+      },
+      "muted-foreground": {
+        "$ref": "scales.neutral.steps.light.9"
+      },
+      "accent": {
+        "$ref": "scales.neutral.steps.light.3"
+      },
+      "accent-hover": {
+        "$ref": "scales.neutral.steps.light.4"
+      },
+      "accent-foreground": {
+        "$ref": "scales.neutral.steps.light.11"
+      },
+      "border": {
+        "$ref": "scales.neutral.steps.light.5"
+      },
+      "border-hover": {
+        "$ref": "scales.neutral.steps.light.6"
+      },
+      "input": {
+        "$ref": "scales.neutral.steps.light.5"
+      },
+      "input-hover": {
+        "$ref": "scales.neutral.steps.light.6"
+      },
+      "ring": {
+        "$ref": "scales.primary.steps.light.9"
+      },
+      "ring-offset": "0 0% 100%",
+      "card": "0 0% 100%",
+      "card-foreground": {
+        "$ref": "scales.neutral.steps.light.12"
+      },
+      "popover": "0 0% 100%",
+      "popover-foreground": {
+        "$ref": "scales.neutral.steps.light.12"
+      },
+      "panel": {
+        "$ref": "scales.neutral.steps.light.2"
+      },
+      "panel-translucent": "0 0% 100% / 0.9",
+      "overlay": "0 0% 0% / 0.4"
+    },
+    "dark": {
+      "background": {
+        "$ref": "scales.neutral.steps.dark.1"
+      },
+      "foreground": {
+        "$ref": "scales.neutral.steps.dark.12"
+      },
+      "surface": {
+        "$ref": "scales.neutral.steps.dark.2"
+      },
+      "surface-hover": {
+        "$ref": "scales.neutral.steps.dark.3"
+      },
+      "surface-active": {
+        "$ref": "scales.neutral.steps.dark.4"
+      },
+      "primary": {
+        "$ref": "scales.primary.steps.dark.9"
+      },
+      "primary-hover": {
+        "$ref": "scales.primary.steps.dark.10"
+      },
+      "primary-foreground": {
+        "$ref": "scales.neutral.steps.dark.1"
+      },
+      "secondary": {
+        "$ref": "scales.neutral.steps.dark.3"
+      },
+      "secondary-hover": {
+        "$ref": "scales.neutral.steps.dark.4"
+      },
+      "secondary-foreground": {
+        "$ref": "scales.neutral.steps.dark.12"
+      },
+      "muted": {
+        "$ref": "scales.neutral.steps.dark.3"
+      },
+      "muted-foreground": {
+        "$ref": "scales.neutral.steps.dark.9"
+      },
+      "accent": {
+        "$ref": "scales.neutral.steps.dark.3"
+      },
+      "accent-hover": {
+        "$ref": "scales.neutral.steps.dark.4"
+      },
+      "accent-foreground": {
+        "$ref": "scales.neutral.steps.dark.12"
+      },
+      "border": {
+        "$ref": "scales.neutral.steps.dark.3"
+      },
+      "border-hover": {
+        "$ref": "scales.neutral.steps.dark.4"
+      },
+      "input": {
+        "$ref": "scales.neutral.steps.dark.3"
+      },
+      "input-hover": {
+        "$ref": "scales.neutral.steps.dark.4"
+      },
+      "ring": {
+        "$ref": "scales.primary.steps.dark.9"
+      },
+      "ring-offset": {
+        "$ref": "scales.neutral.steps.dark.1"
+      },
+      "card": {
+        "$ref": "scales.neutral.steps.dark.1"
+      },
+      "card-foreground": {
+        "$ref": "scales.neutral.steps.dark.12"
+      },
+      "popover": {
+        "$ref": "scales.neutral.steps.dark.1"
+      },
+      "popover-foreground": {
+        "$ref": "scales.neutral.steps.dark.12"
+      },
+      "panel": {
+        "$ref": "scales.neutral.steps.dark.2"
+      },
+      "panel-translucent": "270 84% 5% / 0.9",
+      "overlay": "0 0% 0% / 0.6"
+    }
+  },
+  "statusColors": {
+    "light": {
+      "destructive": "0 84% 60%",
+      "destructive-foreground": "0 0% 98%",
+      "success": "151 55% 42%",
+      "success-foreground": "0 0% 100%",
+      "warning": "39 100% 50%",
+      "warning-foreground": "39 40% 15%",
+      "info": "206 100% 50%",
+      "info-foreground": "0 0% 100%"
+    },
+    "dark": {
+      "destructive": "0 63% 31%",
+      "destructive-foreground": "0 0% 98%",
+      "success": "151 50% 45%",
+      "success-foreground": "0 0% 100%",
+      "warning": "39 90% 55%",
+      "warning-foreground": "39 80% 10%",
+      "info": "206 90% 55%",
+      "info-foreground": "0 0% 100%"
+    }
+  },
+  "chartColors": {
+    "1": {
+      "$ref": "scales.primary.steps.light.9"
+    },
+    "2": "262 83% 58%",
+    "3": "25 95% 53%",
+    "4": "142 76% 36%",
+    "5": "347 77% 50%"
+  },
+  "sidebarTokens": {
+    "light": {
+      "background": "0 0% 98%",
+      "foreground": {
+        "$ref": "scales.neutral.steps.light.9"
+      },
+      "primary": {
+        "$ref": "scales.primary.steps.light.9"
+      },
+      "primary-foreground": "0 0% 98%",
+      "accent": {
+        "$ref": "scales.neutral.steps.light.3"
+      },
+      "accent-foreground": {
+        "$ref": "scales.neutral.steps.light.11"
+      },
+      "border": {
+        "$ref": "scales.neutral.steps.light.5"
+      },
+      "ring": {
+        "$ref": "scales.primary.steps.light.9"
+      }
+    },
+    "dark": {
+      "background": {
+        "$ref": "scales.neutral.steps.dark.1"
+      },
+      "foreground": {
+        "$ref": "scales.neutral.steps.dark.12"
+      },
+      "primary": {
+        "$ref": "scales.primary.steps.dark.9"
+      },
+      "primary-foreground": "0 0% 100%",
+      "accent": {
+        "$ref": "scales.neutral.steps.dark.3"
+      },
+      "accent-foreground": {
+        "$ref": "scales.neutral.steps.dark.12"
+      },
+      "border": {
+        "$ref": "scales.neutral.steps.dark.3"
+      },
+      "ring": {
+        "$ref": "scales.primary.steps.dark.9"
+      }
+    }
+  },
+  "typography": {
+    "fontFamily": {
+      "sans": "Inter, system-ui, sans-serif",
+      "mono": "JetBrains Mono, monospace"
+    },
+    "fontFeatureSettings": "\"rlig\" 1, \"calt\" 1"
+  },
+  "spacing": {
+    "radius": "0.5rem",
+    "radiusLg": "var(--radius)",
+    "radiusMd": "calc(var(--radius) - 2px)",
+    "radiusSm": "calc(var(--radius) - 4px)"
+  },
+  "effects": {
+    "glassMorphism": {
+      "background": {
+        "$ref": "scales.neutral.steps.light.1"
+      },
+      "backdropBlur": "12px"
+    },
+    "glow": {
+      "default": "0 0 20px",
+      "lg": "0 0 40px",
+      "color": {
+        "$ref": "scales.primary.steps.light.9"
+      }
+    },
+    "gradient": {
+      "primary": {
+        "from": {
+          "$ref": "scales.primary.steps.light.9"
+        },
+        "to": {
+          "$ref": "scales.primary.steps.light.11"
+        },
+        "direction": "135deg"
+      },
+      "surface": {
+        "from": "0 0% 100%",
+        "to": {
+          "$ref": "scales.neutral.steps.light.2"
+        },
+        "direction": "180deg"
+      }
+    }
+  },
+  "animations": {
+    "shimmer": {
+      "duration": "8s",
+      "easing": "ease-in-out",
+      "iteration": "infinite",
+      "keyframes": {
+        "0%": {
+          "backgroundPosition": "-200% 0"
+        },
+        "100%": {
+          "backgroundPosition": "200% 0"
+        }
+      }
+    },
+    "pulse-glow": {
+      "duration": "2s",
+      "easing": "ease-in-out",
+      "iteration": "infinite",
+      "keyframes": {
+        "0%, 100%": {
+          "boxShadow": "0 0 20px hsl(270 60% 45% / 0.3)"
+        },
+        "50%": {
+          "boxShadow": "0 0 40px hsl(270 60% 45% / 0.6)"
+        }
+      }
+    },
+    "fade-in": {
+      "duration": "0.3s",
+      "easing": "ease-out",
+      "keyframes": {
+        "from": {
+          "opacity": "0"
+        },
+        "to": {
+          "opacity": "1"
+        }
+      }
+    },
+    "slide-up": {
+      "duration": "0.4s",
+      "easing": "cubic-bezier(0.16, 1, 0.3, 1)",
+      "keyframes": {
+        "from": {
+          "transform": "translateY(10px)",
+          "opacity": "0"
+        },
+        "to": {
+          "transform": "translateY(0)",
+          "opacity": "1"
+        }
+      }
+    }
+  },
   "colors": {
     "light": {
       "background": "270 50% 99%",