MESH·Y

页面布局与渐变预览

打开网站后，页面中央显示当前生成的渐变图形，旁边有 Mesh ID、四个颜色色块以及 Save 和 Randomize 控件。右侧区域排列了一组预设渐变预览，可以先选择已有配色方向，再在主画布中继续修改。网站把生成结果放在较大的预览区，让颜色之间的过渡与覆盖区域一目了然；设计者不必先填写复杂参数，便能通过颜色和随机变化比较不同的视觉方案。

主预览呈现的是多种颜色相互融合的网格渐变。页面说明，当前调色板使用四种颜色，每种颜色会影响画面中对应色彩的覆盖区域。这样的方式适合制作不规则、柔和的背景过渡；更换色块后，画面整体色调和各色占比也会随之变化。用户可以围绕品牌色、内容主题或个人偏好逐步尝试，而不是只能接受固定的一张背景图。

用颜色和 Mesh ID 控制结果

四个色块构成当前渐变的颜色调色板。点击颜色可以调整选中的色彩，再观察主预览的变化。Randomize 控件可以生成新的随机变体；如果当前画面不合适，可以继续随机生成，直到出现值得保留的方向。页面还提供 Mesh ID，官方说明中把生成渐变与 ID 和颜色十六进制值联系起来，作为重新生成相同渐变的种子信息。因此，用户在比较方案时可以记下 ID 和颜色值，便于之后回到某个已选中的结果，而不必只靠截图寻找。

除了随机生成，也可以从右侧预设中挑选现成的颜色组合。预设适合用作起点：先选择一个大致接近目标氛围的组合，再替换其中颜色，或通过随机变体继续寻找细节。需要注意的是，渐变预览本身是一个视觉结果，选择哪种配色仍取决于具体页面的文字颜色、主体图片和整体品牌风格。用户可以把工具输出放进实际设计稿中对照，而不必把预览效果直接当作最终成品。

设置尺寸并导出 PNG

保存入口会打开导出面板。面板展示高度与宽度的数值和滑杆，用户可以调整图像尺寸，并在面板中确认导出尺寸。点击 Download PNG 后，页面会生成可保存的 PNG 图像。首页标题也将产品定位为可定制并导出网格渐变的工具。制作背景时，可以先确定目标画布的横纵比例，再设置相应宽高，这样导出的图片更容易放入网页区块、演示页面或其他视觉稿件中。

导出前可以检查两件事：一是目标画面中的颜色是否与正文、按钮或图标保持足够区分；二是宽高比例是否适合实际容器。渐变通常没有复杂主体元素，容易被重复使用，因此最好为不同用途保存不同的 Mesh ID 与颜色组合，并在设计稿中保留来源备注。导出功能只负责生成图像文件，后续如何裁切、叠加文字或压缩图片，需要在自己的页面或设计工具中处理。

适合哪些场景

MESH·Y适合需要快速尝试色彩氛围的网页设计、封面制作和视觉草稿。它可以帮助用户准备页面横幅、卡片背景或演示文稿的基础渐变素材，也可以作为设计过程中的配色探索工具。对于刚开始做视觉方案的人，随机变体和预设能提供多个可比较的方向；对已有品牌颜色的人，四个色块和 Mesh ID 则提供了进一步微调与记录的方法。工具的交互重点放在颜色组合和渐变预览上，不需要先建立复杂图层或进入完整的专业编辑流程。

在使用中，可以先确定背景需要承担的角色：如果背景只是衬托标题，可以选择更低对比、留白较充足的结果；如果背景需要成为主要视觉，则可以尝试更明显的色彩边界。每次调整一种颜色并观察主画面，通常比同时大幅改动多个色块更容易判断变化来自哪里。保存多个方案时，给图片或设计稿附上简短的用途说明，也能减少之后重新寻找和复现的时间。

使用特点与边界

MESH·Y的公开页面无需先登录即可看到主编辑器和预设，也能直接使用随机生成与导出入口。网站页面介绍了生成方式和 PNG 导出步骤，但没有在当前编辑界面列出复杂的图层、遮罩或多画布管理能力，因此更适合作为轻量的背景生成器，而不是完整的图像编辑软件。它的价值在于快速得到不同的渐变方向，并把选中的结果输出为普通图片，供其他工作流继续使用。

如果成品需要精确控制每一处颜色边界、对象位置或文字排版，建议将 PNG 导出到后续设计工具中进一步制作。若输出用于正式产品界面，还应在真实文本和组件上检查对比度与可读性。这样可以把 MESH·Y 放在合适的位置：先生成背景候选，再与实际页面组合验证，最后由设计者决定是否采用。