Chinese Color Atlas中國傳統色卡下載
158 SCREENED COLORS · 133 FILES
SWATCHES · ASE · TOKENS · PROMPTS

中國傳統色設計資源包

把 158 色來源篩選 clean-source 中國色彩核心直接放進 Figma、Procreate、Photoshop、Tailwind、CSS 和 AI 繪圖工作流。

最推薦

完整設計資源包

133 個按工作流整理的文件，把同一套 158 色來源篩選 clean-source 核心交付到 Figma、Procreate、Adobe、Tailwind、CSS 和 AI 創作流程。從 21 套品牌、婚禮、茶、包裝與 UI 修正版場景配色開始，再把同一套方向交付到設計、代碼與 AI 工具。

包含內容
✓適用於 Photoshop、Illustrator、InDesign 的 Adobe ASE 色板
✓29 個 Procreate .swatches：8 個 clean-core 色系組與 21 套修正版場景配色
✓CSS 變量、Tailwind 主題片段與 W3C DTCG 設計 Tokens
✓用於設計系統搭建的 Figma Variables JSON 導入文件
✓適用於 Midjourney、SDXL、ComfyUI 探索的 158 條來源篩選 clean-source AI 提示詞
✓21 套可用於生產的場景配色，每套含 JSON、CSS、SVG 預覽、Procreate 色板與兩兩對比度報告
✓快速入門 PDF 與 22 頁場景配色目錄
✓含 RGB、HSL、CMYK、可靠度與明確 MIT 來源權利的 158 色 canonical JSON
免費 vs 完整

先試用樣包，再購買完整工作流。

免費資源用於驗證格式、引用和教程；付費包用於真正交付項目、團隊設計系統和批量創作。

•一次購買，下載 ZIP；無需訂閱。
•免費樣包保持公開，方便先測試導入流程。
•完整文件不再作為 `/exports/*` 公開直鏈分發。
色彩數量
公開樣包：8 色熱門樣包、30 色來源支持樣包、立春節氣樣包與 CSS 示例。
完整包：158 色來源篩選 clean-source 核心、21 套修正版場景配色，以及跨設計、代碼和 AI 的同步格式。
設計軟件
免費樣包可測試 Procreate 與 CSS 工作流。
完整包提供 Figma Variables、Adobe ASE 與完整 Procreate 色板。
開發交付
公開 CSS 樣包適合 demo、教程與引用。
完整包包含 CSS variables、Tailwind theme、W3C DTCG tokens 與完整 JSON。
AI 創作
GitHub 提供小版 prompt 預覽。
完整包按色彩、場景、HEX 與文化線索組織 Midjourney / SDXL 提示詞。
158
來源篩選 clean-source 色
133
完整包文件
29
Procreate 色板
21
場景配色報告

你會得到什麼

FIGMA

Figma Variables（完整包）

導入後，可在品牌稿、UI 組件和設計系統中調用同一套 158 色來源篩選 clean-source 核心。

{ "color": { "yanzhi": "#9D2933" } }
SWATCHES

Procreate 色板

按 8 個 clean-core 色系組和 21 套修正版場景配色整理，可直接導入插畫流程。

clean core · 8 hue groups · 21 scenes
DEV

Tailwind / CSS Tokens

給前端項目的 drop-in 資源：CSS variables、Tailwind theme partial、W3C DTCG tokens。

--cc-yanzhi: #9D2933;
'yanzhi': '#9D2933'
AI

AI Prompt Pack

把中文名、拼音、英文名、HEX 與明確來源權利組織成 Midjourney、SDXL、ComfyUI 提示詞。

carmine rouge, Song dynasty palette, #9D2933
適合誰

UI / 品牌設計師

快速建立國潮、新中式、文化品牌的配色系統。

插畫師 / Procreate 用戶

導入 clean-core 色系或場景色板後直接開始插畫、包裝與社媒視覺。

前端工程師

把傳統色變成 CSS、Tailwind 和設計 Tokens。

AI 繪圖用戶

用 158 條來源篩選 clean-source 提示詞和 21 套場景配色控制色彩方向。

使用場景
國潮品牌視覺茶包裝與文創禮盒中式婚禮與節日海報網頁 UI 與設計系統Midjourney / SDXL 提示詞Figma / Tailwind 工作流

如果你只是想復制單個 HEX，免費站點已經夠用；資源包面向的是需要把中國傳統色真正放進設計、開發和 AI 生產流程的人。

選擇資源包

BEST VALUE

完整設計資源包

設計團隊 · 開發者 · AI 創作者

立即購買
$39

一個 ZIP 內含 133 個按工作流整理的文件，全部由 158 色來源篩選 clean-source 核心生成：Figma Variables JSON、ASE、Procreate、網頁 Tokens、AI 提示詞、21 套修正版場景配色、無障礙報告與可視化指南。

