社交分享卡片生成
Social Card Generator
把标题、副标题、品牌文字和可选的 logo 摆进模板，生成 1200×630 的分享图，并写好配套的 meta 标签。
从标题、副标题、品牌行和一个可选的 logo 合成一张 1200 × 630 的分享卡片，并输出要一起粘贴的 meta 标签。文字用设备自己的韩文字体直接画到 canvas 上，韩文按音节换行，拉丁文按单词换行，标题会自己缩小而不是溢出。
预览 (1200 × 630)
内容
放一张 logo 图片（可选）
正方形的 PNG 或 SVG 最合适。不放的话，会用一块强调色的方块顶上。
外观
要放进页面的 meta 标签
为什么是 1200 × 630，以及字体的事
Open Graph、X（summary_large_image）、KakaoTalk 和 Slack 都按接近 1.91:1 的比例裁切，所以这个尺寸损失最小。文字是用设备上的韩文字体（有 Pretendard 就用它，否则是 Apple SD Gothic Neo、Malgun Gothic 或 Noto Sans KR）直接画在画布上的，谚文按音节换行——所以同样的设置在另一台机器上会略有不同。按 2× 导出就是 2400 × 1260，在高分屏上依然清晰。
怎么用
按它会被读到的样子写标题
分享卡片在信息流里以缩略图大小被阅读，所以大字的短标题胜过小字的完整句子。预览下面那行说明它用了几行，以及字号有没有为了放下而缩小。
加品牌行和页脚
它们在两次访问之间会被记住，因为它们是你做的每张卡片上都不变的部分。标题和副标题不会被记住。
选模板和两个颜色
渐变、纯色、分割或描边。背景色和强调色承担全部工作；浅色文字开关之所以存在，是因为中间调的背景两种都可能，该由眼睛来决定，而不是一个阈值。
有方形 logo 的话加上
方形的 PNG 或 SVG 最合适。没有的话，一个强调色的色块顶上，在缩略图大小下这常常就够了。
导出 PNG 并复制 meta 标签
标签带着宽度和高度以及 URL，这是让爬虫在图片加载之前就能排好卡片的东西。把示例 URL 改成你实际放文件的位置。
常见问题
为什么是 1200 × 630？
因为 Open Graph、X 的 summary_large_image、KakaoTalk 和 Slack 都裁到接近 1.91:1 的比例，这个尺寸在它们全部上面损失最少。更大没有帮助——每个消费者都会把它重新采样变小——更小意味着视网膜屏上一张发软的卡片。
卡片在我同事的机器上看起来略有不同。
文字用那台设备有的任何韩文字体绘制——装了 Pretendard 就用它，否则是 Apple SD Gothic Neo、Malgun Gothic 或 Noto Sans KR——所以同样的设置在不同机器上产生略有不同的字形和换行。导出的 PNG 一旦下载就固定了；变化的只是预览。
我的标题自己变小了。
它在你设定的字号下超过了四行，所以字号被缩小直到放下——预览下面那行会说明。溢出的文字会更糟：它会在导出时被悄悄切掉。想要回大字号，就缩短标题。
怎么检查卡片真的能渲染？
先把文件放到 meta 标签里的那个 URL 上，然后用 OG 预览工具，它抓取页面并显示每个平台会从它的标签构建出什么。这个页面只画图片——它无法知道标签在不在页面上，也无法知道 URL 能不能解析。
可以从这些接进来
链接预览排查
Link Preview Debugger
读出网址上的 Open Graph 和 Twitter card 标签，把这条链接被分享出去时的样子原样画出来。
背景图案生成
Background Pattern Generator
生成可无缝平铺的 SVG 图案——条纹、圆点、网格、噪点——颜色和疏密都能调。
设备样机图
Device Mockup
把截图放进手机、平板、笔记本或浏览器外框里，配上背景和阴影。
颜色拾取器
Colour Picker
在 OKLCH 色板上选色，也可以用屏幕吸管或从上传的图片里取色，并按任意表示法复制出来。
接下来
这些工具吃得下当前工具的产出，结果可以直接送过去。
设备样机图
Device Mockup
把截图放进手机、平板、笔记本或浏览器外框里，配上背景和阴影。
链接预览排查
Link Preview Debugger
读出网址上的 Open Graph 和 Twitter card 标签，把这条链接被分享出去时的样子原样画出来。
背景图案生成
Background Pattern Generator
生成可无缝平铺的 SVG 图案——条纹、圆点、网格、噪点——颜色和疏密都能调。
PNG 压缩
PNG Compressor
量化调色板并重写 deflate 数据流，在不改变尺寸的前提下减小 PNG 体积。
颜色拾取器
Colour Picker
在 OKLCH 色板上选色，也可以用屏幕吸管或从上传的图片里取色，并按任意表示法复制出来。
宽高比计算器
Aspect Ratio Calculator
按目标比例算出缺的那条边，并列出与之吻合的标准尺寸。