NeVibeCode · 2,133 items
Skills for Design
Skills for Design: what each one does, an install command and example prompts.
wireframe-portal-title skill This skill creates an animated 3D title that breaks through a wireframe portal and changes into a second phrase. Use it for configurable HyperFrames compositions.
CX Codex +1
10,000installs
canopy-part-title skill A HyperFrames block where a canopy of leaves crosses the frame, parts, and uncovers two headlines. Useful when a title card needs motion without building the scene yourself.
CX Codex +1
10,000installs
code-slice-hero skill Animates a tiled headline flip via WebGL 2 and Canvas 2D to reveal a rear phrase. Built for 1920×1080 motion titles lasting 8 s.
CX Codex +1
10,000installs
glass-shard-title skill Turns a headline into flying glass panes: shards drift in through fog, rotate, and tile themselves into the letters. A HyperFrames block at 1920×1080, 12.16s.
CX Codex +1
10,000installs
cuboid-carousel skill A skill that renders a 3D carousel of bevelled cuboids carrying card content: they fly in from the right, ride a wave, and exit left. Useful for promo clips and title sequences.
CX Codex +1
10,000installs
kami skill A typesetting skill that builds documents from Kami templates: resumes, one-pagers, letters, portfolios, slide decks and landing pages. Useful when you want a clean PDF from a ready layout.
CX Codex +1
13,300installs
data-visualization
official skill Selects chart types based on data structure and produces Python visualization code in matplotlib, seaborn, and plotly. Useful for reports and research figures.
CX Codex +1
13,800installs
nuxt-ui skill Guides AI agents in building interfaces with @nuxt/ui v4, covering semantic Tailwind CSS theming, layout patterns, and component selection.
CX Codex +1
19,800installs
figma-implement-design
official skill This skill turns Figma nodes into application UI code while preserving layout, tokens, assets, and visual details. Use it when building components or screens from Figma.
CX Codex +1
6,700installs
bmad-agent-ux-designer skill Activates Sally, a dedicated UX designer persona for crafting interaction design and interface specifications. Helps teams map out user journeys and edge cases before coding.
CX Codex +1
11,800installs
bmad-ux skill Captures UX vision into DESIGN.md and EXPERIENCE.md documents. It structures visual identity and interaction logic without imposing arbitrary choices.
CX Codex +1
11,600installs
frontend-patterns skill A skill for React and Next.js work: component patterns, state, data fetching, and render performance. Use it when building or reviewing UI.
CX Codex +1
5,900installs
imagegen
official skill This skill creates and edits raster images such as illustrations, textures, sprites, and mockups. Use it when the output should be a bitmap asset.
CX Codex +1
5,700installs
playground
official skill Builds interactive HTML playgrounds with controls, a live preview, and a generated prompt. Use it when a topic is easier to explore visually than through plain text.
7,967installs
app-store-screenshots skill Scaffolds a Next.js and ShadCN editor where you design and export App Store and Google Play screenshots.
CX Codex +1
15,000installs
better-ui skill This skill sets concrete rules for surface details, icons, shadows, and motion. Use it to polish an interface after its underlying interactions work.
CX Codex +1
39,300installs
gpt-image-2-style-library skill Converts user ideas into production-ready GPT-Image2 prompts using the awesome-gpt-image-2 catalog. Helps configure layout, style tags, and concrete constraints.
CX Codex +1
4,000installs
frontend-slides skill Creates animation-rich HTML presentations from scratch or converts PPT/PPTX files into browser slides. Use it for talks, pitches, workshops, and internal decks.
CX Codex +1
5,500installs
web-design-engineer skill Directs your coding agent to craft polished web interfaces in HTML, CSS, JavaScript, and React. Useful for building dashboards, UI prototypes, slide decks, and animations.
CX Codex +1
8,700installs
frontend-design-direction skill Sets a product-specific direction for web UI and helps check hierarchy, content states, responsive behavior, accessibility, and rendered results.
CX Codex +1
5,300installs
liquid-glass-design skill A skill that feeds your coding agent the iOS 26 Liquid Glass patterns for SwiftUI, UIKit and WidgetKit. Useful when you're building or porting an app to iOS 26+.
CX Codex +1
5,200installs
stitch::generate-design
official skill Turns a text prompt or an image into a finished UI screen through Stitch MCP, then edits it with targeted prompts.
CX Codex +1
10,800installs
stitch::extract-design-md
official skill Extracts a complete DESIGN.md design system directly from frontend source files without building or rendering the project. Useful for styling audits and Stitch exports.
CX Codex +1
10,600installs
blender-motion-state-inspection skill Inspects Blender characters and retargeted animations using bone coordinates and scene geometry instead of guesswork from screenshots.
CX Codex +1
5,000installs
design-system skill Builds a design system out of the styles already in your repo, or audits them: tokens, a ten-point UI score, and a check for generic AI styling.
CX Codex +1
5,000installs
better-typography skill Reviews interface typography and applies fixes through the project’s styling system. Use it to check text hierarchy, wrapping, truncation and punctuation.
CX Codex +1
34,200installs
remotion-video-creation skill This skill gives coding agents Remotion guidance for React video work, from animation and audio to captions, charts, and transitions. Use it while building or editing a Remotion project.
CX Codex +1
4,900installs
stitch::manage-design-system
official skill Manages Stitch design systems through MCP tools: retrieves screen data, creates project-level tokens, and applies them to selected screens.
CX Codex +1
10,300installs
stitch::code-to-design
official skill Moves an existing frontend into Stitch by extracting standalone HTML and a design system, then uploading both to a project. Useful when bringing pages or components into Stitch for further work.
CX Codex +1
10,200installs
baseline-ui skill Cleans up AI-generated UI code by fixing layout issues, typography, spacing, and animations. Useful for a fast frontend polish pass before merging.
CX Codex +1
24,200installs
baoyu-diagram skill Builds dark-themed, standalone SVG technical diagrams, flowcharts, and mind maps directly inside your AI coding session.
CX Codex +1
15,400installs
brand-landingpage skill This skill interviews you about the product and its visual direction, then builds a landing page through Stitch. Use it when there’s no established design yet.
CX Codex
39,476installs
stitch::upload-to-stitch
official skill Uploads local images, mockups, extracted HTML, and design markdown to a Stitch project over HTTP, bypassing MCP base64 token limits.
CX Codex +1
9,900installs
stitch::extract-static-html
official skill This skill saves a rendered app page as a standalone HTML file with CSS and images embedded. Use it to share a static view or prepare a page for Stitch.
CX Codex +1
10,000installs
motion-advanced skill Advanced gesture and animation patterns for React and Next.js. Guides your coding agent through drag-and-drop, SVG drawing, and imperative useAnimate sequences.
CX Codex +1
4,600installs
manim-video skill Builds technical explainers in Manim for graphs, system diagrams, and product walkthroughs. Use it when motion should clarify the idea instead of a talking-head script.
CX Codex +1
4,700installs
make-interfaces-feel-better skill This skill helps review and refine interface details such as spacing, typography, interaction states, and motion. Use it when a component feels unfinished or visually off.
CX Codex +1
4,700installs
motion-patterns skill A skill with reusable animation patterns for React and Next.js. Use it for buttons, modals, toast notifications, page transitions, scroll reveals, and layout changes.
CX Codex +1
4,700installs
better-colors skill Audits color systems, generates ramps, and maps semantic tokens to roles. Use it when hardcoded hex values pile up or text contrast needs verifiable measurement.
CX Codex +1
32,600installs
ppt-generation skill Creates PPTX presentations by generating slide visuals and assembling them into PowerPoint decks. Useful when you need a consistent visual deck from a text prompt.
CX Codex +1
5,200installs
81–120 of 2,133
