Introduction

Welcome to Nativ UI - A personal collection of components, design system, best practices, and prompts.

What is Nativ UI?

Nativ UI is a curated collection of:

• Components - Reusable UI components built with React and Tailwind CSS
• Design System - Typography, spacing, and color guidelines
• Playbooks - Production-ready implementation guides for common patterns
• Sections - Pre-built page sections like hero, features, pricing, etc.
• Templates - Full page templates ready to use
• Prompts - Useful prompts for AI-assisted development

Tech Stack

This documentation and component library is built with:

• Next.js 15 with App Router and Turbopack
• React 19 with Server Components
• TypeScript for type safety
• Tailwind CSS v3 for styling
• MDX for documentation content

Getting Started

Browse the sidebar to explore different sections:

1. Overview - Introduction and roadmap
2. Playbooks - Best practices for auth, search, and more
3. Design System - Typography and spacing guidelines
4. Sections - Hero, features, pricing, and more
5. Components - Buttons, animations, and more
6. Templates - Full page layouts
7. Prompts - AI prompts for development

Philosophy

The goal of Nativ UI is to:

• Provide a single source of truth for your design decisions
• Document best practices so you don't repeat research
• Offer copy-paste ready components and sections
• Keep everything simple and maintainable