23 lines
2.1 KiB
Plaintext
23 lines
2.1 KiB
Plaintext
---
|
|
title: Introduction
|
|
description: Use Animate UI components to animate your pages.
|
|
---
|
|
|
|
**Animate UI is a set of React components** built with [Tailwind CSS](https://tailwindcss.com/) and [Motion](https://motion.dev/), designed to create fluid and engaging user interfaces. Inspired by [shadcn/ui](https://ui.shadcn.com/) and [Magic UI](https://magicui.design/), Animate UI aims to complement these projects by offering a broad range of **animated components** that are easy to integrate and extend.
|
|
|
|
Our goal is to continuously grow this collection so that React developers can quickly assemble modern, dynamic interfaces for their applications.
|
|
|
|
## Not a Standard Library, but a Distribution of Components
|
|
|
|
In the same spirit as [shadcn/ui](https://ui.shadcn.com/), **Animate UI is not a typical “install-from-NPM” library**. Instead, we provide a **distribution of open-source components that you can copy, modify, and customize** according to your needs. This “open code” approach grants you maximum flexibility without having to rely on complex workarounds for styling or business logic adjustments.
|
|
|
|
## Why Animate UI?
|
|
|
|
1. **Open Source**: By offering direct access to the source code, we give you total freedom to adapt, modify, and repurpose each component. Rather than wrapping components or overriding styles, you can **edit them at their core** to fit your unique design system and requirements.
|
|
|
|
2. **Complementary to Magic UI and shadcn/ui**: Animate UI is designed to complement [Magic UI](https://magicui.design/) and [shadcn/ui](https://ui.shadcn.com/) by offering a broad range of animated components that are easy to integrate and extend.
|
|
|
|
3. **Built with Tailwind CSS and Motion**: Animate UI is built with [Tailwind CSS](https://tailwindcss.com/) and [Motion](https://motion.dev/), so you can easily integrate it with your existing projects.
|
|
|
|
4. **Fully Animated Components**: Animate UI delivers a complete suite of animated components right out of the box. By incorporating [Motion](https://motion.dev/) at its core, Animate UI makes it easy for anyone—regardless of animation expertise—to build interfaces that feel modern and engaging.
|