如何將 Figma 版面，依照Bootstrap網格系統分割成12等分

　　Figma是目前UI/UX的新寵兒，除了有提供免費的試用版外，甚至免安裝打開瀏覽器立即就可使用，有別於一般的UI/UX軟體，同時Figma的操作介面相當的節潔好上手，以及支援多人協作，而提到UI/UX大家的第一印象都是APP，但除了APP以外其實Figma也可運用於網頁設計上。

而梅干要跟大家來分享Figma在網頁設計上的小技巧，讓Figma也可依照Bootstrap的網格系統，進行版面的設計，至於要怎麼在Figma中，開啟Bootstrap的網格系統，有在使用Figma的朋友也一塊來看看囉！

---

Step1
首先進入Figma後，先建立一個Frame。

---

Step2
在建立好後，對著Layout grid後方的加號點一下，這時畫面就會看到粉紅色的線框。

---

Step3
接著點一下前方的圖示，再點左上角的下拉選單。

---

Step4
將模式切換為Columns後，再把Count欄位設為12，Gutter間距設為15。

---

Step5
都設定好後，就可以開始設計你的版面啦！！