Bootstrap Studio v7.0.0
Bootstrap Studio v7.0.0
A powerful desktop app for creating responsive websites using the Bootstrap framework. Bootstrap Studio is a powerful desktop app for designing and prototyping websites. Bootstrap Studio is a desktop application that helps you create beautiful websites. It comes with a large number of built-in components, which you can drag and drop to assemble responsive web pages. It is built on top of the hugely popular Bootstrap framework, and exports clean and semantic HTML. Thousands of developers and designers use it every day. We are sure you'll love it too!
The Interface
Bootstrap Studio has a beautiful and powerful interface, which is built around the simplicity of drag and drop. This makes it the perfect tool for prototyping and designing web pages and apps.
Beautiful Built-in Components
Bootstrap Studio comes with a large number of pretty components for building responsive pages. We've got headers, footers, galleries, slideshows and even basic elements like spans and divs. See some of them below.
Smart Drag & Drop
Bootstrap Studio knows which Bootstrap components can be nested in one another and gives you suggestions. It automatically generates beautiful HTML for you, which looks as if it was written by hand by an expert.
Create Your Own Components
You can extract pieces of your designs as Custom Components, and have them ready to be dropped into any design you create. You can also export these components as files and share them.
Online Library
If you need a component which doesn't exist in our library, just click the Online tab in the Component Panel. There you will find thousands of components built and shared by the community. You can also upload your own.
Linked Components
This is a powerful feature which allows you to synchronize components, so changing one will automatically change the other. This is especially useful for things like headers and footers which you need to update across pages.
Realtime Preview
Bootstrap Studio has a powerful feature called Preview. With it, you can open your design in multiple web browsers and devices, and every change you make within the app will be shown instantaneously everywhere.
Editing Code
For some things drag and drop isn't enough. This is why Bootstrap Studio gives you full control over your markup when you need it. You can import and edit CSS, jаvascript and HTML in our Sublime Text-like editor.
Advanced CSS Editor
Our advanced CSS editing interface supports auto suggest and rule validation, and shows the active and inherited rules at an any given time. You will soon dread having to go back to your text editor.
jР°vascript Editing
Write jР°vascript in our Sublime Text-like editor. All your changes are synced with the preview, so you can write code and try it out without having to reload your browser.
HTML Editing
With our powerful Custom Code component, you can write HTML directly, without going through our drag and drop interface. You can also convert any piece of your page into Custom Code when you need it.
Import Existing Websites
If you have a website that you've developed previously, you can import it. Just drag and drop the HTML, CSS, JS files and images into Bootstrap Studio and they will be added to your project.
Even More Features
There is a lot more to say about our wonderful app. From productivity features to specialized Bootstrap tools, Bootstrap Studio makes designing websites and building fully working prototypes a real joy.
Built for Bootstrap
Bootstrap Studio knows how to construct a valid Bootstrap page and automatically writes the correct HTML. It supports Bootstrap 3 and will be updated to Bootstrap 4 once it's out.
Grid Tools
The app has specialized tools for working with the Bootstrap grid. Easily create, resize and offset columns, and apply responsive visibility classes.
Google Webfonts
Bootstrap Studio is integrated with Google Webfonts and gives you an easy way to import and manage your fonts. Font family names are even auto-suggested in our css editor.
Productivity Features
Bootstrap Studio has comprehensive support for keyboard shortcuts which allow you to speed up your workflow dramatically.
Themes and Icons
The app has a number of built-in Bootstrap themes, icon fonts, templates and components, which you can combine into beautiful and unique designs.
Always Up to Date
Bootstrap Studio updates automatically, so you always have the latest version. We release updates every month, filled with new features, components and improvements.
Version 7.0.0
NEW
You can now create blogs and other content-focused websites with the new Blog components. Just drop a Blog Loop component and select a folder with pages in your design. This will generate a list of posts that is updated on every page change. Exporting your design embeds the list as static HTML, no CMS or WordPress required!
Panels in the app can now be moved between sidebars and organized freely. Reset the window to the initial state from View > Reset Panels at any time.
Two new templates were added - Timeless and Project Folio. Both have full light and dark mode support, and use the new blog components as a way to manage their content.
IMPROVED
Linked components were significantly improved and optimized. Children of Linked components can now be "Unlinked" allowing you to freely edit parts of a linked component while the rest remains in sync.
In the CSS editor you can now modify display:flex and display:grid properties with easy visual tools, letting you quickly experiment.
CSS auto suggest now looks up values as well as property names when creating a new rule.
A Lang option was added to Page Properties.
The Image Optimization dialog now lets you save optimized images as copies instead of overwriting them.
Button Group now has a gap option.
Additional Bootstrap font and line height options were added to textual component.
Switching between pages and designs is much faster, eliminating delays and content shifts.
FIXED
The color picker now correctly displays CSS variables in the Design tab when changing color and background while editing text.
CSS classes entered in the Attributes panel are now correctly converted into buttons if they match a Bootstrap utility class.
Various small fixes and optimizations.
NEW
You can now create blogs and other content-focused websites with the new Blog components. Just drop a Blog Loop component and select a folder with pages in your design. This will generate a list of posts that is updated on every page change. Exporting your design embeds the list as static HTML, no CMS or WordPress required!
Panels in the app can now be moved between sidebars and organized freely. Reset the window to the initial state from View > Reset Panels at any time.
Two new templates were added - Timeless and Project Folio. Both have full light and dark mode support, and use the new blog components as a way to manage their content.
IMPROVED
Linked components were significantly improved and optimized. Children of Linked components can now be "Unlinked" allowing you to freely edit parts of a linked component while the rest remains in sync.
In the CSS editor you can now modify display:flex and display:grid properties with easy visual tools, letting you quickly experiment.
CSS auto suggest now looks up values as well as property names when creating a new rule.
A Lang option was added to Page Properties.
The Image Optimization dialog now lets you save optimized images as copies instead of overwriting them.
Button Group now has a gap option.
Additional Bootstrap font and line height options were added to textual component.
Switching between pages and designs is much faster, eliminating delays and content shifts.
FIXED
The color picker now correctly displays CSS variables in the Design tab when changing color and background while editing text.
CSS classes entered in the Attributes panel are now correctly converted into buttons if they match a Bootstrap utility class.
Various small fixes and optimizations.
Only for V.I.P
Warning! You are not allowed to view this text.