motion

Provide declarative animations and gesture interactions for Vue 3 and Nuxt.

1|1|Updated Feb 2, 2026
One-click install
npx skills add https://github.com/Kurrawong/prez-lite --skill motion-kurrawong
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: motion
Source: https://github.com/Kurrawong/prez-lite/tree/main/.claude/skills/motion
Command: npx skills add https://github.com/Kurrawong/prez-lite --skill motion-kurrawong

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill simplifies the process of adding sophisticated animations and interactive effects to Vue 3 and Nuxt applications, enhancing user experience without complex setups.

Core Features & Use Cases

  • Declarative Animations: Easily implement fades, slides, scales, and more using a declarative API.
  • Gesture & Scroll Animations: Create engaging interactions with hover, tap, drag gestures, and scroll-linked effects.
  • Layout Transitions: Animate elements smoothly as they enter, exit, or change position on the page.
  • Use Case: Add a subtle fade-in and slide-up effect to content sections as the user scrolls down the page, or create a button that scales up on hover.

Quick Start

Use the motion skill to animate a div element with initial and animate states.

Frequently Asked Questions about motion

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add animations to Vue 3 and Nuxt applications?

You can add animations to Vue 3 and Nuxt applications using a declarative API to implement fades, slides, and scales. This library provides hardware-accelerated animations with a minimal bundle size, integrating via pnpm add motion-v and @vueuse/nuxt.

Can I create gesture and scroll-linked animations in Vue 3?

Yes, you can create gesture and scroll-linked animations in Vue 3. The library supports engaging interactions with hover, tap, drag gestures, and scroll-linked effects to animate elements smoothly as users interact with the page.

What is the best way to animate layout transitions in a Nuxt project?

The best way to animate layout transitions in a Nuxt project is using a library that supports declarative layout transitions. This allows elements to animate smoothly as they enter, exit, or change position on the page without complex setups.

Does this Vue animation library support advanced control with composables?

Yes, the Vue animation library supports advanced control with composables. It provides a comprehensive animation library enabling hardware-accelerated animations, declarative states, and gesture interactions for Vue 3 and Nuxt.

How do I set up motion-v in a Nuxt project?

To set up motion-v in a Nuxt project, integrate it seamlessly via pnpm add motion-v and @vueuse/nuxt. This enables hardware-accelerated animations with a minimal bundle size for your Vue 3 application.