✓適用於 Photoshop、Illustrator、InDesign 的 Adobe ASE 色板
✓29 個 Procreate .swatches：8 個 clean-core 色系組與 21 套修正版場景配色
✓CSS 變量、Tailwind 主題片段與 W3C DTCG 設計 Tokens
NEW · $9 LAUNCH

中國傳統節日配色與 Token Kit

品牌設計師 · 設計系統團隊 · 前端開發者

首發價 · 立即購買
$9

圍繞五個傳統節日提供 25 套 clean-source 編輯配色、125 個角色 Tokens 與逐套無障礙報告，並同步交付 JSON、W3C DTCG、CSS、Tailwind CJS 和結構化 Figma Variables 導入數據。

✓覆蓋春節、清明、端午、中秋與重陽的 25 套現代編輯配色
✓125 個角色 Tokens：surface、primary、secondary、accent 與 text
✓Canonical JSON、W3C DTCG JSON、CSS 自定義屬性、Tailwind-compatible CJS 與結構化 Figma Variables 導入 JSON

Procreate 色板包

插畫師 · 數字藝術家

立即購買
$9

60 個按用途整理的文件，包含 29 個可直接導入的 .swatches：8 個 clean-core 色系組與 21 套修正版實用場景色板，並附 SVG 預覽和可視化目錄。

✓8 個 clean-core 色系 .swatches，覆蓋全部 158 個可交付顏色
✓按紅、橙、黃、綠、藍、紫與中性色分組
✓21 套品牌、婚禮、茶、包裝、UI、插畫等場景專屬 .swatches

CSS 與 Tailwind Token 包

前端工程師 · 設計系統構建者

立即購買
$9

同一套 158 色來源篩選 clean-source 核心，以完全同步的 CSS、Tailwind、W3C DTCG、Figma Variables JSON 與 canonical JSON 格式交付。

✓158 個經來源篩選、與 MIT 來源名稱和 HEX 精確匹配的 CSS 自定義屬性
✓帶穩定 token 命名的 Tailwind 主題片段
✓用於設計系統交付的 W3C DTCG 設計 Tokens

AI 提示詞包

Midjourney · SDXL · ComfyUI 用戶

立即購買
$9

面向 Midjourney、SDXL、ComfyUI 的 158 條來源篩選 clean-source 色彩提示詞模板，並附 canonical 色彩數據與 21 套修正版場景配色參考。

✓純文本提示詞庫
✓結構化 JSON 提示詞數據
✓用於視覺方向參考的 21 套修正版 clean-source 場景配色

免費樣包

先試用免費 Figma Base、Procreate 色板、CSS 變量和節氣樣板；完整資源包提供 158 色來源篩選 clean-source 核心、21 套修正版場景配色與 133 個按工作流整理的文件。

Chinese Color Atlas Base · Figma24 色搜索、填色、色卡、場景配色與本地 Variables免費 ↗
cathycolor-hot.swatchesProcreate · 8 個 Chinese Color Atlas 熱門入門色0.3 KB ↓cathycolor-verified.swatchesProcreate · 30 個來源支持色樣包0.9 KB ↓cathycolor-term-lichun.swatchesProcreate · 立春節氣色板樣包0.6 KB ↓cathycolor.css公開 CSS 自定義屬性樣包 · 用於測試工作流27 KB ↓sample-figma-vars.jsonFigma Variables 示例 · 用於測試導入和命名規範sample ↓Figma Community sample file復制免費的 24 色 Figma Variables 社區樣例，包含國潮、宋式與敦煌配色Figma ↓sample-ai-prompts.txt小版 Midjourney、SDXL、ComfyUI 提示詞預覽sample ↓

購買前常見問題

可以商用嗎？

可以。請遵守 ZIP 內的產品許可證，並在內部存檔或團隊交付副本中保留 MIT 上遊許可證、ATTRIBUTION 與 RIGHTS-MANIFEST；不得把完整文件重新打包為競品出售或分發。

Figma 怎麼用？

免費 Base 插件可在 Figma 內完成 24 色搜索、填色、色卡、配色和 Starter Variables；Complete Pack 則提供 158 色來源篩選 clean-source Variables JSON 與跨工具交付文件。

Procreate 怎麼導入？

下載 .swatches 文件後，在 iPad 上用 Procreate 打開即可導入。免費樣包可先測試流程。

和普通色卡網站有什麼區別？

這裡不只是復制 HEX，而是把 158 色來源篩選 clean-source 核心同步為 Figma、Procreate、Tailwind、CSS、AI prompt 和 JSON 工作流。