5 — Design skill for Claude Code
Build a production-ready, responsive landing page using React, Tailwind CSS v4, and Vite.
How to install 5
Installs to ~/.claude/skills/nomaan5541-motionsites-prompt-collection-5/SKILL.md
mkdir -p ~/.claude/skills/nomaan5541-motionsites-prompt-collection-5 && curl -fsSL https://raw.githubusercontent.com/nomaan5541/motionsites-prompt-collection/HEAD/prompts/5.md -o ~/.claude/skills/nomaan5541-motionsites-prompt-collection-5/SKILL.md Restart Claude Code, or start a new session, for it to be picked up.
What 5 does
Build a production-ready, responsive landing page using React, Tailwind CSS v4, and Vite. The design should feature a high-end, dark-mode "glassmorphism" aesthetic with specific purple/pink gradients.
- Tech Stack & Libraries: Use hls.js for video streaming. Use motion/react (formerly Framer Motion) for animations. Use react-use-measure for sizing logic. Use clsx and tailwind-merge for class management. Use lucide-react for standard icons (if needed), but I will provide custom SVG paths for sp
Alternatives in Design
- Frontend Design — Create distinctive, production-grade frontend interfaces with high design quality 94.1k ★
- Figma Implement Design — Translate Figma designs into production-ready code with pixel-perfect accuracy 14.6k ★
- App Onboarding Questionnaire — A Claude Code skill that designs and builds high-converting questionnaire-style app onboarding flows — modelle 751 ★
Full documentation available on GitHub
View Source RepositoryRelated Skills
Modern UI Builder
Builds production-ready UI components with React/Vue + Tailwind CSS + Shadcn/UI. Invoke when user needs modern
Claude Artisan
A Claude skill that generates production-ready UI components in 224 distinct design styles — from Bauhaus to B
2
Build a high-fidelity, responsive, dark-themed hero section for a SaaS product called "Taskora" using React, T
6
Build a high-end, responsive Hero Section for a personal portfolio website using React and Tailwind CSS. The d
Design Screen
Design one screen end to end — layout, type, color, responsive, dark mode, interaction states, inclusive pass,
Anti Slop Designer
Use when a UI looks machine-made rather than decided. Violet gradients, glassmorphism everywhere, identical ca
Related Agents
Pixel
Frontend specialist. Invoke for any UI work: React components, TypeScript, CSS/Tailwind, Next.js, Vite, routin
Frontend Engineer
Frontend implementation specialist for UI components, React patterns, CSS styling. Use proactively when task i
UX Architect
Technical UX architect for CSS design systems, responsive layout frameworks, information architecture, and imp