app.haikei.app

在 Haikei（app.haikei.app）里，生成素材的流程是：先选一种生成器，再在 Canvas 画布上边调参数边预览，满意后通过 Download 导出 SVG 或 PNG。它适合需要快速产出背景、分隔图形、壁纸类视觉素材的人，导出结果可以直接放进常见设计工具继续使用。下面按实际操作顺序说明每一步该动哪里、会看到什么变化。

第一步：选择生成器类型

Haikei 提供多种生成器，页面证据中列出的包括：

• Blob
• Wave
• Blurry Gradient
• Circle Scatter
• Blob Scene
• Layered Waves
• Stacked Waves
• Blob Scatter
• Low Poly Grid
• Layered Peaks
• Stacked Peaks
• Polygon Scatter
• Layered Steps
• Stacked Steps
• Symbol Scatter

每种生成器对应不同的图形结构。例如 Wave 类偏向波浪形分隔，Blob 类偏向不规则有机形状，Scatter 类偏向分散的点状元素。先确定你要的是背景、分隔带还是装饰图形，再选对应生成器，后面的参数调整才有意义。

第二步：在 Canvas 画布上预览

选中生成器后，Canvas 区域会实时显示当前效果。你在这里做的每一次参数改动都会立刻反映到画布上，所以调整时不需要反复导出确认。

画布本身可以设置比例和尺寸。页面证据中出现的示例是：

• 比例：3:2
• 尺寸：900 x 600

也就是说，你可以按目标用途先定好画布比例，再调图形参数。比如做网页背景常用宽幅比例，做社交图或壁纸则按平台要求选对应比例。

第三步：调整样式参数

Haikei 的可调参数按类别大致分为以下几组，页面证据中出现的参数包括：

调整时的实用顺序建议：

1. 先定 Style（实心还是描边），这决定整体视觉基调。
2. 再调 Shape、Complexity、Contrast，把图形形态调到接近预期。
3. 然后用 Balance、Direction、Interpolation 做细节修正。
4. 最后设 Color 和 Background，确定配色。

这样从大结构到小细节推进，比一上来就调颜色更容易得到想要的结果。

第四步：导出 SVG 或 PNG

确认画布效果后，进入 Download 区域，选择导出格式：

• SVG：矢量格式，放大不失真，适合网页、图标、需要后续在矢量工具中继续编辑的场景。
• PNG：位图格式，适合直接当图片使用，比如壁纸、社交图、海报底图。

导出前建议再核对一次画布比例和尺寸，因为导出结果会按当前画布设置生成。

常见卡点

• 参数调了很多但效果不对：多半是生成器选错了。不同生成器的参数含义和可调范围不完全一样，先换生成器再调参。
• 导出后颜色或比例和预览不一致：检查是否在导出前改动了 Background 或画布比例，导出按的是当前状态。
• 想要矢量但导出了 PNG：在 Download 里确认选的是 SVG。
• 不知道从哪个参数下手：先动 Style 和 Complexity，这两个对整体观感影响最直接。

适用条件

Haikei 是网页端工具，打开 app.haikei.app 即可使用，无需在本地安装。它生成的是可导出的 SVG/PNG 素材，适合需要快速获得背景或装饰图形的场景。如果你需要的是高度定制的插画或复杂图形，它更适合作为起点，导出 SVG 后再到专业设计工具里继续加工。

Haikei 是一个基于网页的生成式设计工具，用来产出可直接使用的 SVG 设计素材，覆盖网站、社交媒体、博客配图、桌面与移动壁纸、海报等场景。它把素材拆成一个个独立的生成器，你按需要的图形类型选对应生成器，再调参数、随机化，最后导出 SVG 或 PNG。

生成器类型一览

页面中出现的生成器包括：

这些素材适合用在哪

• 背景类：Blurry Gradient、Layered/Stacked Waves、Low Poly、Layered/Stacked Peaks、各类 Scatter，适合铺满画布做底图。
• 装饰元素类：Blob、Circle Scatter、Polygon Scatter、Symbol Scatter，适合作为局部点缀或叠加层。
• 主视觉/封面类：Blob Scene 这类由多个形状组合的生成器，更适合做有构图感的画面。

参数调整方向

不同生成器可调的参数并不相同，但页面中出现的参数方向包括：

