— A Web Page Designer Without Complexity
ContentBox.js v5.8.22
Featuring an AI Assistant & New Canvas Mode
ContentBox.js is a JavaScript library for web page design, introducing elegant magazine layouts to responsive web content.
Now, with its new AI Assistant, you can type or speak your commands to build your web page. Use ContentBox.js to create your own CMS or online site builder.
ContentBox.js uses the powerful ContentBuilder.js as its HTML editor, with added features for page designing.
No Code Animation Builder
Create on-view or on-scroll triggered animation with scrubbing, section pinning and more.
It's probably the only animation builder that has section pinning settings for scroll scrubbing, which normally requires manual coding (eg. using GSAP or ScrollTrigger). ContentBox.js brings this feature into a simple panel you can play with, complete with a Live Preview for various screen sizes.
AI-powered: Build web content & generate images by typing or speaking commands.
Unlike a single prompt generating a full site with predefined styles, the ContentBox.js AI Assistant works in a collaborative manner with designers. The assistant can perform specific tasks based on your instruction, such as increasing the font size, changing colors, adding elements, or even generating new content or layout ideas. It's the kind of assistant that works with designers' preferences and ideas!
Check out the AI-Assistant documentation for features and options:
* This feature requires OpenAI API Key.
* The AI-Image generation requires Getimg API Key.
Do you see the gray button? Make it a litle darker.
Let’s redesign the layout. Surprise me with a new idea!
Increase the headline font size
Underline the phrase ‘every monday’ please.
Change the section background color to light green.
Create a new section with a 300-word article about outdoor activities.
Can you suggest a captivating headline for us and replace the current one?
Write 30 words paragraph after the headline to showcase our solutions
Layout Freedom with Grid & Gridless Combined
More than just another landing page designer, ContentBox.js lets you create content with a magazine-style layout with its powerful grid system. You can also use popular CSS frameworks like Bootstrap, Foundation, Tailwind CSS, and more.
The new version features a Canvas (gridless) mode that allows you to resize, position, rotate blocks and arrange them at any breakpoint, giving you layout freedom for your content.
One-Click Typography Control
Explore a variety of typography styles and apply them to specific sections or the entire page with a single click. You can even use larger font sizes while maintaining responsiveness!
Essential Settings to Get Creative & Trigger More Ideas
No complex style settings; instead, find simple panels that you can experiment with to achieve your desired results or spark further ideas. The controls are focused only on the essentials.
— Everything you need to create beautiful content
Sections & blocks for any mission
Start with a simple section or choose from the templates library. Then edit or add blocks for your content.
Usage
ContentBox.js is written in pure Javascript (ES6 module) so you can use it in most situations. Sample use in simple HTML, PHP, React, Next.js, and Vue project are included in the package. Here is the simple usage example:
var builder = new ContentBox({
/* options */
});
To get the content (HTML & its styles):
var html = builder.html(); var mainCss = builder.mainCss(); // get page style var sectionCss = builder.sectionCss(); // get sections' styles
To load the content (HTML & its styles):
builder.loadHtml(html); builder.loadStyles(mainCss, sectionCss);
Documentation
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
$499
- 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 ( $299)
From Standard to Super License ( $429)
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 your clients, whether they're personal or company websites.
Understanding the Difference: Standard vs. Pro vs. Super Package
Note
ContentBox.js includes fully functional ContentBuilder.js (minified) for editing that can only be used within ContentBox.js. For independent usage (outside of ContentBox.js), we recommend ContentBuilder.js full package.
Requirements
All modern browsers with HTML 5 Specification (Chrome, Firefox, Edge, Safari).
Built with ContentBox.js