Inspira Ui
Generates diverse UI mockups and style guides based on textual descriptions, accelerating design exploration.
Install on your platform
We auto-selected Claude Code based on this skill’s supported platforms.
Run in terminal (recommended)
claude mcp add inspira-ui npx -- -y @trustedskills/inspira-ui
Or manually add to ~/.claude/settings.json
{
"mcpServers": {
"inspira-ui": {
"command": "npx",
"args": [
"-y",
"@trustedskills/inspira-ui"
]
}
}
}Requires Claude Code (claude CLI). Run claude --version to verify your install.
About This Skill
What it does
Inspira UI provides a collection of over 120 reusable, animated components designed for Vue 3 and Nuxt 4 projects. It's not a traditional npm library but rather a set of copy-pasteable components built with TailwindCSS v4, motion-v, GSAP, and Three.js to help developers build beautiful applications faster. The skill offers full TypeScript support using the Vue 3 Composition API.
When to use it
- Building animated landing pages with hero sections and effects.
- Creating modern web applications requiring 3D visualizations or interactive elements.
- Developing marketing sites needing eye-catching backgrounds and text animations.
- Constructing portfolio sites with image galleries, carousels, and showcase effects.
- Designing interactive experiences featuring custom cursors, special effects, or particle systems.
Key capabilities
- 120+ reusable, animated components (copy-paste format).
- Full TypeScript support with Vue 3 Composition API.
- Built using TailwindCSS v4 and OkLch color space.
- Responsive and mobile-optimized design.
- Includes optional dependencies for 3D and WebGL components (Three.js, ogl).
Example prompts
Here are some example prompts you could give an AI agent with the Inspira UI skill installed:
- "Generate a Vue component for an animated hero section using Inspira UI."
- "Show me examples of how to use Inspira UI's image gallery components in Nuxt 4."
- "How can I implement a custom cursor effect using Inspira UI?"
Tips & gotchas
- Dependencies: You’ll need to install core dependencies like
clsx,tailwind-merge,@vueuse/coreand potentially Three.js or ogl depending on the components you want to use. - Not an npm library: Inspira UI is a collection of copy-pasteable components, not a standard package that can be installed via npm.
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.