Chai Builder - Open Source React Website Builder


Chai Builder is a full open-source React website builder that empowers developers to create stunning web pages visually using drag-and-drop functionality. Built with React and Tailwind CSS, it seamlessly integrates into your existing projects.

🚀 Out-of-the-box support for:

- Next.js 16
- Tailwind CSS v3+

📚 CodeWiki | 🎨 Live Demo

!CHAI BUILDER

✨ Features

- 🎨 Visual Drag & Drop Builder - Create pages visually without writing code
- ⚛️ React-First - Built as a React component for seamless integration
- 🎯 Tailwind CSS Powered - Leverage the full power of Tailwind CSS v3+
- 🚀 Next.js 16 Ready - Full support for the latest Next.js features
- 🔧 Two Flexible Modes - Use as a core builder component or as a complete Next.js website builder
- 📦 Extensible - Add custom blocks and components
- 💾 Data Control - Full control over how and where you save your data
- 🎭 Framework Agnostic Rendering - Render blocks in any React application

---

📦 Packages

Chai Builder is available in two packages:

---

$3

For any React application

The core builder package that can be integrated as a standard React component into any React application. Perfect for building custom page builders and visual editors.

Core Features:

- 🎨 Drag & Drop React Builder - Visual builder component for React
- 🔧 Extensible API - Add custom layouts with ease
- 🪝 Inner Hooks - Exposed hooks to create custom layouts
- 📦 Custom Blocks - Register custom blocks and block settings
- 🎛️ Custom Panels - Add your own custom panels
- 🔗 Data Binding - Built-in data-binding support
- 🌍 i18n Support - Internationalization ready
- 🤖 AI Panel - AI Chat Panel
- 🧩 Partial Blocks - Reusable header, footer components
- 🎨 Theme System - Customizable theming
- 🎯 Design Tokens - Design system integration
- 📄 Import HTML - Import existing HTML content

📚 View Documentation

---

$3

For public content-heavy sites

A more powerful Next.js-specific implementation designed for blogs, marketing sites, documentation, and any public-facing content. Built with SSG (Static Site Generation) + ISR (Incremental Static Regeneration) for optimal performance.

All Core Features Plus:

- 📄 Page Types - Define custom page types with specific layouts
- 📚 Collections - Manage content collections (blogs, products, portfolios)
- 🖼️ Media Manager - Built-in media manager with image editor
- 🤖 AI Assistant - Create and edit UI components and content with AI
- 🔍 SEO & JSON-LD - Advanced SEO features with structured data
- 🌐 Multilingual - Multilingual support
- 👁️ Preview Mode - Live preview before publishing
- 📝 Revisions & Compare - Version control with comparison tools
- 📚 Library Blocks - Shared block library across projects
- 🔒 Page Lock - Prevent conflicts with page locking
- 🔒 CMS Integration - Connect to any headless CMS
- 🔐 BYO Stack - Bring Your Own Auth, Database (Postgres), and Storage

🚀 Get Started: Next.js + Supabase Starter (Work in Progress)

---

🎯 Use Cases

- Landing Pages - Build beautiful landing pages with ease
- Marketing Websites - Create and update marketing content visually
- Content Management - Empower non-technical users to create pages
- Rapid Prototyping - Quickly prototype and iterate on designs
- White-Label Solutions - Build page builders into your SaaS products

---

🤝 Support

If you like the project, you can assist us in expanding. ChaiBuilder is a collaborative endeavor crafted by developers in their free time. We value every contribution, no matter how modest, as each one represents a significant step forward in various ways, particularly in fueling our drive to enhance this tool continually.

Acknowledgments

Chai Builder stands on the shoulders of many open-source libraries and tools. We extend our gratitude to the developers and maintainers of these projects for their contributions.