調色板匯出器

貼上或匯入一組顏色，立即匯出為 CSS 變數、SCSS、Tailwind 設定、JSON 或 SVG 色票——任何調色板的最後一道工序。

您的顏色

貼上 HEX 值（每行一個，或以逗號／空格分隔）。也接受 rgb() 和 hsl() 格式。

調色板

變數前綴

匯出格式

匯出代碼

所有操作均在您的瀏覽器中執行——貼上調色板，以任何格式複製可供生產使用的代碼。無需註冊，完全免費。

關於調色板匯出器

調色盤匯出工具是任何色彩調色盤的最後一步:貼上一組顏色,即可取得符合專案所需格式的正式可用代碼。它接受每行一個或以逗號、空格分隔的 HEX 數值,也能識別 rgb() 與 hsl() 標記法。

即時產生六種輸出格式:CSS 自訂屬性、SCSS 變數、Tailwind 設定色彩區塊、JSON、SVG 色卡以及純文字 HEX 清單。可設定的變數前綴能讓產生的名稱與你的程式碼庫保持一致,每種格式都能複製到剪貼簿或下載為檔案。

一切都在你的瀏覽器中執行──你貼上的顏色絕不會傳送到任何地方。它能自然地與其他調色盤工具搭配使用:在別處擷取或產生調色盤,貼到這裡,即可立即取得樣式表、框架或設計流程所需的確切代碼片段。

HEX 數值(有無 # 符號皆可)、rgb() 與 hsl() 標記法都能被識別。你可以混用格式,並以換行、逗號或空格分隔顏色──解析器會挑出每一個有效的顏色,忽略其餘內容。

是的。解析與代碼產生完全在你的瀏覽器中進行,因此工具免費使用,不需要帳號、不需要點數,也不限制調色盤或匯出次數。

貼上你的顏色,選擇「Tailwind 設定」格式,再將產生的區塊複製到你 Tailwind 設定檔的顏色區段。變數前綴設定會控制每種顏色所使用的鍵名。

不會。顏色只留在你的瀏覽器分頁中──解析或匯出過程中不會發出伺服器請求,離開頁面後也不會保存任何資料。

它會產生一個小型 SVG 檔案,將調色盤中的每個顏色顯示為附標籤的色塊。這對於在文件、README 檔案或設計交付頁面中嵌入視覺化調色盤參考非常有用,不需要另外截圖。