Brand · Flow

brand/、Apps/FlowMac/AppIcon.icon 與網站的 favicon.svg、apple-touch-icon.png、og.png 皆由 scripts/generate-brand.py 產生；修改幾何或配色時改腳本後重跑，不直接編輯輸出檔，也不在 Icon Composer 修改 AppIcon.icon。

需要 brew install svgo librsvg；og.png 的文字需安裝 Inter Display 與 Inter，中文用系統的 PingFang TC。

scripts/generate-brand.py                # 重新產生全部輸出，SVG 以 SVGO 最佳化
scripts/generate-brand.py --png tmp/brand # 另輸出 brand/ 的 PNG 預覽
uv run --with fonttools scripts/generate-brand.py --wordmark InterDisplay-SemiBold.otf  # 重描 wordmark

`brand/`	用途
`flow-mark.svg`	主圖形：音量條輪廓構成播放鍵
`flow-mark-small.svg`	32 px 以下的像素對齊版
`flow-wordmark.svg`	Wordmark 外框（Inter Display SemiBold，OFL-1.1）
`flow-lockup.svg`／`flow-lockup-ink.svg`	圖形加 wordmark，深底／淺底用
`flow-appicon.svg`	非 Liquid Glass 的平面 App 圖示，供網站與 DMG
`flow-sheet.svg`	構造、尺寸、lockup 與播放狀態總覽
`flow-mark.json`	主圖形幾何，供網站 Logo（`website/src/components/site/logo.tsx`）

名稱	色碼	用途
INK	`#0B0B0C`	底色
LIGHT	`#F4F1EA`	圖形與文字
SIGNAL	`#FF5A1F`	唯一強調色，播放點
TRACE	`#5FD4FF`	標註與構造線，少量使用