Packs
4 packs@owl-listener
Design Systems
Design system skills: component specs, design tokens, naming conventions, spacing and grid systems, accessibility standards, and documentation.
11 skills · pack
curated
Ship Brand Design Guide
Generate a brand design guide including color palette, typography, UI components, and mockups.
5 skills · pack
curated
Create Design System Documentation
Generate component specifications, pattern library entries, and design system documentation for UI consistency.
8 skills · pack
curated
Build Accessible React UI
Install this pack to build an accessible, performant React UI component from design to audit.
4 skills · pack
Results for “component-design”
9 skills
openai figma-code-connect-components
Connects Figma design components to their code implementations using Figma's Code Connect feature, analyzing design structure and scanning codebases for matching components.
23.3k · bundle
openai figma-generate-design
Translates application pages, views, or multi-section layouts into Figma screens by reusing design system components, variables, and styles.
23.3k · bundle
chimeranext figma
Integrates Figma Dev Mode via MCP to extract assets, components, styles, and design tokens, converting designs to code with high fidelity.
4
openai figma-use
Execute JavaScript in Figma files via the Plugin API to create, edit, and inspect design nodes, variables, and components.
23.3k · bundle
More results
heygen figma
Import Figma designs into HyperFrames compositions as frozen assets, brand tokens, components, motion animations, and shaders.
· bundle
joshuashepherd figma-prompt
Generates a complete Figma Make prompt package with context primer, checkpoint, build prompts, and iteration templates for designing UI pages, components, or screens.
1
pwdev-solucoes figma
Translates between Figma designs and Vue 3 + shadcn-vue code, mapping Auto Layout to Tailwind, extracting design tokens, and pushing components back to Figma via MCP.
2
pwdev-solucoes brand-kit
Extrai tokens de cor, tipografia, grid, logo e componentes do Figma e grava na seção 3 do contexto, marcando itens inferidos quando não há acesso ao Figma.
2
pwdev-solucoes carousel-builder
Monta carrosséis completos para Instagram, LinkedIn e Facebook, estruturando slides, definindo hierarquia e construindo no Figma como componente com variantes, com revisão e texto alternativo.
2