AceUi

Installation

AceUI extends shadcn/ui with smooth animations, advanced components, and modern background patterns , crafted for standout UIs.

Create project

Run the init command to create a new Next.js project or to setup an existing one:

1npx shadcn@latest init

Add components

You can now start adding components to your project.

1npx shadcn@latest add "https://ace-ui-six.vercel.app/r/text-scramble.json"

Import component

The command above will add the TextScramble component to your project. You can then import it like this:

1import { TextScramble } from "@/components/ui/text-scramble"; 
2

3export default function ScrambleExample() {
4return (
5 <div className="flex justify-center items-center h-screen bg-gray-900 text-white">
6   <TextScramble 
7     className="text-blue-400"
8     speed={30}
9     duration={800}
10   >
11     Hover Over This Text
12   </TextScramble>
13 </div>
14);
15}