Aceternity Ui

# Aceternity UI Component Catalog

Complete reference of all 100+ components organized by category with installation commands and use cases.

## Table of Contents

- [Backgrounds & Effects (28)](#backgrounds--effects)
- [Card Components (15)](#card-components)
- [Scroll & Parallax (5)](#scroll--parallax)
- [Text Components (10)](#text-components)
- [Buttons (4)](#buttons)
- [Loaders (2)](#loaders)
- [Navigation (5)](#navigation)
- [Input & Forms (3)](#input--forms)
- [Overlays & Popovers (3)](#overlays--popovers)
- [Carousels & Sliders (4)](#carousels--sliders)
- [Layout & Grid (3)](#layout--grid)
- [Data & Visualization (2)](#data--visualization)
- [Cursor & Pointer (3)](#cursor--pointer)
- [3D Components (2)](#3d-components)
- [Sections & Blocks (3)](#sections--blocks)

---

## Backgrounds & Effects

### 1. Dotted Glow Background
**Command**: `bunx shadcn@latest add @aceternity/dotted-glow-background`
**Description**: Subtle dotted pattern with glowing effect
**Use Cases**: Subtle hero backgrounds, section dividers
**Docs**: https://ui.aceternity.com/components/dotted-glow-background

### 2. Background Ripple Effect
**Command**: `bunx shadcn@latest add @aceternity/background-ripple-effect`
**Description**: Animated ripple waves spreading across background
**Use Cases**: Interactive landing pages, click-triggered effects
**Docs**: https://ui.aceternity.com/components/background-ripple-effect

### 3. Sparkles
**Command**: `bunx shadcn@latest add @aceternity/sparkles`
**Description**: Particle sparkle effects floating across screen
**Use Cases**: Magical/premium feeling pages, celebration effects
**Docs**: https://ui.aceternity.com/components/sparkles

### 4. Background Gradient
**Command**: `bunx shadcn@latest add @aceternity/background-gradient`
**Description**: Smooth, static gradient backgrounds
**Use Cases**: Clean, modern hero sections
**Docs**: https://ui.aceternity.com/components/background-gradient

### 5. Background Gradient Animation
**Command**: `bunx shadcn@latest add @aceternity/background-gradient-animation`
**Description**: Animated gradient that shifts colors over time
**Use Cases**: Dynamic hero sections, attention-grabbing backgrounds
**Docs**: https://ui.aceternity.com/components/background-gradient-animation

### 6. Wavy Background
**Command**: `bunx shadcn@latest add @aceternity/wavy-background`
**Description**: Animated wave patterns
**Use Cases**: Ocean/water-themed designs, fluid motion backgrounds
**Docs**: https://ui.aceternity.com/components/wavy-background

### 7. Background Boxes
**Command**: `bunx shadcn@latest add @aceternity/background-boxes`
**Description**: Grid of animated rotating boxes
**Use Cases**: Tech-focused pages, 3D geometric designs
**Docs**: https://ui.aceternity.com/components/background-boxes

### 8. Background Beams
**Command**: `bunx shadcn@latest add @aceternity/background-beams`
**Description**: Glowing animated beams following SVG paths
**Use Cases**: Hero sections, high-impact landing pages
**Docs**: https://ui.aceternity.com/components/background-beams

### 9. Background Beams with Collision
**Command**: `bunx shadcn@latest add @aceternity/background-beams-with-collision`
**Description**: Interactive beams that collide and bounce
**Use Cases**: Interactive hero sections, physics-based designs
**Docs**: https://ui.aceternity.com/components/background-beams-with-collision

### 10. Background Lines
**Command**: `bunx shadcn@latest add @aceternity/background-lines`
**Description**: Subtle moving line patterns
**Use Cases**: Minimalist backgrounds, subtle motion
**Docs**: https://ui.aceternity.com/components/background-lines

### 11. Glowing Stars Effect
**Command**: `bunx shadcn@latest add @aceternity/glowing-stars-effect`
**Description**: Twinkling stars animation
**Use Cases**: Night sky themes, space-themed pages
**Docs**: https://ui.aceternity.com/components/glowing-stars-effect

### 12. Aurora Background
**Command**: `bunx shadcn@latest add @aceternity/aurora-background`