Introduction

Introduction

DevClub UI is an open-source library of physics-driven interface primitives and animated micro-interactions built with Next.js, Tailwind CSS v4, GSAP, and WebGL.

Design Principles

Modern web interfaces often suffer from visual uniformity. DevClub UI was engineered around three core tenets:

01. Code Ownership

No black-box node_modules wrappers. Copy the source into your components folder and customize every curve, easing, and layout node.

02. Physics & Shaders

Infused with GSAP-powered inertial springs, tactile feedback, and WebGL GPU shaders engineered for 60+ FPS fluid motion.

03. Agent-Ready

Full TypeScript schemas, shadcn registry compliance, and curated LLM skills for Claude Code, Cursor, and Antigravity.

Flexible Distribution

Choose the workflow that fits your team:

DevClub CLI:

Run npx @devclubnst/ui add [name] to scaffold component source directly into your workspace.

Shadcn CLI:

Add directly via registry URL with npx shadcn@latest add https://devclub.co/r/[name].json.

Manual Copy & Paste:

Open any component studio, click the Code tab, copy the clean TSX source, and paste it straight into your project.

Frequently Asked Questions

Can I use DevClub UI in commercial projects?

Yes. DevClub UI is published under the MIT license. You can freely use, modify, and distribute components in SaaS applications, client work, and enterprise products.

Which frameworks are supported?

Components are written in React 19 / TypeScript and styled with Tailwind CSS v4. They are drop-in compatible with Next.js (App Router), Remix, Vite, Astro, and Gatsby.

How does it integrate with shadcn/ui?

DevClub UI adheres to the official shadcn registry item schema. You can use both libraries seamlessly side-by-side in the same project directory.

Ready to get started?

Follow our clean installation guide to start using components in minutes.

Installation Guide