What problem does it solve? AI-generated websites often look generic—Inter fonts, purple gradients, centered layouts, and plain backgrounds. This Skill turns plain-text requirements into distinctive, production-ready static websites with a deliberate anti-generic design philosophy, mobile-first responsive patterns, and ready-to-run project scaffolding. ## Core Features & Use Cases - Anti-generic design system: Enforces unique typography, contextual color palettes, asymmetric layouts, coordinated animations, and atmospheric backgrounds instead of default AI design tropes. - Two build workflows: Scaffold projects with Vite for pure static output (including single-file HTML bundling) or Next.js for Vercel deployment, both preconfigured with React 18, TypeScript, Tailwind, shadcn/ui, and Framer Motion. - Mobile-first responsive patterns: Provides battle-tested CSS fixes for hero sections, grids, forms, navigation, and touch targets across breakpoints. - Use Case: Describe a SaaS landing page with a dark editorial theme, hero animation, pricing table, and FAQ accordion, and receive a complete Next.js or Vite project with shadcn/ui components and a centralized site configuration file. ## Quick Start Ask the assistant to build a landing page for your product using this skill, describing the theme, sections, and style you want, then run the generated init script and start the dev server with npm run dev.
