omnidesign 1.0.0

package/tokens/themes/lavender.json

@@ -0,0 +1,143 @@
+{
+  "theme": {
+    "$type": "theme",
+    "$value": "lavender",
+    "$description": "Lavender theme with soft purple tones - dreamy and creative like Lovable's Lavender"
+  },
+  "color": {
+    "text": {
+      "default": {
+        "$type": "color",
+        "$value": "#2D1B4E",
+        "$description": "Primary text - deep violet for contrast on lavender surfaces"
+      },
+      "muted": {
+        "$type": "color",
+        "$value": "#6B5A7A",
+        "$description": "Secondary text - muted purple-gray"
+      },
+      "inverted": {
+        "$type": "color",
+        "$value": "#FAF5FF",
+        "$description": "Text on light surfaces - soft lavender-white"
+      },
+      "link": {
+        "$type": "color",
+        "$value": "#A78BFA",
+        "$description": "Link text - soft lavender purple"
+      },
+      "link.hover": {
+        "$type": "color",
+        "$value": "#C4B5FD",
+        "$description": "Link on hover - bright lavender"
+      }
+    },
+    "surface": {
+      "default": {
+        "$type": "color",
+        "$value": "#FAF5FF",
+        "$description": "Default surface - pale lavender cream"
+      },
+      "raised": {
+        "$type": "color",
+        "$value": "#FFFFFF",
+        "$description": "Elevated surface - pure white"
+      },
+      "sunken": {
+        "$type": "color",
+        "$value": "#F3E8FF",
+        "$description": "Depressed surface - soft violet for inputs"
+      },
+      "overlay": {
+        "$type": "color",
+        "$value": "rgba(167, 139, 250, 0.1)",
+        "$description": "Overlay - lavender-tinted backdrop"
+      }
+    },
+    "border": {
+      "default": {
+        "$type": "color",
+        "$value": "#DDD6FE",
+        "$description": "Default border - soft lavender"
+      },
+      "subtle": {
+        "$type": "color",
+        "$value": "#EDE9FE",
+        "$description": "Subtle border - very faint purple"
+      },
+      "strong": {
+        "$type": "color",
+        "$value": "#C4B5FD",
+        "$description": "Strong border - visible lavender"
+      }
+    },
+    "interactive": {
+      "primary": {
+        "$type": "color",
+        "$value": "#8B5CF6",
+        "$description": "Primary action - vibrant violet"
+      },
+      "primary.hover": {
+        "$type": "color",
+        "$value": "#A78BFA",
+        "$description": "Primary hover - bright lavender"
+      },
+      "secondary": {
+        "$type": "color",
+        "$value": "#7C3AED",
+        "$description": "Secondary action - deep violet"
+      }
+    },
+    "focus": {
+      "ring": {
+        "$type": "color",
+        "$value": "#A78BFA",
+        "$description": "Focus ring - soft lavender glow"
+      }
+    },
+    "status": {
+      "success": {
+        "$type": "color",
+        "$value": "#10B981",
+        "$description": "Success - emerald green"
+      },
+      "warning": {
+        "$type": "color",
+        "$value": "#F59E0B",
+        "$description": "Warning - warm amber"
+      },
+      "error": {
+        "$type": "color",
+        "$value": "#EF4444",
+        "$description": "Error - vibrant red"
+      },
+      "info": {
+        "$type": "color",
+        "$value": "#38BDF8",
+        "$description": "Info - sky blue"
+      }
+    }
+  },
+  "shadow": {
+    "card": {
+      "$type": "shadow",
+      "$value": "0 4px 6px -1px rgba(139, 92, 246, 0.12), 0 2px 4px -2px rgba(139, 92, 246, 0.08)",
+      "$description": "Card shadow - lavender-tinted elevation"
+    },
+    "dropdown": {
+      "$type": "shadow",
+      "$value": "0 10px 15px -3px rgba(139, 92, 246, 0.15), 0 4px 6px -4px rgba(139, 92, 246, 0.1)",
+      "$description": "Dropdown shadow - violet-tinted depth"
+    },
+    "modal": {
+      "$type": "shadow",
+      "$value": "0 20px 25px -5px rgba(139, 92, 246, 0.2), 0 8px 10px -6px rgba(139, 92, 246, 0.15)",
+      "$description": "Modal shadow - prominent lavender-tinted"
+    },
+    "focus": {
+      "$type": "shadow",
+      "$value": "0 0 0 3px rgba(167, 139, 250, 0.4)",
+      "$description": "Focus glow - soft lavender ring"
+    }
+  }
+}

