代码、数据与二维码工具

点阵网格生成器

调整点阵密度和外观,在本地预览,然后复制可直接使用的 CSS 背景。

优先本地处理无需注册隐私说明 ↗

列数和行数限制为 2–40,点为 1–8px,间距为 4–64px。

使用步骤

如何使用

  1. 在有限范围内选择列数、行数、点大小和间距。
  2. 设置点和背景颜色,查看实时预览。
  3. 将生成的 CSS 复制到样式表或组件中。

纯 CSS 点阵网格

图案在本地使用 radial-gradient 生成,会随元素缩放,不创建大量 DOM 网格或图片文件。

有边界的控件

列数和行数限制为 2–40,点大小为 1–8px,间距为 4–64px,让预览和 CSS 保持实用。

本地生成、便于复制

颜色、预览和 CSS 输出都留在浏览器中。结果是可粘贴到任意元素的 background 声明。

常见问题

你可能还想知道

会创建图片吗?

不会。工具使用 radial-gradient 创建 CSS 背景,图案轻量且可缩放。

列数和行数如何影响图案?

它们描述所需密度;工具根据选定的间距和点大小生成重复距离。

颜色会被上传吗?

不会。预览和 CSS 生成都在浏览器本地完成。