— Write Anything Beautifully
ContentBuilder.js v5.6.5
ContentBuilder.js is a Javascript library for creating elegant, editorial-style web content with ease. It brings the feel of magazine-style design to responsive web pages with simple drag & drop.
— A modern editor done right
Clarity Over Chaos
ContentBuilder.js avoids the chaotic drag-and-drop behavior. Instead of allowing random or deeply nested placements, it keeps layouts clean and predictable with simple drag & drop and structured row-and-column settings.
— Not just another WYSIWYG editor
Clean, Responsive Typography
Adjust font styles, line height, and letter spacing with text controls that produce clean output. Choose from a wide range of font sizes—from small to very large—and they’ll scale responsively across all screen sizes.
— Image Control That Matters
Embed Fast. Adjust Just Enough.
ContentBuilder.js focuses on what really matters: instant image embedding and essential aesthetic tweaks - without overloading the editor.
Ready-Made Plugins or Build Your Own
Enhance your content with sliders, galleries, logo loops, hero animations, and more. ContentBuilder loads plugin assets only when needed, keeping performance lean.
Or create your own plugins to add custom interactivity or dynamic elements.
AI Code Chat
AI Code Chat Code Chat lets you create and edit content through simple instructions. Design layouts, generate images, modify elements, and build complete pages using natural language prompts.
Unlike generic AI webpage generators that produce cookie-cutter landing pages, Code Chat creates unique, creative compositions with the visual sophistication of premium magazine designs.
Powered by OpenRouter and Fal.ai, Code Chat puts you in control with support for multiple AI models:
- Code Generation Models: Google Gemini 3 Pro, Claude Opus 4.5, GPT-5.1...
- Image Generation Models: Nano Banana Pro, GPT Image, Seedream 4.0, FLUX...
— 200+ Beautiful Blocks
Everything You Need to Create Stunning Content
ContentBuilder.js comes with over 200 beautifully designed blocks for almost any purpose. You can also customize existing blocks or add your own—everything is defined in a simple, editable JSON file.
— The Story
From WYSIWYG to Layout-Centric Editing
In the early days of content editing on the web, most tools were built around the classic WYSIWYG HTML editor model - focused on basic formatting, paragraphs, and inline styles. But as design expectations evolved, the web demanded more than just flowing text.
Grid systems emerged, but common web layouts didn’t evolve beyond predictable structures. We saw a need to build something different - a content editor that brings the expressive power of magazine-style design to modern websites, without the chaos of nested drag-and-drop elements.
ContentBuilder.js was created to fill that need. It supports structured yet flexible design, allowing for asymmetry, grid-based layout play, and expressive typography - all while maintaining clear and predictable layout rules.
A Flexible Builder for Any Stack
ContentBuilder.js works with popular CSS frameworks like Bootstrap, Tailwind CSS, Foundation, and more. It's written in pure JavaScript (ES6 module), making it easy to integrate into most setups. Examples are provided for use in plain HTML, PHP, React, Next.js, Vue, and Laravel projects. Here’s a simple usage example:
var builder = new ContentBuilder({
/* options */
});
To get the content (HTML):
var html = builder.html();
Documentation
As Featured On
t3n
Product Hunt
Hacker News
Order & Download
Standard
$69
- Websites for clients: Unlimited
- Resale in product or usage as hosted service (SaaS): No
- Source Code: No
Pro
$199
- Websites for clients: Unlimited
- Resale in product or usage as hosted service (SaaS): Yes
(1 product, unlimited users) - Source Code: No
Super
$599
- Websites for clients: Unlimited
- Resale in product or usage as hosted service (SaaS): Yes
(3 products, unlimited users) - Source Code: Yes
1 Year Free Upgrade & Email Support Included
After successful order, an automatic email containing login and download info will be sent.
If no email received within 1-2 hours, please check your spam folder or contact our support at: support@innovastudio.com
Change License
From Standard to Pro License ( $129)
From Pro to Super License ( $399)
From Standard to Super License ( $529)
Upgrade
No Limits License! Regardless of the package you choose, the "Websites for clients: Unlimited" feature allows you to incorporate the library into any number of websites owned by you or your clients—whether personal or business-related.
Understanding the Difference: Standard vs. Pro vs. Super Package