VibeUI

Next.js 16 + Neobrutalism

VibeUI Neobrutalism

A bold design system with hard shadows, thick borders, and vibrant colors. Optimized for AI code generation.

Everything you need for bold, modern interfaces

Hard shadows, thick borders (3px), and vibrant colors define the neobrutalist aesthetic.

Seamlessly switch between light and dark themes with consistent neobrutalist styling.

Machine-readable schemas and comprehensive documentation for AI coding agents.

Complete shadcn/ui library styled with neobrutalist design principles.

Built with the latest Next.js features including App Router and Server Components.

Zero TypeScript errors, fully tested builds, and optimized for deployment.

Production-ready UI components with neobrutalist styling

All components feature thick borders, hard shadows, and bold colors

Button

Input

Card

Dialog

Tabs

Table

Label

Badge

Separator

Accordion

Section

Select

Core principles that define this aesthetic

Solid, offset shadows instead of subtle blurs

box-shadow: 4px 4px 0px black;

3-4px borders for bold definition

border-width: 3px;

Vibrant, saturated color palette

hsl(189 100% 42%)

Explore the example pages or dive into the documentation