envy-7z/figma-to-flutter-widget
skills/figma-to-flutter-widget/SKILL.md
Convert Figma specs into Flutter widgets. Use when implementing new UI from Figma and the project has an existing design system.
content-media
Updated Apr 5, 2026
$ install --global
skillsauthnpx skillsauth add envy-7z/mobile-agent-skillpack figma-to-flutter-widgetInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 5, 2026, 2:00 AM8.1s1 file scanned
SKILL.md
- name:
- figma-to-flutter-widget
- description:
- Convert Figma specs into Flutter widgets. Use when implementing new UI from Figma and the project has an existing design system.
Figma → Flutter Widget
Rules
- Match spacing, typography, colors, and layout to Figma.
- Reuse existing components/styles/constants whenever possible.
- Do NOT introduce new architecture/state management unless asked.
- Include states: loading/empty/error if relevant.
Workflow
- Read Figma spec (sizes, spacing, colors, typography).
- Identify existing design tokens/components to reuse.
- Implement widgets with minimal, clean structure.
- If interactions needed, follow existing patterns (BLoC/Cubit, etc.).
- Provide verification notes (what to check visually).
Output format
- Implementation notes
- Files created/updated
- Visual checklist for QA
Related Skills
envy-7z/writing-plans
development
VerifiedTrustedCommunity
Use when you have a spec or requirements for a multi-step task, before touching code
SKILL.mdUpdated Apr 5, 2026
envy-7z/verification-before-completion
data-ai
VerifiedTrustedCommunity
Use when about to claim work is complete, fixed, or passing, before committing or creating PRs - requires running verification commands and confirming output before making any success claims; evidence before assertions always
SKILL.mdUpdated Apr 5, 2026
envy-7z/using-git-worktrees
tools
VerifiedTrustedCommunity
Use when starting feature work that needs isolation from current workspace or before executing implementation plans - creates isolated git worktrees with smart directory selection and safety verification
SKILL.mdUpdated Apr 5, 2026
envy-7z/thinkies
testing
VerifiedTrustedCommunity
Applies Kent Beck's Thinkies—pattern-based thinking habits that generate ideas. Use when stuck, exploring alternatives, or reframing decisions.
SKILL.mdUpdated Apr 5, 2026