Figma Generate Component
Helps with code generation, components as part of agent workflows workflows.
Install on your platform
We auto-selected Claude Code based on this skill’s supported platforms.
Run in terminal (recommended)
claude mcp add figma-generate-component npx -- -y @trustedskills/figma-generate-component
Or manually add to ~/.claude/settings.json
{
"mcpServers": {
"figma-generate-component": {
"command": "npx",
"args": [
"-y",
"@trustedskills/figma-generate-component"
]
}
}
}Requires Claude Code (claude CLI). Run claude --version to verify your install.
About This Skill
What it does
This skill allows AI agents to generate Figma components based on user instructions. It can create new components with specific properties and styles, streamlining design workflows and promoting consistency within a project. The generated components are directly usable within Figma files, saving designers time and effort.
When to use it
- Creating reusable UI elements for a website or application.
- Generating component libraries from existing designs.
- Quickly prototyping new design ideas with consistent styling.
- Automating the creation of multiple similar components (e.g., buttons, form fields).
Key capabilities
- Generates Figma components.
- Creates components based on user instructions.
- Integrates directly into Figma files.
Example prompts
- "Create a button component with rounded corners and a blue background."
- "Generate a text input field component with a placeholder 'Enter your email'."
- “Make a card component with an image, title, and description.”
Tips & gotchas
The skill's effectiveness depends on the clarity and detail of the user’s instructions. Providing specific details about desired properties (e.g., colors, sizes, fonts) will yield better results.
Tags
TrustedSkills Verification
Unlike other registries that point to live repositories, TrustedSkills pins every skill to a verified commit hash. This protects you from malicious updates — what you install today is exactly what was reviewed and verified.
Security Audits
| Gen Agent Trust Hub | Pass |
| Socket | Pass |
| Snyk | Pass |
🌐 Community
Passed automated security scans.