experience-lwc-design-generate - Create LWC Components from Design
Creates a new Lightning Web Component from a Figma design, PRD, Aura source, or textual specification through requirements, coding, optimization, validation, and testing phases.
Tags
Updated: 2026-09-30Capabilities
Typical Inputs
Typical Outputs
What this skill does
- Collect and consolidate requirements
- Generate LWC bundle
- Apply optimization fixes
- Run lint and format checks
- Compile-check component code
- Create Jest accessibility tests
- Validate accessibility security and RTL
Inputs
- Figma URL
- Figma frame screenshot
- Figma metadata export
- PRD markdown
- Aura component source
- Textual component specification
- Target module path
- Salesforce org access
Outputs
- Consolidated PRD file
- LWC component bundle
- Validated component code
- Jest test suite
- Updated workspace files
Requirements
- ESLint 8 or later
- Prettier 2 or later
- Python 3.8 or later
- Salesforce org access for data-backed components