aceternity-ui

Provide animated React components for Next.js applications with Tailwind CSS and Framer Motion.

204|30|Updated Nov 8, 2025
One-click install
npx skills add https://github.com/secondsky/claude-skills --skill aceternity-ui
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: aceternity-ui
Source: https://github.com/secondsky/claude-skills/tree/main/plugins/aceternity-ui/skills/aceternity-ui
Command: npx skills add https://github.com/secondsky/claude-skills --skill aceternity-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Aceternity UI offers 100+ animated React components for Next.js, Tailwind, and Framer Motion, enabling fast, premium UI with full TypeScript support.

Core Features & Use Cases

  • Rich components: 100+ animated UI primitives and patterns.
  • Next.js 13+ support: App Router ready with TS and Tailwind.
  • Theming & polish: Dark mode, accessible defaults, and polished visuals.

Quick Start

Install Aceternity UI components via shadcn registry, then implement animated hero sections and data-driven UI using the provided components.

Frequently Asked Questions about aceternity-ui

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

FAQPage Schema
How do I add animated UI components to a Next.js project with Tailwind CSS?

Aceternity UI provides 100+ production-ready animated React components installable via shadcn registry for Next.js 13+ App Router projects. Components include TypeScript support, Tailwind CSS v3+ styling, Framer Motion animations, and dark mode compatibility out of the box.

Can I use Aceternity UI components with Next.js and Framer Motion?

Yes. Aceternity UI is built specifically for Next.js 13+ with full Framer Motion integration for animations. Components ship with complete source code access, TypeScript definitions, and work seamlessly with your existing Tailwind and Framer Motion setup.

What animated UI patterns does Aceternity UI support?

Aceternity UI includes animated hero sections, landing page components, parallax effects, 3D interactions, and data-driven UI patterns. All 100+ components are production-ready and optimized for Next.js applications using Tailwind CSS.

How do I install Aceternity UI components in my Next.js app?

Install components via shadcn CLI registry integration. Each component includes full source code, TypeScript support, and Tailwind styling. No external dependencies required—components work directly in Next.js 13+ projects with App Router.

Does Aceternity UI support dark mode and accessibility?

Yes. Aceternity UI components include dark mode theming, accessible defaults, and polished visuals built in. All components are TypeScript-typed and follow Next.js and Tailwind CSS best practices.

What's the difference between using Aceternity UI vs building animations manually with Framer Motion?

Aceternity UI provides 100+ pre-built, production-ready animated components with Framer Motion already integrated, eliminating manual animation setup. Use Aceternity for faster delivery; build manually for custom, highly specialized animations.