Design Ui
Helps with design, UI 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 design-ui npx -- -y @trustedskills/design-ui
Or manually add to ~/.claude/settings.json
{
"mcpServers": {
"design-ui": {
"command": "npx",
"args": [
"-y",
"@trustedskills/design-ui"
]
}
}
}Requires Claude Code (claude CLI). Run claude --version to verify your install.
About This Skill
What it does
This skill, "Design UI," assists AI agents in creating user interfaces by guiding them through specific design tracks. It offers distinct paths for Product UI (suitable for SaaS applications, admin panels, and data-heavy interfaces) and Marketing/Brand/Creative UI. The skill leverages related reference documents to support the design process, including low-fi planning techniques and aesthetic direction calibration.
When to use it
- When designing a user interface for a SaaS product or administrative dashboard.
- For creating marketing landing pages or other brand-focused visual assets.
- To ensure consistent aesthetic quality in UI designs.
- During the initial low-fidelity planning stages of a design project.
Key capabilities
- Provides distinct design tracks for Product UI and Marketing/Brand/Creative UI.
- Offers guidance based on pre-defined methodologies within each track.
- References supporting documents like
design-in-code.md(low-fi planning) andaesthetic-direction.md.
Example prompts
- "Design a Product UI for an admin panel."
- "Create a Marketing UI for a new product launch."
- "Guide me through the low-fi planning stage of this design project."
Tips & gotchas
- The skill offers separate tracks; choose the one that best aligns with your specific design needs (Product vs. Marketing/Brand).
- Refer to the linked reference documents (
design-in-code.md,aesthetic-direction.md) for additional context and guidance.
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.