前言
網頁開發時常需要各種工具來輔助設計與開發，這篇文章整理了我常用的線上工具，涵蓋 HTML、CSS、圖片處理等面向。
HTML 工具
Editorx
- Editorx
- 可以直接參考上面的設計樣式，或直接在上自行設計之後再刻畫面
- 可以配合 RWD 設計不同版面
CSS 工具
Caniuse
- Caniuse
- 查詢各種 CSS 屬性，那些瀏覽器版本支援
Coolors
- Coolors
- 可以在上面直接找顏色列表
- 可以比較顏色對比度
Zhangxinxu
- Zhangxinxu
- 顏色轉換成 CSS filter
Uiverse
- Uiverse
- 可以找到各種 CSS 動畫效果
圖片工具
SVG 圖示
圖片壓縮
- Squoosh：可以壓縮圖片
製圖工具
Excalidraw
- Excalidraw
- 可以畫示意圖
Tinysnap
- Tinysnap
- 用來美化截圖，可以用在 Chrome 插件