Electronics ERP — Design System Preview

Typography

字型系統

Display XL
General 48/700

電子供應鏈管理

Display
General 32/600

採購訂單追蹤

Heading
General 22/600

庫存水位分析

Heading SM
General 18/600

供應商評核報表

Body LG
DM Sans 16/400

管理從零件採購到成品出貨的完整供應鏈，即時掌握每張訂單的進度與庫存狀態。

Body
DM Sans 14/400

支援多倉管理、自動補貨建議、BOM 比對、以及供應商交期追蹤系統。

Caption
DM Sans 12/500

最後更新：2026-04-10 14:32 · 審核：採購部王經理

Data
Geist Mono 13/500

PO-2024-0823 IC-7805CT GRM188R71C104 50,000 pcs $2.45

Label
Geist Mono 10/500

PO 編號料號數量單價交期

Color

色彩系統

Electric Cyan

#00E5FF

Violet

#7C3AED

Deep Navy

#07090E

Surface 1

#0D1117

Surface 2

#161B22

Surface 3

#1C2333

Success

#3FB950

Warning

#D29922

Error

#F85149

Info

#58A6FF

Components

元件

按鈕

狀態標籤

處理中已排程已交貨延遲中異常草稿

提示訊息

✓ PO-2024-0823 已全數到貨，50,000 pcs IC-7805CT 入庫完成

⚠ 料號 GRM188R71C104 庫存低於安全水位（剩餘 1,200 pcs / 安全庫存 5,000 pcs）

✗ PO-2024-0831 交期延遲 14 天，供應商回覆：料件短缺

ℹ BOM 比對完成：PCB-A v3.2 需要 47 種零件，3 種需重新採購

表單元素

PO 編號

料號

備註

Spacing & Radius

間距與圓角

間距比例尺 (8px base)

2xs

2px

xs

4px

sm

8px

md

16px

lg

24px

xl

32px

2xl

48px

3xl

64px

圓角比例尺

sm

4px

md

8px

lg

12px

xl

16px

pill

9999px

Shadows & Depth

陰影與層次

Level 1

Border only — Sidebar、inline 元素

Level 2 — Glass

Glassmorphism — KPI 卡片、浮動面板

Level 3 — Card

資料表格、內容卡片

Glow

Active 狀態、hover accents

KPI Cards

KPI 卡片

採購訂單達交率

94.2%

↑ 2.1% vs 上月

今日入庫金額

$128,400

↑ 12.3% vs 昨日

低庫存警示

12

↑ 3 件 vs 上週

待處理 PO

28

↓ 5 件 vs 昨日

Dashboard

儀表板佈局

儀表板

達交率

94.2%

↑ 2.1%

今日入庫

$128,400

↑ 12.3%

低庫存

12

↑ 3

近期採購單

PO 編號	料號	狀態	金額
PO-2024-0823	IC-7805CT	處理中	$24,500
PO-2024-0822	GRM188R71C104	已交貨	$8,200
PO-2024-0819	STM32F103C8	異常	$45,800