VibeUI

Next.js 16 + Neobrutalism

VibeUI Neobrutalism

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

Features

Everything you need for bold, modern interfaces

Bold & Brutalist

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

Dark & Light Modes

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

AI-Optimized

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

50+ Components

Complete shadcn/ui library styled with neobrutalist design principles.

Next.js 16

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

Production Ready

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

Components

Production-ready UI components with neobrutalist styling

Available Components

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

Button
Input
Card
Dialog
Tabs
Table
Label
Badge
Separator
Accordion
Section
Select

Neobrutalist Design

Core principles that define this aesthetic

Hard Shadows

Solid, offset shadows instead of subtle blurs

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

Thick Borders

3-4px borders for bold definition

border-width: 3px;

Bold Colors

Vibrant, saturated color palette

hsl(189 100% 42%)

Ready to get started?

Explore the example pages or dive into the documentation