package/tokens/themes/midnight.json

@@ -0,0 +1,143 @@
+{
+  "theme": {
+    "$type": "theme",
+    "$value": "midnight",
+    "$description": "True midnight black with subtle blue undertones for late-night coding sessions"
+  },
+  "color": {
+    "text": {
+      "default": {
+        "$type": "color",
+        "$value": "#F1F5F9",
+        "$description": "Primary text on midnight - cool white with blue hint"
+      },
+      "muted": {
+        "$type": "color",
+        "$value": "#64748B",
+        "$description": "Secondary text - muted gray-blue"
+      },
+      "inverted": {
+        "$type": "color",
+        "$value": "#0A0A0F",
+        "$description": "Text color for light surfaces - deep midnight"
+      },
+      "link": {
+        "$type": "color",
+        "$value": "#38BDF8",
+        "$description": "Link text color - sky blue glow"
+      },
+      "link.hover": {
+        "$type": "color",
+        "$value": "#7DD3FC",
+        "$description": "Link text color on hover - brighter sky blue"
+      }
+    },
+    "surface": {
+      "default": {
+        "$type": "color",
+        "$value": "#0A0A0F",
+        "$description": "Default surface background - true midnight black"
+      },
+      "raised": {
+        "$type": "color",
+        "$value": "#111116",
+        "$description": "Elevated surface background - slight lighter midnight"
+      },
+      "sunken": {
+        "$type": "color",
+        "$value": "#050508",
+        "$description": "Depressed surface background - deepest midnight for inputs"
+      },
+      "overlay": {
+        "$type": "color",
+        "$value": "rgba(10, 10, 15, 0.85)",
+        "$description": "Overlay background for modals - semi-transparent midnight"
+      }
+    },
+    "border": {
+      "default": {
+        "$type": "color",
+        "$value": "#1C1C24",
+        "$description": "Default border color - subtle midnight border"
+      },
+      "subtle": {
+        "$type": "color",
+        "$value": "#0F0F15",
+        "$description": "Subtle border for dividers - almost invisible"
+      },
+      "strong": {
+        "$type": "color",
+        "$value": "#2A2A33",
+        "$description": "Stronger border for emphasis - visible midnight border"
+      }
+    },
+    "interactive": {
+      "primary": {
+        "$type": "color",
+        "$value": "#38BDF8",
+        "$description": "Primary interactive element color - midnight blue glow"
+      },
+      "primary.hover": {
+        "$type": "color",
+        "$value": "#7DD3FC",
+        "$description": "Primary interactive color on hover - brighter sky blue"
+      },
+      "secondary": {
+        "$type": "color",
+        "$value": "#1E293B",
+        "$description": "Secondary interactive element color - lighter midnight"
+      }
+    },
+    "focus": {
+      "ring": {
+        "$type": "color",
+        "$value": "#38BDF8",
+        "$description": "Focus ring outline color - sky blue glow"
+      }
+    },
+    "status": {
+      "success": {
+        "$type": "color",
+        "$value": "#22D3EE",
+        "$description": "Success state color - cyan for midnight"
+      },
+      "warning": {
+        "$type": "color",
+        "$value": "#FBBF24",
+        "$description": "Warning state color - amber"
+      },
+      "error": {
+        "$type": "color",
+        "$value": "#F87171",
+        "$description": "Error state color - coral red adjusted for midnight"
+      },
+      "info": {
+        "$type": "color",
+        "$value": "#38BDF8",
+        "$description": "Info state color - sky blue"
+      }
+    }
+  },
+  "shadow": {
+    "card": {
+      "$type": "shadow",
+      "$value": "0 4px 6px -1px rgba(56, 189, 248, 0.15), 0 2px 4px -2px rgba(56, 189, 248, 0.1)",
+      "$description": "Card elevation shadow - subtle blue-tinted glow"
+    },
+    "dropdown": {
+      "$type": "shadow",
+      "$value": "0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -4px rgba(0, 0, 0, 0.3)",
+      "$description": "Dropdown menu elevation shadow - deep black shadow"
+    },
+    "modal": {
+      "$type": "shadow",
+      "$value": "0 20px 25px -5px rgba(0, 0, 0, 0.6), 0 8px 10px -6px rgba(0, 0, 0, 0.4)",
+      "$description": "Modal dialog elevation shadow - most prominent midnight shadow"
+    },
+    "focus": {
+      "$type": "shadow",
+      "$value": "0 0 0 3px rgba(56, 189, 248, 0.5)",
+      "$description": "Focus ring glow shadow - sky blue glow ring"
+    }
+  }
+}

