omgkit 2.31.0 → 2.32.0

package/README.md

@@ -41,7 +41,7 @@ All coordinated through **Omega-level thinking** - a framework for finding break
 | **Workflows** | 69 | Complete development processes from idea to deploy |
 | **Skills** | 162 | Domain expertise modules across 24 categories |
 | **Modes** | 10 | Behavioral configurations for different contexts |
-| **Themes** | 31 | Curated design system themes (V1 + V2 schemas) |
+| **Themes** | 30 | Curated design system themes (V2 schema with color scales) |
 | **Archetypes** | 14 | Project templates for autonomous development |
 
 ---
@@ -166,38 +166,36 @@ testing:
       target: 85
 ```
 
-### 6. Design System (Enhanced in 2.30.0)
+### 6. Design System
 
-OMGKIT includes a complete design system with 31 curated themes for shadcn/ui integration. Now supports both **V1** (flat colors) and **V2** (color scales, effects, animations) theme schemas.
+OMGKIT includes a complete design system with **30 curated V2 themes** for shadcn/ui integration. All themes use the V2 schema with 12-step color scales, effects, and animations.
 
 ```bash
 # Initialize with a theme (opt-in)
 omgkit init --theme neo-tokyo
 
-# Or use a V2 theme with advanced features
-omgkit init --theme electric-cyan-v2
-
 # Or explore themes first
 omgkit init --with-design
 ```
 
-#### Theme Schema Versions
+#### V2 Theme Features
+
+All 30 themes include:
 
-| Feature | V1 | V2 |
-|---------|----|----|
-| Flat colors | ✓ | ✓ |
-| 12-step color scales | - | ✓ |
-| $ref token references | - | ✓ |
-| Status colors (success/warning/info) | - | ✓ |
-| Effects (glass, glow, gradient) | - | ✓ |
-| Animations (keyframes) | - | ✓ |
-| Alpha variants | - | ✓ |
+| Feature | Description |
+|---------|-------------|
+| 12-step color scales | `--primary-1` through `--primary-12` |
+| Alpha variants | `--primary-a1` through `--primary-a12` |
+| Status colors | `--success`, `--warning`, `--info`, `--destructive` |
+| Effects | glassMorphism, glow, gradients |
+| Animations | shimmer, pulse-glow, fade-in, slide-up |
+| Backward compatibility | Includes flat `colors` block for legacy support |
 
 #### 5 Theme Categories
 
 | Category | Themes | Description |
 |----------|--------|-------------|
-| **Tech & AI** | neo-tokyo, electric-cyan, electric-cyan-v2, neural-dark, matrix-green, quantum-purple, hologram | Futuristic, cyberpunk-inspired |
+| **Tech & AI** | neo-tokyo, electric-cyan, neural-dark, matrix-green, quantum-purple, hologram | Futuristic, cyberpunk-inspired |
 | **Minimal & Clean** | minimal-slate, paper, mono, zen, nordic, swiss | Simple, elegant, distraction-free |
 | **Corporate** | ocean-blue, corporate-indigo, finance, legal, healthcare, consulting | Professional, trustworthy |
 | **Creative & Bold** | coral-sunset, candy, neon, gradient-dream, retro, studio | Vibrant, expressive |
@@ -207,7 +205,7 @@ omgkit init --with-design
 
 | Command | Description |
 |---------|-------------|
-| `/design:themes` | List all 31 curated themes |
+| `/design:themes` | List all 30 curated themes |
 | `/design:theme <id>` | Apply a theme to your project |
 | `/design:preview` | Preview current theme colors |
 | `/design:builder` | Build custom theme interactively |
@@ -221,7 +219,7 @@ omgkit init --with-design
 | `/design:export <format>` | Export to CSS, SCSS, Tailwind, Figma, Style Dictionary |
 | `/design:validate` | Validate theme structure |
 
-#### Theme Export (New in 2.30.0)
+#### Theme Export
 
 Export your theme to various design tools and framework formats:
 
@@ -246,9 +244,6 @@ Rebuild your entire project's UI with a single command:
 # Rebuild with new theme (scans and fixes hardcoded colors)
 omgkit design:rebuild neo-tokyo
 
-# Use V2 theme for advanced features
-omgkit design:rebuild electric-cyan-v2
-
 # Scan for non-compliant colors
 omgkit design:scan
 
@@ -261,16 +256,14 @@ The rebuild feature:
 - Scans `app/`, `components/`, `src/`, `pages/` directories
 - Replaces hardcoded colors (`bg-blue-500`) with theme variables (`bg-primary`)
 - Reports unfixable patterns for manual review
-- V2 themes generate 12-step color scales and status colors
-
-#### V2 Theme Features
+- Generates 12-step color scales and status colors
 
-V2 themes provide additional CSS variables:
+#### Generated CSS Variables
 
 ```css
 /* 12-step color scales */
---cyan-1 through --cyan-12
---cyan-a1 through --cyan-a12  /* Alpha variants */
+--rose-1 through --rose-12
+--rose-a1 through --rose-a12  /* Alpha variants */
 
 /* Status colors */
 --success, --warning, --info
