15個最好的Bootstrap設計工具推薦

　　Bootstrap是由前Twitter設計師Mark Otto和Jacob Thornton開發的前端工具包，其提供了優雅的HTML和CSS規範。Bootstrap不單單是一個框架，更確切的說，它改變了整個遊戲規則。該框架使得許多應用和網站的設計開發變得簡便許多，而且它將大量的HTML框架普及成了產品。 

　　本文為你帶來15款針對Bootstrap框架的開發工具，可以幫助你更輕鬆地使用Bootstrap來構建想要的應用。

　　1.Layoutit 

　　Layoutit是一個線上工具， 它可以簡單而又快速搭建Bootstrap響應式佈局，操作基本是使用拖動方式來完成，很簡單，而元素都是基於Bootstrap框架整合的， 所以這工具很適合Web設計師和前端開發人員使用，快捷方便。 

　　2.X-editable

　　X-editable能夠讓你在頁面上建立可編輯的元素，它能夠使用任何引擎，比如Bootstrap、jQuery-UI、jQuery），並且包含彈出式和內聯模式。 

　　3.Jetstrap 

　　這是一個針對Bootstrap框架的視覺化製作工具，Web開發者、設計師直接在網頁端拖拽各個元件就可以製作出漂亮的網頁。通過Jetstrap製作出來的網頁100%符合Bootstrap標準，你只要設計了電腦端的頁面，它會自動適配手機端和Pad端（響應式設計）。 

　　4.Grid Displayer

　　Grid Displayer是一個可以顯示Twitter Bootstrap網格（固定和浮動網格）和Foundation（2.0 和3.0版本）的小工具。可以在Firefox和基於Webkit的瀏覽器中使用。 

　　5.Bootply

　　通過Bootply可以非常輕鬆地基於Bootstrap來進行設計、開發原型、擴充套件和測試等。Bootply可與其他流行的Bootstrap外掛、微框架和庫進行整合。 

　　6.Divshot

　　Divshot是一個線上網站，允許開發者通過視覺化方式進行Web介面的設計，並直接生成HTML和CSS程式碼。該工具提供常用的Web UI元件，介面基於Bootstrap框架構建，生成的介面也基於Bootstrap框架執行。 

　　7.Bootstrap Magic

　　Bootstrap Magic是一款基於Bootstrap和AngularJS的主題建立工具，開發者可以輕鬆地建立自己的 Twitter Bootstrap主題，並可以立即看到內容變化。還可以新增來自Google Webfont 的很棒的網頁字型。 

　　8.GetkickStrap 

　　Kickstrap無縫整合了Bootstrap和頂級Web技術，無需一個本地後端即可執行一個已驗證的、資料庫驅動的Web應用程式。使用者還可以使用JSPM.io提供的強大的、基於Require.js構建的前端包依賴管理工具。 

　　9.Font Awesome

　　Font Awesome是一套專為Twitter Bootstrap設計的圖示字型，幾乎囊括了網頁中可能用到的所有圖示，這些圖示通過Web Font的方式來顯示，可以被任意縮放、改變顏色，你可以像修改文字樣式那樣來修改圖示樣式。 

　　10.Bootstrap Button Generator

　　通過Bootstrap Button Generator，你只需輸入你想指定給新按鈕的樣式的CSS類，並簡單調整圖示的顏色，即可獲得新的圖示。 

　　11.Paintstrap

　　Paintstrap允許你使用Adobe kuler / COLOURlovers顏色方案來生成漂亮的Twitter Bootstrap主題。 

　　12.Fancyboot 

　　Fancyboot 是個非常有用的Bootstrap自定義工具，通過滑動選單可以選擇需要使用的外掛和元件，當使用者做好了相應的修改，可以下載一個包含使用者所使用的 jQuery 外掛的編譯好的和簡化後的 CSS 檔案。 

　　13.Bootstrap Designer

　　Bootstrap Designer是一個線上設計工具，可以幫你生成漂亮的基於Bootstrap框架的HTML5模板。 

　　14.Bootsnipp

　　Bootsnipp是一個針對Web設計師和開發者的前端元素庫，任何使用Bootstrap框架的開發者都可以找到所需的Web元素。

　　15.Easel

　　Easel是一個針對Bootstrap的基於瀏覽器的設計工具，可以幫助你快速製作出產品原型頁面。Easel能夠建立元素，如組合文字框、圖形或表格等，並且複製和修改也很容易。同時控制檯還配備了一套現成的按鈕、表單和圖示，直接拖拽就能使用。你還可以建立一個自己的常用小工具庫，這樣使用起來更快捷。 
 

　　來自：designgeekz