色盲友好调色板 - 定性数据配色推荐
展示几组在各类色盲下仍可区分的定性数据配色方案,含Hex码。
UD5工具箱
输入HEX颜色代码,快速找到最接近的PANTONE®色号,支持Delta E精确匹配排序
您输入的颜色
最佳Pantone匹配
| # | 色样 | Pantone色号 | 名称 | Delta E | 相似度 |
|---|
输入HEX颜色代码开始查找
支持6位或3位HEX格式,如 #FF5733 或 #F53
展示几组在各类色盲下仍可区分的定性数据配色方案,含Hex码。
编写正则表达式,在文本中用不同颜色高亮整个匹配和每个捕获组。
在Oklch色彩空间中生成均匀色阶、类比色和互补色方案,确保视觉一致性。
支持任意格式颜色输入,计算对比度并显示WCAG 2.1各级别通过情况,含颜色建议。
可视化Flexbox容器和子项的所有属性及选项,鼠标悬停预览效果。
可视化浏览 Tailwind CSS 所有内置颜色的 50-950 色阶,点击复制类名或色值。
随机推荐视觉和谐的标题和正文字体配对,并显示预览和导入代码。
从一个基色或图片提取的颜色,自动生成 50-950 的色阶并导出为 Tailwind CSS 配置。
拖拽基色指针,自动计算互补、近似、三等分等七种和谐配色方案,复制十六进制值。
连接任意 GraphQL 端点,提供智能补全、文档浏览和查询执行,类似于 GraphiQL 界面。
展示Material Design全部色阶,点击复制HEX代码,提供主色和强调色搭配参考。
在网页顶部添加半透明暖色或暗色覆盖层,调节不透明度,降低屏幕刺眼感。
基于Bcrypt算法的密码安全哈希,可调节工作因子,适合存储用户密码时的单向加密演示。
上传两张图片,实时切换并预览正片叠底、滤色、叠加等多种混合模式效果。
展示 CSS 系统颜色关键字(如 CanvasText, LinkText)在明暗模式下的实际渲染值。
为图片添加类似胶片漏光的红黄色调渐变或光晕效果,营造怀旧氛围。
在线颜色选择器,支持从色盘取色、HEX/RGB/HSL颜色值转换,提供调色板功能,方便前端设计取色。
在布满干扰物的图片中寻找并点击目标物品,记录用时。
在页面上叠加可拖拽的半透明网格线,辅助网格布局对齐。
可视化选择操作(访问、点击、断言等),自动生成 Cypress 测试代码。
编写带有伪类的选择器,实时高亮匹配的HTML元素,探索现代CSS选择器的能力。
拖放 lcov.info 文件,以颜色标示每行代码的覆盖状态。
拖拽两控制点精细微调CSS `cubic-bezier()` 曲线并对比预设函数效果。
选择大调或小调,显示每个音级上构建的自然三和弦和七和弦的组成。
应用 contain 的各种值(layout, paint, size),直观对比开启前后渲染和布局的变化。
选择任意基色,自动计算互补色、分裂互补及三分色,提供十六进制代码,一键复制。
加载Lottie动画JSON文件,播放并控制速度、方向,预览动效效果。
通过加权Voronoi点算法将图片转换为类似针笔画的黑白点描艺术效果。
创建带有复选框或标签的多选下拉列表,支持删除已选项,键盘可全控。
编写Brainfuck代码,以可视化的方式步进执行,观察活动纸带和指针。