標籤: SVG 頁1
教學

無障礙(Accessible) SVG 實踐方法

說明在 SVG 實踐無障礙(Accessible)的設定方法。
網路資源

Loaders- 提供開發者免費的讀取動畫圖示，使用 CSS 與 SVG 動畫與且支援 React 使用

Loaders 提供給開發者免費的讀取動畫圖示，使用 CSS 與 SVG 動畫與且支援 React 使用。
網路資源

LottieFiles- 收錄透過 After Effect 外掛 bodymovin 轉出來的動畫網站

之前跟大家介紹過 bodymovin 這個可以把 After Effect 的動畫轉出來給網頁用的外掛，而他們官方也有提供使用者分享各自製作的動畫的網站，可以到上面找找有沒有喜歡的動畫效果。
網路資源

designstripe- 免費的線上插圖繪製工具

designstripe 是一個免費的線上插圖繪製工具，即使不會繪圖軟體也可以使用，免費方案可以下載 png 或 jpg 圖片，也可以付費下載向量格式的圖片。
網路資源

SVG.js- 輕量且方便的 SVG 動畫函式庫

SVG.js 提供了比較簡潔的方法讓我們可以方便地在頁面上使用 SVG 及製作動畫。
網路資源

bbburst- 線上 SVG 圖片產生器

bbburst 是一個線上 SVG 圖片產生器，只要點選圖片就能隨機產生下一組圖片。
網路資源

IFN- 日本免費圖示下載，可選擇 png 或 SVG 格式

IFN 是一個日本人製作的免費圖示資源，可選擇 png 或 SVG 格式下載。
網路資源

SVG Viewer- 線上檢視還有最佳化 SVG 的工具，亦可轉檔出 SVG 或 React 格式

SVG Viewer 是一個可以線上檢視還有最佳化 SVG 的工具，亦可轉檔出 SVG 或 React 格式。
網路資源

Crypto Logos- 收錄許多高畫質加密貨幣 logo 的網站

Crypto Logos 是一個收錄許多高畫質加密貨幣 logo 的網站，看了這網站才發現加密貨幣的種類還真多。
網路資源

Squircley- 線上 SVG 圖片產生器，可製作方形、圓形或圓角的方形

Squircley 是一個線上 SVG 圖片產生器，可製作方形、圓形或圓角的方形，只要透過簡單的設定就能輸出圖形。
網路資源

Svg Wave- 製作波浪形狀的線上產生器，可輸出 SVG 或 png 格式

Svg Wave 一個製作波浪形狀的線上產生器，可輸出 SVG 或 png 格式。
網路資源

Radix Icons- 小型免費 icon 下載，可選擇 SVG, Sketch 與 Figma 等格式

Radix Icons 是一個收錄小型免費 icon 的網站，可選擇 SVG, Sketch 與 Figma 等格式下載。
網路資源

System UIcons- 專門為系統及產品開發設計的免費 icon

System UIcons 是一套專門為系統及產品開發設計的免費 icon，可選擇直接下載 SVG 檔案或使用 SVG code 嵌入網站。
網路資源

Basicons- 線條類型的免費 icon 圖示

Basicons 是一組線條類型的免費 icon 圖示，可以選擇下載 SVG 或複製 SVG 的 code 回去使用。
網路資源

Icons8 Illustrations- 大量免費插畫下載，提供 SVG 與 PNG 格式

Icons8 Illustrations 是一個收錄了大量插畫的網站，提供 SVG 與 PNG 格式讓人免費下載。
網路資源

iconmonstr- 超過 4000 個免費圖示下載，提供 SVG、PNG、EPS等格式

iconmonstr 提供了超過 4000 個免費圖示，可以選擇 SVG、PNG、EPS等格式下載。
網路資源

Blush- 可線上調整、預覽的插畫產生器

Blush 是一個提供線上調整、預覽的插畫產生器服務，製作完後可下載較低解析度的圖片，或是選擇付費升級下載高解析度或 SVG 檔。
網路資源

Storyset- 可自訂樣式及動畫的免費插畫集

Storyset 是一個可自訂樣式及動畫的免費插畫集，點選有興趣的插畫，就可以設定想要顯示的元素、顏色及動畫，設定好就可以直接下載免費使用。