不用來回切換軟體,就能整理設計與前端所需數值,包含色彩格式、WCAG 對比、流體排版、漸層、長寬比與 CSS 單位。
計算圖片與影片的長寬比。
在 HEX、RGB、HSL 等格式間轉換顏色。
從一個主色產生明暗色階與 CSS 變數。
調整參數並即時產生 box-shadow CSS。
檢查兩個顏色之間的 WCAG 對比值。
以視覺化方式編輯 CSS cubic-bezier 緩動曲線。
視覺化建立 CSS Grid 或 Flexbox 版面並複製程式碼。
預覽圖片在常見色覺差異下可能呈現的樣子。
依基準字級在 px 與 rem 之間換算。
產生用於流體排版的 CSS clamp() 值。
建立排版字級比例並匯出 CSS 變數。
建立含多個顏色停駐點的 CSS linear-gradient。