Tailwind Ink

Tailwind Ink 是一个经过 Tailwindcss 颜色训练的 AI 调色板生成器。

注意： 这个工具是作为一个副项目开发的，代码还比较混乱。

它是如何工作的？

它使用两个神经网络来预测完整的调色板。第一个，models/shadesModel.js 根据给定的输入颜色垂直预测从 50 到 900 的所有色调。第二个，models/nextModel.js 根据给定的色调水平预测所有颜色。

模型

当使用 models/wrapper/wrapper.js 导入模型时，它们会返回一个接受 HEX 格式颜色的函数，并返回一个包含所有色调 RGB 值（范围从 0 到 1）的平面对象。将这些值乘以 255 将得到有效的颜色。

import rawShades from './models/shadesModel'
import rawNext from './models/nextModel'
import modelWrapper from './models/wrapper/wrapper'

let nextModel = modelWrapper(rawNext);
let shadesModel = modelWrapper(rawShades);

let shades = shadesModel('#0064FF'); // shade-50: r0.5, g0.5, b0.5; shade-100: r1, g1, b1 ... 

工具

根据用户选择的颜色，shadesModel.js 创建一组初始的 50-900 完整色调。选择的颜色也会传递给 nextModel.js，它返回调色板的下 9 种颜色。然后，这 9 种颜色再次使用 shadesModel.js 分别转换为 50-900 色调。

开发

下载仓库并运行：

npm install
npm run watch

训练模型

打开 shades.html 或 next.html 时，模型训练会自动开始。打开浏览器控制台查看训练进度。训练完成后，你可以在同一页面上选择一种颜色并尝试模型的结果。你也可以在终端中输入以下命令来训练模型：

clear
node src/training/next.js
// 或
node src/training/shades.js

模型调优

要调优模型，你可以调整 training/shades.js 和 training/next.js。如果你在浏览器中进行训练，记得保持 npm run watch 运行。

保存模型

训练结束后，控制台会输出一个大型推理函数。你可以将它复制粘贴到 models/nextModel.js 或 models/shadesModel.js 中。记得保持 npm run watch 运行，否则模型将无法在 index.html 中导入。