Aceternity UI

Beautiful UI components for modern applications

A collection of beautiful and highly customizable UI components built with Tailwind CSS and Framer Motion.

Components Showcase

Beautiful and highly customizable UI components that you can copy and paste into your apps.

Animated Cards

Interactive card components with smooth animations and transitions.

Buttons

Customizable button components with various styles and animations.

Grid Layouts

Responsive grid components with interactive animations.

Text Effects

Dynamic text animations and typography components.

Loading States

Smooth loading animations and transition effects.

Animated Icons

Interactive icon components with smooth animations.

Why Choose Our Components

Built with the latest technologies and best practices in mind.

High Performance

Optimized for performance and speed with minimal bundle size and efficient rendering.

Responsive Design

Fully responsive components that work seamlessly across all devices and screen sizes.

Customizable

Easily customize and extend components to match your brand and requirements.

Type Safe

Built with TypeScript for better development experience and fewer runtime errors.

Modern Stack

Built with React, Tailwind CSS, and Framer Motion for modern web applications.

Easy Integration

Simple to integrate into existing projects with comprehensive documentation.

Simple, transparent pricing

Choose the perfect plan for your needs. Always know what you'll pay.

Free

Perfect for side projects

$0 /month

20 Components
Basic Documentation
Community Support

Popular

Pro

For professional developers

$49 /month

100+ Components
Advanced Documentation
Priority Support
Source Files

Enterprise

For large teams & companies

99 /month

Unlimited Components
Custom Documentation
24/7 Support
Custom Integrations

Comprehensive Documentation

Everything you need to get started with our components.

Example.tsx

import { AnimatedCard } from '@aceternity/ui'

const Example = () => {
  return (
    
      
        Interactive Card
      
      
        Hover to see the animation
      
    
  )
}

Detailed Examples

Copy-paste examples for quick implementation of components in your projects.

API Reference

Complete API documentation with TypeScript types and prop descriptions.

Getting Started

Step-by-step guides to help you get up and running quickly.