Utility first CSS frameworks are not new. I first encountered utility CSS framework called Bass CSS. I was really amazed with the development speed that came up with adding just few classes. Creating grids, adding typography was simpler than before. I did actually used it on few project at my organizations back then.
When I first saw Tailwind CSS, I thought its another framework similar to Bass CSS. But, Tailwind CSS offered much more. Utility classes provided by Tailwind CSS are enough to create any kind of landing pages, admin portals etc.
Before creating the Tailwind CSS page builder, i had worked on two different website builders earlier in my career. Took my past experience with website builders and poured it into building this. Of course, I took some inspiration from current page builders out there.
What is Chai Page Builder?
Chai builder is a UI Blocks generator. It uses Tailwind CSS under the hood to create UI blocks with clean code. Blocks can be plain HTML or even React, Vue components
Features:
1- No-Code / Low-Code
Tailwind page editor offers a complete No-Code experience. However, to make more further modifications knowledge of Tailwind CSS is needed.
2- Fully Customizable
Get granular control over every block on your page. Style it, edit content, set images, background and lot more.
3- Dark Mode
Tailwind CSS has first class support for dark mode. Tailwind CSS Page builder offer complete support for dark mode. All the ready-to-use blocks will have dark mode support by default.
4- Device Preview
Verify the page design on multiple screen sizes right inside the page builder. Support screen sizes from mobile to wide screens
5- Fonts & Colors
Set the fonts for heading and body, and three different color. Choose from hundreds of fonts and color of your choice.
6- Export Blocks Or Page
Export the designed page in multiple format. Exports are available in 4 format. Full HTML page, HTML blocks, or React, Vue Components. Ready to use.
7- Predefined Blocks
Page builder provides a set of predefined blocks. Blocks including all types like headers, footers, content, pricing, CTA, blogs and lot more.
Links:
Homepage: www.chaibuilder.com
Build here: app.chaibuilder.com/start
I update progress about this project on my twitter handle at @chaibuilder
Thank you reading through.
Happy Coding!!!
