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
- π¨ 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
Chai Builder is available in two packages:
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
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)
- 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
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.
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.