@@ -288,7 +281,7 @@ V2 themes provide additional CSS variables:
 OMGKIT provides CSS variables that shadcn/ui components consume:
 
 ```
-.omgkit/design/theme.json  →  Theme configuration
+.omgkit/design/theme.json  →  Theme configuration (V2)
 .omgkit/design/theme.css   →  CSS variables (:root + .dark)
 ```
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "omgkit",
-  "version": "2.31.0",
+  "version": "2.32.0",
   "description": "Omega-Level Development Kit - AI Team System for Claude Code. 41 agents, 174 commands, 162 skills, 69 workflows.",
   "keywords": [
     "claude-code",

package/templates/design/themes/corporate-enterprise/consulting.json

@@ -1,8 +1,464 @@
 {
+  "version": "2.0",
   "name": "Consulting",
   "id": "consulting",
   "category": "corporate-enterprise",
-  "description": "Management consulting aesthetic like McKinsey and BCG",
+  "description": "Management consulting aesthetic like McKinsey and BCG - featuring 12-step color scales, effects, and animations",
+  "colorSystem": {
+    "type": "radix",
+    "version": "3.0"
+  },
+  "scales": {
+    "primary": {
+      "name": "sky",
+      "hue": 222,
+      "saturation": {
+        "light": {
+          "low": 50,
+          "high": 85
+        },
+        "dark": {
+          "low": 40,
+          "high": 80
+        }
+      },
+      "steps": {
+        "light": {
+          "1": "222 50% 99%",
+          "2": "222 55% 97%",
+          "3": "222 60% 93%",
+          "4": "222 65% 88%",
+          "5": "222 70% 82%",
+          "6": "222 75% 74%",
+          "7": "222 80% 62%",
+          "8": "222 75% 50%",
+          "9": "222 85% 45%",
+          "10": "222 85% 40%",
+          "11": "222 85% 32%",
+          "12": "222 90% 18%"
+        },
+        "dark": {
+          "1": "222 40% 7%",
+          "2": "222 45% 10%",
+          "3": "222 50% 14%",
+          "4": "222 55% 18%",
+          "5": "222 60% 22%",
+          "6": "222 65% 28%",
+          "7": "222 70% 35%",
+          "8": "222 60% 42%",
+          "9": "222 80% 45%",
+          "10": "222 75% 52%",
+          "11": "222 65% 65%",
+          "12": "222 55% 80%"
+        }
+      },
+      "alpha": {
+        "light": {
+          "1": "222 80% 45% / 0.05",
+          "2": "222 80% 45% / 0.1",
+          "3": "222 80% 45% / 0.15",
+          "4": "222 80% 45% / 0.2",
+          "5": "222 80% 45% / 0.3",
+          "6": "222 80% 45% / 0.4",
+          "7": "222 80% 45% / 0.5",
+          "8": "222 80% 45% / 0.6",
+          "9": "222 80% 45% / 0.7",
+          "10": "222 80% 45% / 0.8",
+          "11": "222 80% 45% / 0.9",
+          "12": "222 80% 45% / 0.95"
+        },
+        "dark": {
+          "1": "222 80% 50% / 0.05",
+          "2": "222 80% 50% / 0.1",
+          "3": "222 80% 50% / 0.15",
+          "4": "222 80% 50% / 0.2",
+          "5": "222 80% 50% / 0.3",
+          "6": "222 80% 50% / 0.4",
+          "7": "222 80% 50% / 0.5",
+          "8": "222 80% 50% / 0.6",
+          "9": "222 80% 50% / 0.7",
+          "10": "222 80% 50% / 0.8",
+          "11": "222 80% 50% / 0.9",
+          "12": "222 80% 50% / 0.95"
+        }
+      }
+    },
+    "neutral": {
+      "name": "slate",
+      "hue": 222,
+      "steps": {
+        "light": {
+          "1": "212 40% 99%",
+          "2": "212 40% 98%",
+          "3": "212 35% 96%",
+          "4": "212 30% 94%",
+          "5": "212 25% 91%",
+          "6": "212 20% 86%",
+          "7": "212 18% 78%",
+          "8": "212 16% 65%",
+          "9": "212 14% 50%",
+          "10": "212 12% 40%",
+          "11": "222 47% 11%",
+          "12": "222 84% 5%"
+        },
+        "dark": {
+          "1": "222 84% 5%",
+          "2": "222 50% 8%",
+          "3": "217 33% 17%",
+          "4": "217 30% 22%",
+          "5": "217 28% 28%",
+          "6": "217 26% 35%",
+          "7": "217 22% 45%",
+          "8": "217 20% 55%",
+          "9": "215 20% 65%",
+          "10": "215 18% 75%",
+          "11": "212 35% 88%",
+          "12": "212 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": "222 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.375rem",
+    "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(222 80% 45% / 0.3)"
+        },
+        "50%": {
+          "boxShadow": "0 0 40px hsl(222 80% 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": "0 0% 100%",