package/tokens/themes/mint.json

@@ -0,0 +1,143 @@
+{
+  "theme": {
+    "$type": "theme",
+    "$value": "mint",
+    "$description": "Fresh mint theme with soft greens and pastel tones - refreshing and clean"
+  },
+  "color": {
+    "text": {
+      "default": {
+        "$type": "color",
+        "$value": "#1A3C34",
+        "$description": "Primary text - deep green for contrast on pastel surfaces"
+      },
+      "muted": {
+        "$type": "color",
+        "$value": "#5A7268",
+        "$description": "Secondary text - soft sage gray"
+      },
+      "inverted": {
+        "$type": "color",
+        "$value": "#F0FDF4",
+        "$description": "Text on light surfaces - pale mint white"
+      },
+      "link": {
+        "$type": "color",
+        "$value": "#34D399",
+        "$description": "Link text - fresh mint green"
+      },
+      "link.hover": {
+        "$type": "color",
+        "$value": "#6EE7B7",
+        "$description": "Link on hover - lighter mint"
+      }
+    },
+    "surface": {
+      "default": {
+        "$type": "color",
+        "$value": "#F0FDF4",
+        "$description": "Default surface - pale mint cream"
+      },
+      "raised": {
+        "$type": "color",
+        "$value": "#FFFFFF",
+        "$description": "Elevated surface - pure white"
+      },
+      "sunken": {
+        "$type": "color",
+        "$value": "#DCFCE7",
+        "$description": "Depressed surface - soft mint for inputs"
+      },
+      "overlay": {
+        "$type": "color",
+        "$value": "rgba(52, 211, 153, 0.1)",
+        "$description": "Overlay - mint-tinted backdrop"
+      }
+    },
+    "border": {
+      "default": {
+        "$type": "color",
+        "$value": "#A7F3D0",
+        "$description": "Default border - soft purple-mint"
+      },
+      "subtle": {
+        "$type": "color",
+        "$value": "#D8B4FE",
+        "$description": "Subtle border - very faint purple"
+      },
+      "strong": {
+        "$type": "color",
+        "$value": "#6EE7B7",
+        "$description": "Strong border - visible mint green"
+      }
+    },
+    "interactive": {
+      "primary": {
+        "$type": "color",
+        "$value": "#34D399",
+        "$description": "Primary action - fresh mint green"
+      },
+      "primary.hover": {
+        "$type": "color",
+        "$value": "#6EE7B7",
+        "$description": "Primary hover - lighter mint"
+      },
+      "secondary": {
+        "$type": "color",
+        "$value": "#8B5CF6",
+        "$description": "Secondary action - lavender purple for contrast"
+      }
+    },
+    "focus": {
+      "ring": {
+        "$type": "color",
+        "$value": "#6EE7B7",
+        "$description": "Focus ring - soft mint glow"
+      }
+    },
+    "status": {
+      "success": {
+        "$type": "color",
+        "$value": "#059669",
+        "$description": "Success - deep emerald green"
+      },
+      "warning": {
+        "$type": "color",
+        "$value": "#D97706",
+        "$description": "Warning - warm amber"
+      },
+      "error": {
+        "$type": "color",
+        "$value": "#DC2626",
+        "$description": "Error - bold red"
+      },
+      "info": {
+        "$type": "color",
+        "$value": "#0891B2",
+        "$description": "Info - teal cyan"
+      }
+    }
+  },
+  "shadow": {
+    "card": {
+      "$type": "shadow",
+      "$value": "0 4px 6px -1px rgba(52, 211, 153, 0.12), 0 2px 4px -2px rgba(52, 211, 153, 0.08)",
+      "$description": "Card shadow - mint-tinted elevation"
+    },
+    "dropdown": {
+      "$type": "shadow",
+      "$value": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(52, 211, 153, 0.1)",
+      "$description": "Dropdown shadow - soft mint depth"
+    },
+    "modal": {
+      "$type": "shadow",
+      "$value": "0 20px 25px -5px rgba(0, 0, 0, 0.15), 0 8px 10px -6px rgba(52, 211, 153, 0.12)",
+      "$description": "Modal shadow - gentle mint-tinted"
+    },
+    "focus": {
+      "$type": "shadow",
+      "$value": "0 0 0 3px rgba(110, 231, 183, 0.35)",
+      "$description": "Focus glow - soft mint ring"
+    }
+  }
+}

package/tokens/themes/navy.json

