mockup-hybrid
CommunityGenerate UI mockups: Mermaid, HTML, or AI.
Authorgarimto81
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill automates the creation of UI mockups, transforming textual descriptions into visual representations like diagrams and wireframes, saving significant design and development time.
Core Features & Use Cases
- Multi-Tiered Generation: Supports Mermaid for diagrams, HTML for wireframes, and Google Stitch AI for high-fidelity mockups.
- Intelligent Routing: Automatically selects the best generation method based on keywords, context, or explicit user commands.
- Document Integration: Can scan Markdown documents to automatically generate and embed mockups for relevant sections.
- Use Case: Describe a dashboard layout, and the Skill will generate an HTML wireframe; ask for an API flow, and it will produce a Mermaid diagram.
Quick Start
Use the mockup-hybrid skill to generate a wireframe for a login screen.
Dependency Matrix
Required Modules
None requiredComponents
scriptsreferencesassets
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: mockup-hybrid Download link: https://github.com/garimto81/claude/archive/main.zip#mockup-hybrid Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.