图案生成器
按合集浏览
关于 图案生成器
图案生成器能把近 2000 种现成设计变成可以调整、随即使用的背景。您可以浏览 14 个合集,从波浪、波点和镶嵌,到苏格兰格纹、日本青海波、伊斯兰星形、装饰艺术扇形、像素精灵和迷彩,并用自己的颜色查看每一种。
每个设计都以矢量图形绘制,在任何缩放比例和任何角度下都能无可见接缝地重复。您可以修改最多六种颜色,以及缩放、位置、间距、线条粗细和角度,把填充的形状变成轮廓,或者用循环动画让图案动起来。地形图、沃罗诺伊单元和特吕谢图块等生成式图案,每次点击都能产生新的变体。
满意之后,可以将它复制为 CSS、SCSS、Tailwind 配置、内联 SVG、数据 URI 或 React 组件,也可以下载任意尺寸(最大 8000 像素)的 SVG、PNG、JPG 或 WebP,还可以导出单个图块,用于您自己的重复排布。所有操作都在浏览器中运行:不会上传任何内容,也不需要账号。
如何使用 图案生成器
- 选择图案:按名称搜索,或按合集和颜色数量筛选。
- 用取色器、现成调色板或“新调色板”选择颜色。
- 调整缩放、位置、间距、线条粗细和角度。点击“给我灵感”之前,先锁定想保留的数值。
- 用“显示图块”“在页面中”和“在文字中”预览进行检查。
- 复制代码或下载文件,并用“复制链接”日后回到这个确切的图案。
常见问题
是的。该工具免费,无需注册,也没有使用限制:每个图案都在您的浏览器中绘制,不会有文件发送到服务器。
可以。您导出的图案可用于个人和商业作品,例如网站、应用、包装和印刷品,无需署名。
不会。每个越过图块边缘的形状都会在对侧再绘制一次,因此重复是无缝的。使用“显示图块”预览,可以准确看到一个图块从哪里开始、到哪里结束。
CSS 最简单:把规则粘贴到样式表中,并应用到任意元素即可。在 0、90、180 或 270 度时,它使用带 background-size 的一个小图块;在其他角度时,它使用填满元素的 SVG。Tailwind、SCSS、React 和数据 URI 版本包含相同的图案。
动画内置于 SVG 中,因此无需脚本,在现代浏览器中也可作为 CSS 背景运行。请在您需要支持的浏览器中检查。PNG、JPG 和 WebP 文件仍是静态图片,因此只保留第一帧。
迷彩和地形图等有机设计包含大量曲线。代码大小显示在复制按钮旁边。如果它对页面来说太重,请选择图块更小的设计,或改用 PNG 图块。
可以,几乎所有图案都支持:开启“透明背景”,然后导出为 CSS、SVG、PNG 或 WebP。少数重叠设计用背景色遮盖形状,因此需要纯色背景。JPG 文件不支持透明。
热门搜索
svg 图案生成器
无缝图案生成器
css 背景图案
重复图案制作
免费背景图案
几何图案生成器
tailwind 背景图案
无缝图块 png
需要帮助?
使用此工具时遇到问题?请告诉我们的团队。