SVG噪声与纹理生成器
SVG噪声与纹理生成器 使用SVG feTurbulence滤镜在浏览器中直接创建有机的颗粒噪声和湍流云纹理。拖动滑块，调整种子值，选择色调，实时观察纹理变化。可导出为内联SVG、CSS背景图像数据URI，或一个可重复使用的SVG滤镜，用于应用...
试用该工具 »
不喜欢广告？ 去 无广告 今天
颜色工具
广告 移除？
渐变文本CSS生成器
渐变文字 CSS 生成器 通过多色渐变效果设计引人注目的文字效果，并一键生成可直接用于生产的 CSS 代码。选择颜色，选择线性或径向渐变，实时预览将自动更新，然后将代码片段直接复制到您的样式表中。使用方法：输入您希望预览的示例文字，设置字体大小和粗细...
试用该工具 »开放图谱社交卡片图片生成器
Open Graph 社交卡片图片生成器 在浏览器中设计像素级精确的社交分享图片，适用于 Open Graph、Twitter 卡片、LinkedIn 和 Facebook。输入标题、描述和网站名称，选择布局和主题，然后下载 PNG、JPG 或 WebP 格式图片，尺寸完全符合各平台要求——无需设计工具或上传...
试用该工具 »CSS极简风格生成器
CSS 新物质风格生成器 创建柔和、立体的“新物质风格”（neumorphic）UI 元素，无需手动调整两个相反的盒阴影。选择基础颜色，选择形状（平面、凹陷、凸起或压印），拖动距离、强度、模糊和光照角度的滑块，然后将生成的 CSS 代码直接复制到您的项目中。使用方法：选择背景颜色。颜色相同...
试用该工具 »颜色调色与色调生成器
颜色调色与色调生成器 选择一个十六进制或RGB颜色，立即获得10个色调（将原色与白色混合）和10个深色（与黑色混合）的视觉样本。点击任意样本可复制其十六进制代码，或导出完整的颜色集作为CSS自定义属性、SCSS变量、JSON或纯十六进制列表。...
试用该工具 »Tailwind CSS 颜色渐变生成器
Tailwind CSS 颜色渐变生成器：粘贴一个十六进制颜色值，即可立即获得完整的 Tailwind 风格 50 到 950 的配色方案，且颜色变化在人眼看来是均匀平滑的。该渐变基于 OKLCH 颜色空间构建，因此每个颜色层级在视觉上都呈现出均匀的亮度变化，而非简单的 RGB 或 HSL 空间中的线性下降。...
试用该工具 »像素艺术画布及CSS导出
像素艺术画布 & CSS导出 在浏览器中直接绘制清晰的8位风格精灵，并将其导出为纯CSS盒阴影艺术、可缩放的SVG、位图PNG或便携式JSON文件。画布尺寸可从8×8扩展到64×64，内置经典调色板（NES、Game Boy、PICO-8、CGA、Commodore 64、Sweetie 16），并提供绘画、橡皮擦等功能...
试用该工具 »SVG 路径可视化编辑器
SVG 路径可视化器与编辑器：粘贴任意 SVG 路径的 d 属性，即可实时查看其渲染效果。该工具将每条命令分解为其参数和绝对终点，并在预览图上绘制贝塞尔控制点手柄，同时以可配置精度将路径中的绝对坐标与相对坐标重新编写。该工具专为 SVG 开发人员设计 ...
试用该工具 »CSS Flexbox 生成器（可视化）
CSS Flexbox 生成器（可视化）可视化设计 Flexbox 布局，并复制可直接用于生产的CSS代码。您可以实时调整方向、对齐、包裹、间距以及每个项目的覆盖设置，而实时预览会立即更新。无需猜测，无需使用Chrome开发者工具——只需选择您需要的容器行为，观察其渲染效果，即可获取生成的规则。使用方法 选择一个 flex-direction（行、...
试用该工具 »README 标签生成器（Shields.io 风格）
README徽章生成器 该README徽章生成器可在浏览器中直接生成与Shields.io风格完全一致的像素级徽章。您可以选择预设样式或自定义标签和消息，选择颜色及样式（扁平、扁平方形、为徽章设计或塑料风格），并获得可直接用于Markdown、HTML、SVG和数据URL的输出内容。无需外部API调用，无需网络依赖，无需损坏的徽章...
试用该工具 »CSS关键帧动画生成器
CSS关键帧动画生成器 可通过实时预览可视化创建CSS @keyframes动画。可选择10种流行预设，如弹跳、抖动、脉动、淡入、滑入、旋转、摆动、橡胶带效果、闪光和摇晃，或从零开始构建自定义关键帧动画。可调整持续时间、缓动函数、迭代次数、方向和填充模式，然后复制……
试用该工具 »CSS 特异性计算器
CSS 特异性计算器 CSS 特异性计算器可帮助您确定任意 CSS 选择器的确切特异性得分。理解特异性对于调试 CSS 冲突和编写可维护的样式表至关重要。输入一个或多个选择器，即可立即查看它们的 (a,b,c) 得分，并进行并列对比。使用方法：每行输入一个 CSS 选择器...
试用该工具 »CSS Clip-Path 生成器
CSS Clip-Path 生成器 使用直观的拖放编辑器可视化创建 CSS clip-path 形状。构建多边形、圆形、椭圆形和内插形，然后将生成的 CSS 直接复制到您的样式表中。 如何使用 选择形状类型或从预设模板开始。拖动控制点以在预览画布上直观地调整形状。该...
试用该工具 »Color Palette Extractor
颜色调色板提取器 上传任何图像并立即提取其主色调。使用中值切割量化来识别最突出的颜色，为您提供准确的 HEX、RGB 和 HSL 值以及使用百分比。如何使用 通过拖放或单击上传区域来上传图像。该工具会自动分析图像 ...
试用该工具 »
