如果平常的工作和設(shè)計有關(guān)，對于色彩應(yīng)該也會有一定的敏感度，若對顏色沒那么熟悉，其實(shí)網(wǎng)絡(luò)上有不少配色工具可以使用，通常會以不同方式產(chǎn)生調(diào)色盤，讓使用者在各種顏色里快速選擇取用色碼，有助于降低色彩選擇的難度和時間。之前推薦過一些以特定主題收錄的色碼表，像是 NIPPON COLORS 就有代表日本傳統(tǒng)的 250 種顏色：

BrandColors 收錄世界知名品牌使用的顏色信息：

本文要介紹的「Tailwind.ink」是一個很有趣的色彩工具，以 AI 人工智能產(chǎn)生調(diào)色盤，依照說明，這個工具利用 Tailwindcss（CSS 框架）訓(xùn)練程序?qū)W習(xí)，當(dāng)用戶開啟網(wǎng)站、選擇特定色調(diào)，Tailwind.ink 就會依照該色碼產(chǎn)生 100 種相關(guān)色，像是偏向特定顏色或是加入深淺的漸變色，全部列在網(wǎng)頁中就能輕松找到更合適的色碼。

Tailwind.ink 也是一項(xiàng)開源項(xiàng)目，如果需要可下載源碼，依照說明調(diào)整為更符合自己需求的色彩產(chǎn)生器。

對于在選色時可能會遇到「顏色再深一些」或「偏向黃綠一些」這類情境，Tailwind.ink 能讓使用者在配色時有更多更為彈性的組合方式，如果你透過色彩工具依然找不到適合的顏色，總是會有一點(diǎn)點(diǎn)差異，可以試試看以類神經(jīng)網(wǎng)絡(luò)訓(xùn)練出來的配色服務(wù)，可能更容易擊中你的需求。

Tailwind.ink

網(wǎng)站鏈接：https://tailwind.ink/

使用教學(xué)

開啟 Tailwind.ink 預(yù)設(shè)會是藍(lán)色為主要顏色，右側(cè)會顯示依照該顏色預(yù)測出來的調(diào)色盤。

在左上角的調(diào)色工具選擇你想使用的主顏色后右側(cè)色彩會實(shí)時更新，每個顏色名稱下方會有對應(yīng)的十種深淺變化，當(dāng)然你也可以直接輸入特定色碼，套用你輸入的色碼來看看 Tailwind.ink 會產(chǎn)生哪些顏色。

蠻有趣的是這些顏色組合都呈現(xiàn)一定規(guī)則的變化，無論是從淺到深、或是不同的色系，都能在單一頁面進(jìn)行預(yù)覽或是比較，點(diǎn)選左上角的「Aa」可以在色塊上顯示文字，檢查該背景顯示深淺文字是否有良好的可閱讀性和辨識性。

值得一試的三個理由：

• 使用 AI 類神經(jīng)網(wǎng)絡(luò)、依照主顏色產(chǎn)生 100 種相關(guān)顏色
• 依照深淺和不同色調(diào)直接在網(wǎng)頁上預(yù)覽比較
• 產(chǎn)生 HEX 色碼可復(fù)制后取用顏色