#1
Install
npx skills add songsummer920-dazzle/three-scope-map-skillMotion, UI systems, and visual production
Design agent skill pack
A curated pack for agents that turn product direction into motion assets, design-system notes, UI components, interactive maps, and polished creative workflows.
Designers, design engineers, and frontend teams using agents for visual production work.
10
Skills
4
Steps
152
Top stars
Workflow
How the pack gets used
- 01
Extract
Turn public references, UI surfaces, or SVG assets into agent-readable design context.
- 02
Animate
Generate Lottie, GSAP, SVG, or scroll-motion directions with editable output paths.
- 03
Compose
Pick UI blocks, shadcn components, and layout primitives that match the product system.
- 04
Verify
Review license, install command, browser output, responsive states, and production risks.
Best for
- Motion design
- Design-system extraction
- Shadcn/ui page generation
- Interactive data visuals
Avoid when
- The source assets are private and unavailable
- The output will ship without human visual review
- The license blocks the intended commercial use
Recommended skills
Installable shortlist for this pack
#2
Official AI skills for GSAP. These skills teach AI coding agents how to correctly use GSAP (GreenSock Animation Platform), including best practices, common animation patterns, and plugin usage.
9.7K starsSafe to tryMIT
Install
npx skills add greensock/gsap-skills#3
Generate production-ready Lottie animations with Claude Code or Codex
3.6K starsSafe to tryMIT
Install
npx skills add diffusionstudio/lottie#4
Give Claude Code expert knowledge of 2,500+ shadcn/ui blocks and components. This skill lets Claude intelligently select, install, and compose pre-built UI sections — from landing pages to dashboards to ecommerce flows — so you describe what you want and it picks the right pieces.
17 starsNeeds reviewMIT
Install
npx skills add masonjames/shadcnblocks-skill#5
Convert any official website to design.md document
236 starsNeeds reviewUnknown
Install
npx skills add Paidax01/web-to-design-md#6
An open-source UI component library for building high-quality, accessible design systems and web apps for Vue. Previously Radix Vue
6.6K starsSafe to tryMIT
Install
npx skills add unovue/reka-ui#7
The Cursor for Designers • An Open-Source AI-First Design tool • Visually build, style, and edit your React App with AI
26K starsSafe to tryApache-2.0
Install
npx skills add onlook-dev/onlook#8
Beautiful & consistent icon toolkit made by the community. Open-source project and a fork of Feather Icons.
23K starsSafe to tryUnknown
Install
npx skills add lucide-icons/lucide#9
Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
98K starsSafe to tryMIT
Install
npx skills add mui/material-ui#10
🌼 🌼 🌼 🌼 🌼 The most popular, free and open-source Tailwind CSS component library
41K starsSafe to tryMIT
Install
npx skills add saadeghi/daisyui