在線平面圖標生成器：創建平面或平面圖標的簡單AppWeb

首先，我會說很多人可能知道的事情……但這沒關係：HTML5 + CSS3 + JS ...只是完美perfect

一個用戶給我寫了一封電子郵件，向我詢問有關如何創建平面圖標的教程，這些圖標是平面的，這是網絡上的新時尚。 特別需要 Inkscape中 o 花邊 聊天式按鈕或可以用作（或引用）的內容 Snapchat.

由於我對Inkscape以及使用Gimp都從頭開始創建內容感到很糟糕...我記得不久前我看到了一個小型Web應用程序（一個帶有一些CSS和JS的index.html），這使我們能夠以當前的方式（即平面設計）輕鬆快速地創建平面圖標。

平面圖標生成器

它具有一系列預定義的圖標，例如“筆記本電腦”圖標，移動設備（我在屏幕快照中顯示的圖標），禮物，自行車...等等，它們很多，而且種類繁多：

但這不是僅放置圖標，而是...現在，我們可以通過兩個水平條來定義圖標的大小或圖像的大小（圖標+背景）。 顯然，我們看到以像素為單位的正方形大小…256…512…等

下一個選項使我們可以選擇背景顏色和圖標顏色。 默認情況下，圖標為白色，背景為藍色，因此不會發生太多衝突。

最後，在選項左側的欄中，它允許我們定義圖標的邊框是正方形還是相反，我們是否希望最終結果是圓形。

我為您提供以下這些選項的屏幕截圖：

另一方面，在上部，它向我們顯示了正在生成並實時更改的圖標的信息。 也就是說，如果您嘗試使用尺寸和顏色，則會發現此信息始終實時更改：

如您所見，我們還有一個按鈕 獲取圖標，這將在另一個選項卡中向我們顯示PNG中已經生成的圖標，在其中我們可以右鍵單擊+保存，就可以在計算機上所需的文件夾中生成我們生成的平面圖標。

下載平面圖標生成器

如果您想自己嘗試一下（我想就是這樣哈哈），那麼這裡是鏈接：

平面圖標生成器

儘管我不是用Gimp或Inkscape創建按鈕的教程，但我仍然希望它能夠滿足用戶通過電子郵件向我提出的要求，但是我仍然認為它可以滿足您的需求。 實際上，您不能只為鏈接生成按鈕 下載snapchat，但它甚至可以為您的網站或您正在執行的任何操作生成絕大多數圖標或按鈕😀

問候，希望您發現它很有趣。