15个为设计人员准备的最好 Bootstrap 工具
1. Layoutit
LayoutIt helps you create your frontend code simple and quickly with Bootstrap using our Drag & Drop Interface Builder. It takes every element and component of Bootstrap to make your frontend coding easier without needing to be an expert in javascript, html5 or css3.
All your designs can be Responsive CSS and Fluid. Drag-and-drop the same Bootstrap components to your own design. Easy to integrate with any programming language, you just download the HTML and start coding the design into it.
2. X-editable
X-editable supports in-place editing with 推ter Bootstrap, jQuery UI or pure jQuery. This library allows you to create editable elements on your page. It includes both popup and inline modes. It’s new life of bootstrap-editable plugin that was strongly refactored and improved.
It supports input type like, text, textarea, select, date, dateui and checklist. It supports client-side and server-side validation. The container placement is fully customizable. User can toggle by click, dblclick or manually. It works in IE7+ and all modern browsers.
3. Jetstrap
Jetstrap is a 100% web-based interface building tool for 推ter Bootstrap. Built for developers, designers, and idea-people alike, Jetstrap helps you get awesome websites up and running fast, with less work and digging through docs.
4. Grid Displayer
Grid Displayer is a boomarklet that displays the grid of both 推ter Bootstrap (fixed and fluid grid) and Foundation (2.0 and 3.0). It works with Firefox and WebKit browsers.
5. Bootply
Bootply lets you fiddle with Bootstrap. Edit Bootstrap-friendly CSS, HTML and JavaScript.Use Bootply to design, prototype, extend, or test the Bootstrap framework. Bootply is integrated with other popular Bootstrap plugins, micro-libraries and frameworks.
6. DivShot
Divshot is a drag-and-drop front end editor that allows you to build responsive sites on Bootstrap (as well as Foundation) without the coding.
7. Bootstrap Magic
Bootstrap Magic themes generator is featuring Bootstrap 3 and AngularJS. You can easily create your own 推ter Bootstrap theme quickly. You can see instantly what you are changing on the content. You can also add awesome webfonts from Google Webfont. They are all included in font magic typehead. Satisfy? Download your personalized CSS, minified or not and LESS variables.
8. GetkickStrap
Kickstrap seamlessly combines Bootstrap with top-tier web technologies. It’s so advanced, it can run an authenticated, database-driven web app without a native backend. Kickstrap’s partnership with JSPM.io provides a strong front-end package dependency manager built on Require.js. Kickstrap apps are unit JSPM bundles of static resources that can be run at any time in the web app’s lifetime.
9. Font Awesome
Font Awesome gives you scalable vector icons that can instantly be customized — size, color, drop shadow, and anything that can be done with the power of CSS.
10. Bootstrap Button Generator
It’s easy, you Just need to enter the css class you want to assign to your new button style and play with the different button colors to update the live previews in the right.
11. PaintStrap
Paintstrap lets you generate beautiful 推ter Bootstrap themes using the Adobe kuler / COLOURlovers color scheme.
12. Fancyboot
Fancyboot is a simple yet powerful customization tool for Bootstrap with just the right amount of control and without all the unnecessary complexities.
13. Bootstrap Designer
Bootstrap Designer is an online design tool, producing awesome HTML5 templates based on Bootstrap framework. Use Bootstrap Designer to create various design styles: minimalist style, black & white, grunge, typographic-driven, monochromatic look, clean & creative, etc.
14. Bootsnipp
Bootsnipp is an element gallery for web designers and web developers created by Maks, anybody usingBootstrap will find this website essential in their craft.
15. Easel
Easel is an impressive browser design tool for Bootstrap. Easel lets you make specific elements in your documents link to other documents to prototype flows within your application without a single line of code. You can even have your users test through a unique link allowing you to get feedback earlier in your process. Easel makes it easy to make comments on specific parts of your documents. Just highlight the part of the design you are interested in and type in your comment.