专业颜色转换工具2.0网站源码

源码简介：

专业颜色转换工具2.0    专为设计师、前端开发者或任何需要处理颜色的用户设计。它完全运行在浏览器中（纯静态HTML/CSS/JavaScript），无需后端服务，打开即可使用。

主要功能模块：

1. 智能颜色搜索/转换框：

支持多种输入方式：颜色中文名（如“深红色”）、英文名（darkred）、HEX（#ff0033）、RGB（244,55,66 或 rgb(244,55,66)）。

点击“转换”按钮或按回车键，即可将输入的颜色解析并应用到整个工具。

内置了丰富的颜色名称映射表（包含常见颜色的中英文名称）。

2. 颜色预览与输入区（左侧）：

大尺寸颜色预览块：实时显示当前颜色，点击它可打开系统原生颜色选择器。

四种颜色模式输入框：

HEX（十六进制）

RGB（红绿蓝）

HSL（色相、饱和度、明度）

CMYK（青、品、黄、黑）

每个输入框右侧带有复制按钮，点击可快速复制对应颜色值，并有动画反馈。

3. 色相/饱和度/明度滑块（右侧）：

三个精确的滑块分别控制 Hue（色相）、Saturation（饱和度）、Lightness（明度）。

滑块上方显示当前数值，下方有刻度参考。

拖动滑块会实时更新所有颜色值、预览块、以及下方所有色板。

4. 常用颜色预设（15色自适应网格）：

一行15个常用颜色色块（红、橙、黄、绿、蓝、紫、粉、灰、黑、白、青、靛、棕、 Cyan、Amber）。

点击任意色块，立即将该颜色应用到整个工具。

5. 色调与暗调（13阶渐变）：

基于当前颜色自动生成：

Tints（加白渐变）：从当前颜色逐渐混合白色，共13阶。

Shades（加黑渐变）：从当前颜色逐渐混合黑色，共13阶。

每个小色块均可点击，将该阶颜色设为主色。

顶部显示最浅色和最暗色的HEX值。

6. 配色方案生成器：

根据当前颜色自动计算并显示6种专业配色方案：

互补色

类似色

分裂互补色

三元色

四色

相似色

每种方案以2～5个色块展示，点击任一色块即可应用该颜色。