inspira-ui
Inspira UI provides over 120 copy-paste animated components designed for Vue 3 and Nuxt 4 projects. Built with TailwindCSS v4, motion-v, GSAP, and Three.js, it covers hero sections, 3D effects, text animations, interactive cursors, and particle systems—all production-tested and MIT-licensed.
Inspira UI delivers 120+ pre-built animated components for Vue and Nuxt applications.
AI-generated summary based on this skill's SKILL.md
Decision gist · record as of 2026-07-25
Inspira UI delivers 120+ pre-built animated components for Vue and Nuxt applications. Inspira UI provides over 120 copy-paste animated components designed for Vue 3 and Nuxt 4 projects. Built with TailwindCSS v4, motion-v, GSAP, and Three.js, it covers hero sections, 3D effects, text animations, interactive cursors, and particle systems—all production-tested and MIT-licensed.
Use it when
- Yes.
- Inspira UI integrates Three.js and GSAP for 3D effects and particle animations in Vue applications.
Verify before relying
Read SKILL.md below before installing (7 files). Open directory: indexed for reading, not audited.
Similar skills
Install
secondsky/claude-skills/inspira-ui · repository language: TypeScript
Open directory. Skills are indexed for reading, not audited. Review a skill's body before installing it.
Frequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
What is inspira-ui and what components does it offer?
Inspira UI provides over 120 copy-paste animated components designed for Vue 3 and Nuxt 4 projects. Built with TailwindCSS v4, motion-v, GSAP, and Three.js, it covers hero sections, 3D effects, text animations, interactive cursors, and particle systems—all production-tested and MIT-licensed.
Can I use inspira-ui as a vue animated components library?
Yes. Inspira UI is a comprehensive animated components library for Vue 3 and Nuxt 4. It provides pre-built, copy-paste components including hero sections, shimmer buttons, morphing text, particle effects, and interactive backgrounds—ready for modern web projects without additional setup.
How do I set up 3D effects and particle animations in Vue?
Inspira UI integrates Three.js and GSAP for 3D effects and particle animations in Vue applications. The library includes pre-built components for 3D globes, icon clouds, aurora backgrounds, and particle systems. All components are copy-paste ready with TailwindCSS v4 styling included.
How do I resolve TailwindCSS v4 and motion-v integration errors?
Inspira UI handles TailwindCSS v4 and motion-v integration out of the box. All 120+ components are built and tested with both frameworks, eliminating common compatibility issues. Simply copy the components into your project and they work immediately with your existing TailwindCSS v4 setup.
What animated effects can I build for landing pages with inspira-ui?
Inspira UI provides production-ready components for animated landing pages including hero sections with parallax effects, neon border buttons, shimmer effects, morphing text animations, fluid cursors, confetti effects, and aurora backgrounds—all designed to create engaging, interactive landing page experiences.
Does inspira-ui support WebGL cursors and interactive backgrounds?
Yes. Inspira UI includes components for fluid WebGL cursors and interactive background animations. These effects are built with Three.js and GSAP, providing smooth, performant interactions for modern web applications while maintaining compatibility with Vue 3 and Nuxt 4.
SKILL.md
Rendered from the published skill. Quoted content, verbatim.
Inspira UI - Animated Vue/Nuxt Component Library
Inspira UI is a collection of 120+ reusable, animated components powered by TailwindCSS v4, motion-v, GSAP, and Three.js — crafted to help ship beautiful Vue and Nuxt applications faster.
Table of Contents
(truncated - see the full file via the links below)
File tree — 7 files
plugins/inspira-ui/skills/inspira-ui/SKILL.md
plugins/inspira-ui/skills/inspira-ui/references/CODE_PATTERNS.md
plugins/inspira-ui/skills/inspira-ui/references/SETUP.md
plugins/inspira-ui/skills/inspira-ui/references/TROUBLESHOOTING.md
plugins/inspira-ui/skills/inspira-ui/references/components-list.md
plugins/inspira-ui/skills/inspira-ui/scripts/setup-inspira.sh
plugins/inspira-ui/skills/inspira-ui/scripts/verify-setup.sh
Let your AI agent find skills like this
Example. Real query, live index.
You found this page by searching. An agent finds it by wishing: SkillFed indexes 56,283 agent skills by what they can do, searchable in plain language.
wish › “Find pre-built animated Vue/Nuxt components for modern web projects”
Give your agent the search over MCP, or paste the wish link into any chat. No install? Search from any chat →
Related skills
Master Nuxt 4 production patterns for server-side rendering, from resolving hydration conflicts to deploying across major platforms. This skill covers performance optimization, Vitest testing strategies, and migration guidance from Nuxt 3, with practical solutions for common SSR pitfalls.
Aceternity UI is a production-ready component library offering 100+ animated, interactive React elements designed for Next.js applications. Built with Tailwind CSS and Framer Motion, it includes hero sections, parallax effects, 3D cards, and background animations—all installable via shadcn CLI with full source code access for customization.
Get framework-specific Tailwind CSS setup instructions covering React with Vite, Next.js App Router, Vue 3, Nuxt, SvelteKit, and Astro. Includes configuration files, dark mode setup, and reusable component patterns for each framework.
Get a battle-tested foundation for React projects using Tailwind v4 and shadcn/ui, complete with dark mode, semantic color tokens, and Vite integration. This skill covers the four-step CSS architecture, theme switching, and solutions to common v4 migration issues—all designed to eliminate setup errors and cut configuration time dramatically.
Tailwind Design System is a framework for constructing scalable design systems using Tailwind CSS v4's CSS-first configuration, semantic tokens, and component architecture. It covers design token hierarchies, dark mode setup with native CSS features, and patterns for building reusable components with variants and accessibility built in.
HeroUI v3 is a React component library built on Tailwind CSS v4 and React Aria, offering accessible, composable UI elements like Buttons, Modals, Forms, and Cards. It uses compound components (dot-notation subcomponents), semantic variants for intent-driven styling, and CSS variable theming with oklch color space—no provider required. Always fetch component docs before implementing to access complete examples and API references.