Next.js 16 + AI Ready

VibeUI Midnight

A modern dark monochromatic design system for Next.js, optimized for AI code generation. Build beautiful UIs faster.

Features

Everything you need to build modern web applications

AI-Ready

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

Dark Monochrome

Professional grayscale palette with high contrast for excellent readability.

Production Ready

Built with Next.js 16, TypeScript, and Tailwind CSS. Ready to deploy.

Fully Typed

Complete TypeScript support with type-safe component props.

Accessible

Built on Radix UI primitives, ensuring WCAG compliance.

Customizable

CSS variables and design tokens make theming straightforward.

Components

Production-ready UI components with consistent styling

Available Components

All components are fully typed, accessible, and optimized for AI generation

Button
Input
Card
Dialog
Tabs
Table
Label
Badge
Separator
Accordion
Section

AI Integration

Built for modern AI-powered development workflows

Schema Driven

Machine-readable component definitions

/ai/ai.schema.json

Agent Guide

Comprehensive instructions for AI agents

/AGENT_GUIDE.md

Example Patterns

Copy-paste ready code patterns

/ai/examples/

Ready to get started?

Explore the example pages or dive into the documentation