Bootstrap Canvas - Guide

Target Audience

Bootstrap Canvas is built to cater to everyone who wants to, or has an interest in, creating websites using the Bootstrap CSS framework. Our targeted audience is:

• Web Designers: We provide tools to seamlessly transform their inspirations into tangible HTML code.
• Web Developers: Our tools facilitate them in converting designs into code without the hassle of manually handling accessibility compliance or SEO/AEO optimization.
• React Developers: Our recent updates enable React developers to directly export page segments as React components. This enhancement provides significant relief for React developers seeking to utilize Bootstrap.
• Business Owners: Effortlessly create professional, stunning websites with zero coding knowledge.
• Agencies and Teams: Streamline workflows to bridge the gap between design and development effortlessly.
• Students: The platform is an ideal learning tool for educators and students, offering a no-code, user-friendly way to explore web design and development.
• Brands: Brands can maintain a strong online presence affordably with our low-cost web design tools.

Subscriptions

We offer wide range of monthly subscription packages to suit with individual and business needs.

Each subscription offers you a number of allocations for projects, themes, users in your team, and AI assistants. You may choose a package that fulfills your requirements. If you need more, you can purchase one-time top-up packages.

Text Paragraph

• Project Allocation : Number of projects that you can create within your monthly subscription period. Each project can contains up to 100 pages/layouts.
• Theme Allocation : Number of theme that you can create within your monthly subscription period. You may fine-tune your theme any time later. 
• User Allocation : You may invite your team members to collaborate into your projects.  Each subscription plan has a limit on the number of team members you can add.
• AI Assistance : AI assistance is directly accessible from the IDE. Each subscription offer number of AI assistance. Cost is depending on the the process,
  • Text to Code

    2 Credits
  • Design to Code

    5 Credits
  • Design to React component

    2 Credits
  • Theme Building

    1 Credits
  • Content Generation/Describe

    1  Credits
  • Proof-read

    1  Credits
  • Image Operations

    10  Credits

AI Assistance

AI assistance is a powerful tool built right into the Crafter IDE and Theme builder to simplify your works. AI assistance offer you many choices to to save your time and effort.

Text to Code:

Describe the part or page you want to build in plain English. It will create Bootstrap-compatible, sophisticated HTML code. In many scenarios, it will manage to build the design using only Bootstrap classes. Custom CSS styles may be added depending on your requirements, and these will be included in the final theme file when you export the project.

Text to code option is available in Container and Column elements.

Design to Code:

Upload your design as a clear image and let the AI to convert it into clean bootstrap compatible codes in a matter of seconds thanks to AI vision.

Design to code option is available in image elements.

Theme Generation:

Pick the colors you love and let the AI help you to build the color pallet match with your brand.

AI will generate 3 color palettes and let you choose either one of them or you have choice to pick one or more color class from them to build your own color pallet.

Theme generation option is available in theme editor.

Content Generation/Proof-read:

Crafter IDE now includes AI-powered content generation! Our AI can not only generate fresh content but also analyze your existing content to expand and adapt it to the page's tone.

Content Generation option is available in paragraph elements.

Image Manipulation:

Save time and effort with Crafter IDE's built-in background removal tool. Perfect for creating clean and professional product images or isolating subjects for design purposes.

Image processing option is available in image elements.

Projects

A project is a collection of HTML pages and page layouts for your website. You can include up to 100 pages and layouts in a single project. You can create and manage all your projects directly from your dashboard.

Creating a Project

1. In your dashboard, select "Create Project" button to create a new project.

2. Enter project detail to create the project.

Accessing a Project

In your dashboard project list, You'll have 3 icons.

• Open project in designer
• Open export list : All your project exports are in this page
• Edit project properties : Change project name, description or  delete

Deleting a Project

Once you create the project and you don't want to further access it, you may delete it from the project edit page.

* Deleting a project does not free up your project credits.