UD5工具箱
渐变（Gradient）：渐变是指在两个或多个颜色之间按照一定规则进行平滑过渡的视觉效果。在CSS中，渐变被实现为background-image的一种特殊值，本质上是浏览器渲染的像素图像。渐变不占用额外的网络请求，体积轻量且支持无限缩放，是网页设计中最常用的视觉效果之一。常见的渐变类型包括线性渐变、径向渐变和锥形渐变。
线性渐变（Linear Gradient）：线性渐变沿一条直线方向在颜色之间进行过渡。CSS语法为linear-gradient(direction, color1, color2, ...)。方向可以是to top、to right等预设方向，也可以是具体的角度值如45deg。线性渐变是使用最广泛的渐变类型，常用于页面背景、按钮、卡片、Banner等元素。
径向渐变（Radial Gradient）：径向渐变从一个中心点向外辐射扩散，颜色在同心圆或同心椭圆上进行过渡。CSS语法为radial-gradient(shape size position, color1, color2, ...)。形状可以是圆形（circle）或椭圆形（ellipse）。径向渐变适合创建聚光灯、光晕、圆形高光等效果。
色标（Color Stop）：色标是渐变中定义颜色和位置的关键节点。每个色标包含一个颜色值和一个可选的位置百分比。例如linear-gradient(to right, #ff0000 0%, #0000ff 100%)中，#ff0000 0%和#0000ff 100%分别是两个色标。色标位置决定了颜色过渡的节奏和分布，是控制渐变效果精细度的核心参数。
色彩量化（Color Quantization）：色彩量化是将图像中大量的颜色映射为少数几种代表色的算法过程。本工具使用色彩量化技术从图片的数百万像素中提取出2至6个最具代表性的主色调。常用的量化算法包括中位切分法、K-means聚类、八叉树量化等。本工具采用的是基于颜色空间分桶与聚类合并的混合策略。
Canvas API：Canvas API是HTML5提供的图形绘制接口，允许通过JavaScript在网页上动态创建和操作位图。本工具利用Canvas的getImageData方法读取上传图片的像素RGB数据，这是色彩分析的基础步骤。Canvas API在所有现代浏览器中均有良好支持。
HEX颜色值：HEX是用十六进制表示颜色的方式，格式为#RRGGBB（6位）或#RRGGBBAA（8位含透明度）。例如#FF5733表示红色分量为255、绿色分量为87、蓝色分量为51的暖橙色。HEX是CSS中最常用的颜色表示格式之一，也是本工具主要使用的颜色输出格式。
颜色空间：颜色空间是组织和表示颜色的数学模型。常见的颜色空间包括RGB（红绿蓝，用于屏幕显示）、HSL（色相-饱和度-亮度，更符合人眼感知）、CMYK（青-品红-黄-黑，用于印刷）。本工具在内部处理中使用RGB空间进行像素读取，同时在聚类阶段参考了色彩感知距离以提升提取结果的视觉合理性。
Tailwind CSS：Tailwind CSS是一个实用优先（utility-first）的CSS框架，通过预定义的工具类名实现快速样式开发。在渐变方面，Tailwind提供了bg-gradient-to-r、from-[color]、to-[color]等类名。本工具支持生成Tailwind格式的渐变代码，方便使用该框架的开发者直接集成。
SCSS变量：SCSS是CSS的预处理器扩展，支持变量、嵌套、混入等高级特性。使用SCSS变量格式输出渐变时，每个色标的颜色会被定义为独立的Sass变量（如$gradient-color-1），便于在大型项目中集中管理和动态修改渐变配色。