@@ -0,0 +1,143 @@
+{
+  "theme": {
+    "$type": "theme",
+    "$value": "navy",
+    "$description": "Deep navy blue with gold accents - premium, authoritative, and trustworthy theme for enterprise applications"
+  },
+  "color": {
+    "text": {
+      "default": {
+        "$type": "color",
+        "$value": "#F1F5F9",
+        "$description": "Primary text on dark surfaces - near white for readability"
+      },
+      "muted": {
+        "$type": "color",
+        "$value": "#94A3B8",
+        "$description": "Secondary text - cool gray for less important content"
+      },
+      "inverted": {
+        "$type": "color",
+        "$value": "#0A1628",
+        "$description": "Text color for light surfaces - deep navy"
+      },
+      "link": {
+        "$type": "color",
+        "$value": "#FBBF24",
+        "$description": "Link text color - gold accent"
+      },
+      "link.hover": {
+        "$type": "color",
+        "$value": "#F59E0B",
+        "$description": "Link text color on hover - amber gold"
+      }
+    },
+    "surface": {
+      "default": {
+        "$type": "color",
+        "$value": "#0F172A",
+        "$description": "Default surface background - deep navy (near black)"
+      },
+      "raised": {
+        "$type": "color",
+        "$value": "#1E293B",
+        "$description": "Elevated surface background - lighter navy for cards"
+      },
+      "sunken": {
+        "$type": "color",
+        "$value": "#020617",
+        "$description": "Depressed surface background - even darker navy for inputs"
+      },
+      "overlay": {
+        "$type": "color",
+        "$value": "rgba(10, 22, 40, 0.85)",
+        "$description": "Overlay background for modals and backdrops - semi-transparent navy"
+      }
+    },
+    "border": {
+      "default": {
+        "$type": "color",
+        "$value": "#1E3A5F",
+        "$description": "Default border color - muted navy"
+      },
+      "subtle": {
+        "$type": "color",
+        "$value": "#1E293B",
+        "$description": "Subtle border for dividers - faint navy"
+      },
+      "strong": {
+        "$type": "color",
+        "$value": "#334155",
+        "$description": "Stronger border for emphasis - visible navy-gray"
+      }
+    },
+    "interactive": {
+      "primary": {
+        "$type": "color",
+        "$value": "#D4AF37",
+        "$description": "Primary interactive element color - metallic gold"
+      },
+      "primary.hover": {
+        "$type": "color",
+        "$value": "#EAC054",
+        "$description": "Primary interactive color on hover - lighter gold"
+      },
+      "secondary": {
+        "$type": "color",
+        "$value": "#475569",
+        "$description": "Secondary interactive element color - slate gray"
+      }
+    },
+    "focus": {
+      "ring": {
+        "$type": "color",
+        "$value": "#D4AF37",
+        "$description": "Focus ring outline color - gold glow"
+      }
+    },
+    "status": {
+      "success": {
+        "$type": "color",
+        "$value": "#34D399",
+        "$description": "Success state color - emerald green for dark theme"
+      },
+      "warning": {
+        "$type": "color",
+        "$value": "#FBBF24",
+        "$description": "Warning state color - amber gold"
+      },
+      "error": {
+        "$type": "color",
+        "$value": "#F87171",
+        "$description": "Error state color - soft coral red"
+      },
+      "info": {
+        "$type": "color",
+        "$value": "#60A5FA",
+        "$description": "Info state color - light blue"
+      }
+    }
+  },
+  "shadow": {
+    "card": {
+      "$type": "shadow",
+      "$value": "0 4px 6px -1px rgba(212, 175, 55, 0.15), 0 2px 4px -1px rgba(212, 175, 55, 0.1)",
+      "$description": "Card elevation shadow - gold-tinted shadow"
+    },
+    "dropdown": {
+      "$type": "shadow",
+      "$value": "0 10px 15px -3px rgba(0, 0, 0, 0.4), 0 4px 6px -2px rgba(0, 0, 0, 0.3)",
+      "$description": "Dropdown menu elevation shadow - deep shadow for dark theme"
+    },
+    "modal": {
+      "$type": "shadow",
+      "$value": "0 25px 50px -12px rgba(0, 0, 0, 0.5), 0 12px 24px -4px rgba(0, 0, 0, 0.4)",
+      "$description": "Modal dialog elevation shadow - most prominent"
+    },
+    "focus": {
+      "$type": "shadow",
+      "$value": "0 0 0 3px rgba(212, 175, 55, 0.4)",
+      "$description": "Focus ring glow shadow - gold glow ring"
+    }
+  }
+}