Getting Started

ui.peacenode is a drop-in replacement for shadcn/ui with physics-based motion and modern visual defaults.

Initialize your project

Run the init command to set up your project. This creates a peace-ui.json config file and installs base dependencies.

Add components

Add individual components to your project:

Or add multiple at once:

What gets installed

When you run init, ui.peacenode:

• Creates peace-ui.json with your project config
• Installs motion (physics-based animation library)
• Adds lib/utils.ts and lib/motion.ts
• Sets up CSS variables for motion tokens and shadow hierarchy

Reduced motion

All animations respect prefers-reduced-motion. When the user has motion reduction enabled, animation durations are set to near-zero automatically.

Compatibility

• Next.js 14+ (App Router and Pages Router)
• Vite + React
• Remix
• Any React 18+ project with Tailwind CSS