AI Design Skills

Skill

Two focused design skills: build a landing page from intake to visual system, or turn a static design into a looping motion showcase.

by elayadesignDesign & UI Listed Jul 29, 2026

Clone or download it from github.com, then drop the folder into ~/.claude/skills/ (Claude Code) or your agent's skills directory.

Product badge

Share this product's name and rating in your README or on your website.

Updates may be delayed by image caching.

Skill pack from elayadesign/ai-design-skills.

landing-page-design: intake questions, page structure, conversion copy and a full type/spacing/motion system
design-to-motion: animates a static design into a looping showcase, exported as MP4 and GIFs
Each skill is a self-contained folder you copy into Claude Code, Cursor or Codex

Used it? Write the first review.

Skill— 39 editorial HTML/SVG diagram types for Claude Code and Codex

39 editorial HTML/SVG diagram types for Claude Code and Codex

Skill— Translate Figma into production code at 1:1 fidelity

Translate Figma into production code at 1:1 fidelity

Skill— Distinctive UI/UX implementation patterns for frontend work

Distinctive UI/UX implementation patterns for frontend work

Skill— Capture desktop, app windows, or pixel regions

Capture desktop, app windows, or pixel regions

Skill— Map Figma design components to code with Code Connect

Map Figma design components to code with Code Connect

Skill— Build Figma screens from code using design-system tokens

Build Figma screens from code using design-system tokens