02 / THEME INFRASTRUCTURE

Antwind

讓 Ant Design 與 Tailwind CSS 共用同一份 design token 與 theme scope，而不是維護兩套色彩真相。

GitHub ↗

Antwind 不是重新發明 UI Library，而是在兩個既有生態系之間建立穩定接縫：保留各自優勢，同時收斂主題來源與使用方式。

THE PROBLEM

Ant Design Token 與 Tailwind Theme 各自維護時，同一個品牌顏色會存在兩份定義；主題切換、Dark Mode 與局部覆寫也容易逐漸累積不一致。

THE ABSTRACTION

以 CSS Variables 建立共同的 palette 與 Theme Schema，AntwindThemeProvider 再負責注入 theme class、Dark Mode 語意與 root element。開發者維護一份 Theme，兩套 UI 系統從同一來源更新。

SCOPED THEMING

Provider 可指定 rootEl，主題不必只能套在 document.body。這讓不同區塊或嵌入式介面能擁有獨立 theme scope，同時維持與 Ant Design 元件一致的 Token 映射。

INTEGRATION HARNESS

專案以 pnpm、Turborepo 分離核心套件與 Demo；Demo build 能同步 Ant Design 官方元件案例，讓整合不是只靠少量手寫範例驗證。