封面生成器

按文字、尺寸和风格生成 SVG 封面布局，不编码位图。

浏览器本地运行所有计算都在你的浏览器里完成，数据不会离开本机。

标题

封面

SVG 封面布局

输入标题后即可看到结果

这个工具能做什么

制作封面草稿
核对标题排版

示例

输入

标题

输出

封面：标题
尺寸 1280 × 720（比例 16:9，实际 1.7778）· 风格 gradient · 圆角 0px
主标题字号 153.6px（估算宽度 307.2px，画布 88% 上限 1126.4px）
字符数 2

SVG 源码：
<svg xmlns="http://www.w3.org/2000/svg" width="1280" height="720" viewBox="0 0 1280 720" role="img">
  <defs>
    <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1"><stop offset="0%" stop-color="#4D6BFE" /><stop offset="100%" stop-color="#8B5CF6" /></linearGradient>
  </defs>
  <rect x="0" y="0" width="1280" height="720" rx="0" ry="0" fill="url(#bg)" />
  <g font-family="system-ui, -apple-system, 'Noto Sans SC', sans-serif">
    <text x="640" y="412.22" text-anchor="middle" font-size="153.6" font-weight="700" fill="#FFFFFF">标题</text>
  </g>
</svg>

data URI（可直接作为 <img src> 或 CSS background-image）：
data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjgwIiBoZWlnaHQ9IjcyMCIgdmlld0JveD0iMCAwIDEyODAgNzIwIiByb2xlPSJpbWciPgogIDxkZWZzPgogICAgPGxpbmVhckdyYWRpZW50IGlkPSJiZyIgeDE9IjAiIHkxPSIwIiB4Mj0iMSIgeTI9IjEiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM0RDZCRkUiIC8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjOEI1Q0Y2IiAvPjwvbGluZWFyR3JhZGllbnQ+CiAgPC9kZWZzPgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMjgwIiBoZWlnaHQ9IjcyMCIgcng9IjAiIHJ5PSIwIiBmaWxsPSJ1cmwoI2JnKSIgLz4KICA8ZyBmb250LWZhbWlseT0ic3lzdGVtLXVpLCAtYXBwbGUtc3lzdGVtLCAnTm90byBTYW5zIFNDJywgc2Fucy1zZXJpZiI+CiAgICA8dGV4dCB4PSI2NDAiIHk9IjQxMi4yMiIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZm9udC1zaXplPSIxNTMuNiIgZm9udC13ZWlnaHQ9IjcwMCIgZmlsbD0iI0ZGRkZGRiI+5qCH6aKYPC90ZXh0PgogIDwvZz4KPC9zdmc+

输出 SVG 与尺寸元数据。

常见问题

输出位图吗？

不会，只输出 SVG。

支持哪些比例？

支持预设比例。

会上传内容吗？

不会，本地处理。

关键词：封面coverSVGlayoutimage

这个工具能做什么

示例

常见问题

同类工具