Documentation

Introduction

makeui is a set of animated components you copy into your own project. There is no package to install and nothing to fight when you want to change a detail: the code is yours.

Requirements

• Next.js 15 or newer (App Router), or any React 19 project.
• Tailwind CSS v4.
• shadcn/ui initialised in the project, which gives you the cn helper and the color tokens below.

Installation

Add any component with the shadcn CLI. This one installs Folder Flow:

pnpm dlx shadcn@latest add https://makeui.dev/r/folder-flow.json

The CLI copies the files into components/ui and installs the dependencies they list.

Theming

Components read the standard shadcn/ui tokens, so they follow your light and dark themes without extra setup. These are the ones in use:

:root {
  --background: oklch(0.985 0 0);
  --foreground: oklch(0.18 0.005 285);
  --card: oklch(1 0 0);
  --muted: oklch(0.955 0 0);
  --muted-foreground: oklch(0.5 0.01 285);
  --border: oklch(0.915 0.003 285);
  --primary: oklch(0.18 0.005 285);
  --primary-foreground: oklch(0.985 0 0);
  --accent: oklch(0.64 0.24 350);
}

Reduced motion

Components that move on their own respect prefers-reduced-motion: they show their final state straight away instead of animating.