設計基礎
查閱色彩、字體、版面與 Token，建立一致的設計基準。
查看設計基礎 →Token 對照表 →DESIGN RESOURCES
設計資源
從設計基礎、元件到畫面樣板，找到可參考與使用的設計資源。
選擇設計資源
站內資源可直接使用；Figma 的精確位置與對應狀態分別標示。
UI 元件庫
查看按鈕、輸入欄、表單與資訊列表的樣式及使用規則。
瀏覽 UI 元件 →查看來源對照 →畫面樣板
操作顧客查詢、權益列表、編輯表單及經辦案件列表。
查看畫面樣板 →使用情境與 Wireframe →圖標資源
搜尋圖標、預覽色彩，取得原始 SVG 或完整下載包。
瀏覽圖標 →下載 SVG 圖標包 ↓Figma 設計來源
先開啟既有設計檔；個別元件、基礎樣式與畫面節點核對後，再提供精確入口。
既有來源 · 待核對
Esun-internal-design-sys
目前多個元件共用此節點，尚未完成個別元件與樣板的精確對應。
- 設計位置
- Esun-internal-design-sys／Page、Component Set 待確認
- 資源版本
- 待來源維護者確認
- 檢視權限
- 依 Figma 檔案權限；無法開啟時，請向檔案擁有者或團隊管理員申請。
- 離線設計檔
- 尚未提供 .fig 下載檔
開啟既有 Figma 設計檔 ↗開始使用
依資源的確認狀態，選擇檢視、使用或下載。
- 01
找到對應資源
依基礎、元件、樣板或圖標找到入口，先確認來源與版本。
- 02
確認權限與使用方式
開啟 Figma 檔案；使用元件庫前，向維護者確認正式 Library 名稱及啟用方式。
- 03
對照設計與實作
搭配站內規範、樣板及資料對照，確認使用的元件與狀態。
本頁目前提供既有 Figma 檔案入口與 SVG 下載。正式 Library、精確節點、.fig 檔及版本確認後再補上；網站上有範例，不代表設計來源已完成對應。