🎨 设计工具

CSS 3D 变换生成器

可视化调节 rotateX / rotateY / rotateZ / perspective，生成 CSS 3D 变换代码

CSS Flexbox 生成器

可视化调节 Flexbox 布局并生成 CSS 代码

CSS Grid 生成器

可视化生成 CSS Grid 网格布局代码

CSS Loading 生成器

一键生成常用的 CSS 加载动画代码

CSS 下划线动画生成器

可视化生成鼠标悬停时下划线展开动画的 CSS 代码

CSS 下划线生成器

可视化生成 CSS 文字下划线样式代码

CSS 主题生成器

生成完整的 CSS 主题变量，包含颜色、字体、间距、组件

CSS 光标预览

预览所有 CSS cursor 光标样式，点击复制代码

CSS 关键帧动画生成器

可视化生成 CSS @keyframes 动画代码

CSS 分隔线生成器

可视化生成各种 CSS 分隔线样式（实线、虚线、渐变、波浪等）

CSS 加载动画生成器

可视化生成多种 CSS 加载转圈动画，可调尺寸与颜色

CSS 动画生成器

可视化生成 CSS @keyframes 动画代码

CSS 卡片生成器

可视化生成各类 CSS 卡片样式，含图片、标题、标签与按钮

CSS 压缩

压缩 CSS 代码，移除注释和冗余空白

CSS 变量生成器

生成 CSS 自定义属性（变量）代码，含色板、间距、字号

CSS 噪点背景生成器

用 SVG feTurbulence 生成纯 CSS 噪点背景，可调颗粒与颜色

CSS 圆角生成器

可视化调节 border-radius，生成 CSS 代码

CSS 复选框生成器

可视化生成自定义样式的复选框和开关按钮

CSS 开关按钮生成器

可视化生成 iOS 风格 CSS 开关按钮，可调尺寸、颜色与圆角

CSS 徽章生成器

生成圆角徽章、标签样式，适合状态标识

CSS 悬停效果生成器

可视化生成常见的 CSS hover 悬停效果代码

CSS 手风琴生成器

用 <details> 生成无 JavaScript 的手风琴折叠面板

CSS 按钮生成器

可视化生成 CSS 按钮样式，含悬停效果

CSS 提示框生成器

可视化生成悬浮提示框 CSS 代码

CSS 文字描边生成器

生成 CSS 文字描边代码，支持多重描边

CSS 文字环绕生成器

可视化生成 CSS shape-outside 文字环绕代码

CSS 文字阴影生成器

可视化生成 text-shadow 阴影效果

CSS 新拟态生成器

可视化生成 Neumorphism 新拟态风格 CSS，支持凸起与凹陷

CSS 时间线生成器

可视化生成垂直时间线 CSS 代码，可编辑节点内容

CSS 有机形状生成器

可视化生成 CSS 有机形状（Blob），可随机与微调圆角

CSS 标签页生成器

用纯 CSS（:checked）生成无 JavaScript 的标签页切换

CSS 模态框生成器

用 :target 或 dialog 生成无 JS 模态框样式代码

CSS 水波纹效果

可视化生成 Material 风格的水波纹点击效果 CSS 代码

CSS 混合模式生成器

可视化预览并生成 CSS mix-blend-mode 混合模式代码

CSS 渐变边框生成器

生成渐变边框效果，无需图片

CSS 滚动捕捉生成器

可视化生成 CSS scroll-snap 滚动捕捉代码

CSS 滚动条生成器

可视化生成自定义滚动条样式代码

CSS 滤镜生成器

可视化调节 CSS filter 属性，生成代码

CSS 瀑布流生成器

生成纯 CSS 瀑布流布局代码，可调列数与间距

CSS 缎带生成器

可视化生成角落缎带/角标 CSS 代码

CSS 背景图案生成器

可视化生成纯 CSS 背景图案，支持条纹、点阵、方格、斜纹等

CSS 裁剪路径生成器

可视化生成 clip-path 图形裁剪代码

CSS 跑马灯生成器

可视化生成 CSS 无缝滚动跑马灯代码，支持多种方向与速度

CSS 边框生成器

可视化生成 border 边框样式代码

CSS 过渡动画生成器

可视化生成 transition 过渡效果代码

CSS 进度条生成器

可视化生成 CSS 进度条代码，可调颜色、高度、圆角与样式

CSS 阴影生成器

可视化调节 box-shadow，生成 CSS 代码

CSS 面包屑生成器

可视化生成面包屑导航样式，支持多种分隔符

CSS 骨架屏生成器

可视化生成骨架屏（Skeleton Screen）加载占位样式

SVG 优化器

移除 SVG 中冗余的元数据、注释、空白，减小体积

SVG 图标库

精选常用 SVG 图标，可自定义颜色和尺寸下载

二维码生成器

输入文本或网址生成二维码，可调尺寸

多重阴影生成器

组合多层阴影，生成精致的 box-shadow 代码

宽高比计算器

计算和调整宽高比，支持常用比例

批量二维码生成器

批量生成多个二维码，每行一个内容

文字头像生成器

输入文字生成精美头像，支持多种形状与配色

条形码生成器

生成 Code128、EAN-13、UPC 等常见条形码，支持 PNG/SVG

渐变文字生成器

生成 CSS 渐变文字效果代码

渐变生成器

可视化生成 CSS 线性渐变代码

玻璃卡片生成器

生成毛玻璃卡片效果的 CSS 代码

玻璃拟态生成器

生成 Glassmorphism 风格的 CSS 代码

网格渐变生成器

生成多层 radial-gradient 叠加的网格渐变 CSS

色彩调和生成器

基于色彩理论生成多种专业配色方案

色盲模拟

模拟不同色盲类型下的颜色视觉效果

配色方案生成器

基于基色生成互补、类似、三角等配色

随机颜色生成器

批量生成随机颜色，支持多种色彩空间

霓虹文字生成器

生成霓虹灯风格的 CSS 文字发光效果

颜色名称查询

根据 HEX 查找最接近的颜色名称

颜色对比度检查

检查前景与背景色的 WCAG 对比度

颜色格式转换

HEX、RGB、HSL、HSV、CMYK 颜色互转

颜色混合器

按多种混合模式混合两个颜色，实时预览并复制结果

颜色选择器

拾取颜色并转换 HEX、RGB、HSL 格式