Figma
A comprehensive skill catalog for AI agents
npx -y skills add G1Joshi/Agent-Skills --skill figmaAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 10 stars10 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
What its author says it does
Copied from the file, not written here
Figma collaborative design tool. Use for UI/UX design.
SKILL.md
1.1 KB, as published. Nobody here has run it
Figma
Figma is the interface design tool. 2025 brings Generative UI (Text to Design) and Dev Mode enhancements for accurate CSS/SwiftUI generation.
When to Use
- UI/UX Design: Creating high-fidelity mocks.
- Prototyping: Clickable user flows for user testing.
- Handoff: Developers inspect CSS/variables directly.
Core Concepts
Auto Layout
Flexbox for designers. Elements resize/reflow automatically.
Components / Variants
Reusable UI elements (Buttons) with states (Hover, Active).
Dev Mode
A dedicated view for engineers to grab variables, measurement, and code snippets without breaking the design.
Best Practices (2025)
Do:
- Use Variables: Define colors/spacing as variables (Design Tokens).
- Use Auto Layout: Always. It ensures the design can be implemented in CSS.
- Name Layers: "Frame 1342" is helpful to no one.
Don't:
- Don't detach instances: Keep components linked to the library.