• Variants：切换不同的变体方案。
• Style：如 solid（实心）、outline（描边）。
• Interpolation：插值方式，影响形状过渡。
• Wave / Peak / Step：与对应生成器形态相关的参数。
• Direction：方向。
• Color：颜色。
• Background：背景。
• Fill：填充。
• Shape：形状。
• Balance、Complexity、Contrast：平衡、复杂度、对比度。

画布默认显示为 3:2、900 x 600，可按需调整后再导出。

导出

在 Download 区域可导出 SVG 或 PNG。SVG 适合继续在 Figma、Illustrator 等设计工具中编辑，PNG 适合直接使用。

如果你需要的是背景图，优先看 Wave、Peaks、Low Poly、Gradient 这几类；如果只需要一个装饰形状，从 Blob 或各类 Scatter 入手更快。

Haikei 的每个生成器都共用一套参数面板，其中 Style、Balance、Complexity、Contrast 是决定图形最终形态的核心四项。简单说：Style 决定图形是实心还是描边，Balance 决定元素在画布上的疏密分布，Complexity 决定图形的细节数量，Contrast 决定明暗或形态的强弱反差。它们不改变生成器类型（Blob、Wave、Blurry Gradient 等），只调整该类型内部的视觉表现，因此同一组参数在不同生成器里的具体效果会有差异。

Style：填充方式

Style 只有两个选项，来自页面证据中的 Style solid outline：

• solid（实心）：图形以纯色块填充，适合做背景、色块分割、大面积装饰。
• outline（描边）：图形只保留轮廓线，内部透明，适合做线稿风格、叠加在照片或渐变之上。

选择哪种取决于你的用途：需要遮挡底层内容用 solid，需要透出背景用 outline。

Interpolation、Direction：过渡与朝向

这两个参数出现在波形、路径类生成器中：

• Interpolation 控制曲线在关键点之间的过渡方式，影响波形是平滑圆润还是带有折角感。
• Direction 控制波形或路径的整体朝向（水平、垂直或倾斜方向）。

调整它们时，建议先固定其他参数，只改一项，观察形状轮廓的变化，避免多个变量同时变动导致无法判断是哪个参数起了作用。

Color、Background、Fill：配色与填充

• Color：图形主体颜色。
• Background：画布底色，决定导出素材是否自带背景。
• Fill：填充相关的控制项，与 Style 配合决定填充的具体表现。

导出前要确认 Background 是否为你想要的——如果打算把 SVG 叠加到网页其他元素上，通常需要背景透明；如果直接当壁纸或海报，则保留背景色。

Balance、Complexity、Contrast：形态三要素

这三个参数共同决定图形的"密度感"，是调出理想效果时最常反复调整的一组：

实际调节时的经验顺序是：先定 Style 和配色，再用 Complexity 定大形态，然后用 Balance 调分布，最后用 Contrast 收尾。因为 Complexity 改变的是图形结构本身，一旦改动，之前调好的 Balance 和 Contrast 可能需要重新微调。

一个具体例子

假设你要为博客文章头图生成一个 Blob 形状：

1. 生成器选 Blob，Style 选 solid。
2. 把 Complexity 调低，得到一个简洁的圆润色块。
3. 用 Balance 把它移到画布偏左的位置，右侧留白放标题。
4. Contrast 调低，让边缘过渡柔和，避免抢文字注意力。
5. Background 设为透明，导出 SVG 后叠加到网页背景上。

如果换成 Wave 生成器，同样的参数名含义一致，但 Interpolation 和 Direction 会明显影响波形走向，需要单独再调。

导出前检查

页面提供 Download SVG / PNG 两种格式，画布默认显示为 3:2 900 x 600，并带 Variants 随机变体功能。导出前确认：

• 尺寸比例是否符合目标平台（头图、壁纸、海报比例不同）。
• 是否需要透明背景（选 PNG 时尤其注意）。
• 参数是否已固定——点击 Variants 会随机重排参数，可能覆盖你调好的设置。

参数本身没有"正确值"，只有是否符合你的使用场景。理解每个参数控制的是哪一层视觉属性，比记住某个具体数值更有用。

Haikei 是一个基于网页的生成式 SVG 设计素材工具，打开浏览器就能用，无需安装。它适合需要快速做出背景图、装饰图形或壁纸的人：选一个生成器，调参数或直接随机，满意后导出 SVG 或 PNG，再放进 Figma、Sketch 等设计工具或直接用于网页。如果你要的是可编辑、可缩放的矢量素材，而不是现成图库里的固定图片，它值得一试。

