aceternity-ui

100+ animated React components (Aceternity UI) for Next.js with Tailwind. Use for hero sections, parallax, 3D effects, or encountering animation, shadcn CLI integration errors.

1.25x

Quality

75%

Does it follow best practices?

Impact

88%

1.25x

Average score across 3 eval scenarios

Securityby

Advisory

Suggest reviewing before use

Optimize this skill with Tessl

npx tessl skill review --optimize ./plugins/aceternity-ui/skills/aceternity-ui/SKILL.md

Evaluation results

72%

44%

Integrate Aceternity UI into an Existing Next.js Project

Registry configuration and dependency setup

Criteria

Without context

With context

Aceternity registry entry

25%

100%

New York style

CSS variables enabled

Correct motion package

100%

All three manual deps

40%

100%

cn helper implementation

100%

Namespaced CLI install syntax

100%

Bun preferred

50%

tailwind.config.ts path

shadcn init command present

100%

RSC and TSX flags

100%

92%

-8%

Build an Animated Hero Section for a SaaS Landing Page

Component usage patterns and TypeScript integration

Criteria

Without context

With context

use client directive

100%

Import path convention

100%

TypeScript interface for props

100%

Background component used

100%

Animated text component used

100%

Animated button component used

100%

Background rendered behind content

100%

Component accepts typed props

100%

Dark mode classes present

100%

Responsive classes present

100%

page.tsx uses client or server pattern correctly

100%

18%

Build a Performance-Optimized Product Showcase with Dark Mode

Dark mode support and performance optimization

Criteria

Without context

With context

Dynamic import used

100%

SSR disabled on dynamic import

100%

darkMode class config

100%

dark: prefix classes used

100%

use client on animated component

100%

Aceternity card component used

100%

Aceternity background component used

100%

Responsive layout classes

100%

Performance explanation

100%

Import from @/components/ui/

100%

Repository: secondsky/claude-skills
Commit: 90d6bd7

Evaluated: 30 days ago
Agent: Claude Code
Model: Claude Sonnet 4.6

Table of Contents

Integrate Aceternity UI into an Existing Next.js Project Build an Animated Hero Section for a SaaS Landing Page Build a Performance-Optimized Product Showcase with Dark Mode

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.