它能生成哪些图形

根据网站页面列出的生成器，覆盖的类型包括：

• Blob：不规则有机形状
• Wave / Layered Waves / Stacked Waves：波浪与多层波浪
• Blurry Gradient：模糊渐变
• Circle Scatter / Blob Scatter / Polygon Scatter / Symbol Scatter：各类散点排布
• Blob Scene：由 Blob 组合的场景
• Low Poly Grid：低多边形网格
• Layered Peaks / Stacked Peaks：层叠山峰
• Layered Steps / Stacked Steps：层叠阶梯

这些图形多用于背景、分区装饰、封面和壁纸，风格偏几何与抽象。

怎么用：从生成到导出

1. 选择生成器：在左侧或列表里挑一种图形类型，画布会立即显示默认效果。
2. 调整参数：页面提供 Style（如 solid、outline）、Interpolation、Direction、Color、Background、Fill、Shape、Balance、Complexity、Contrast 等控制项，改动后画布实时更新。
3. 随机化：不想逐项调参时，用随机功能快速得到新变体，再挑一个继续微调。
4. 设置画布：画布比例和尺寸可调，页面示例为 3:2、900 x 600，可按用途改成其他比例。
5. 导出：在 Download 区域选择 SVG 或 PNG。需要后续编辑选 SVG，需要直接当图片用选 PNG。

预期结果是得到一份可直接使用的矢量或位图素材，而不是只能在站内查看的预览。

适合谁，不适合谁

使用前要知道的限制

• 它是生成器，不是素材库：每次结果由参数和随机决定，需要自己调出想要的效果。
• 导出格式为 SVG 和 PNG 两种，页面未提及其他格式。
• 当前价格、是否需要登录、商用授权范围等信息在现有资料中没有说明，使用前建议自行在站内确认。
• 生成的是抽象图形，复杂构图或精细插画仍需在设计工具里二次加工。

如果你的任务是用几分钟做一张风格统一的抽象背景或装饰图，Haikei 的流程足够短：选类型、调参或随机、导出。先从一个生成器试起，确认导出文件在你的设计工具里能正常打开和编辑，再决定是否纳入日常工作流。

Haikei 的 Download 面板同时提供 SVG 和 PNG 两种导出格式，选择哪一种取决于你接下来要拿它做什么：需要继续编辑、缩放或用于网页的，选 SVG；需要直接当图片用、不打算再改的，选 PNG。两者导出的是同一个画布上的同一份设计，区别只在文件格式本身。

两种格式的本质差异

SVG 是矢量格式，文件里记录的是形状、路径和颜色参数，不是像素点。这意味着无论放大到多少倍，边缘都不会模糊，而且可以在 Illustrator、Figma、Sketch 等工具里继续拆解和修改每个元素。

PNG 是位图格式，导出时按画布当前的像素尺寸渲染成一张固定分辨率的图片。它不能无损放大，但兼容性最好，几乎所有平台都能直接上传使用。

按使用场景选择

导出时的尺寸考虑

Haikei 的画布默认是 3:2 比例、900 x 600 像素，这个尺寸在导出时直接决定 PNG 的实际像素大小。如果你要做的是一张手机壁纸，900 x 600 的横版比例并不合适，需要先在 Canvas 里把画布调成目标比例和尺寸，再导出 PNG，否则得到的图片尺寸和比例都不是你想要的。

SVG 不受这个限制——它记录的是相对坐标和路径，导出后可以在任意工具里缩放到任何尺寸而不损失质量。所以如果你不确定最终要用多大，导出 SVG 更保险。

一个常见的卡点

很多人导出 PNG 后发现图片偏小或比例不对，原因通常是没先调整 Canvas 尺寸就直接下载。Haikei 的 Canvas 面板可以设置宽高比和具体像素值，导出前先在这里确认目标尺寸，PNG 才会符合预期。

另一个情况是：想在设计工具里改颜色或调整形状，却导出了 PNG，结果只能整张图替换。这类需求一律用 SVG。

结论

不确定就导 SVG，它保留了最大的可编辑性和缩放空间；确定要直接当图片用、且平台不支持 SVG 时，先设好 Canvas 尺寸再导 PNG。Haikei 生成的素材本身可用于网站、社交媒体、博客、壁纸和海报等用途，格式选择只影响后续怎么用，不影响素材本身的可用性。