排版阅读 2 分钟

社交媒体图片的最小字号

我们对 1080 px 社交图片的最小字号:读者必须读懂的文字 40 px,任何文字至少 32 px。这个数字来自 Apple 的 11 pt 下限和缩小到手机屏幕的换算,文中给出完整的计算过程、不同画布尺寸下的对照表,以及一个文案变长时字号缩小的测试。

在 1080 px 宽的社交图片上,我们的最小字号是:读者必须理解的文字 40 px,任何文字至少 32 px。当帖子铺满 390 点宽的手机屏幕时,这大约相当于 14.4 和 11.6 个 CSS 像素。没有任何社交平台公布过图片中的最小字号,所以这些是我们自己的数字,依据是 Apple 为 iOS 规定的 11 pt 最小值,以及把 1080 px 图片缩小到手机屏幕的算术。

我们的排版专题给出了完整的字号体系。本文聚焦于下限:计算方法、它如何随画布尺寸变化,以及当更长的文案把模板里的字号往下压时会发生什么。

社交媒体有官方的最小字号吗?

没有。各平台公布的是图片尺寸和文件限制,我们在 2026 年 10 月 5 日查阅的 LinkedIn、Instagram、X 和 Threads 帮助页面中,都没有找到图片中文字的最小尺寸。最接近的官方数字来自界面规范和无障碍标准:

  • Apple 的排版指南给出 iOS 和 iPadOS 上的默认字号为 17 pt,最小字号为 11 pt。同一页面建议避免使用 Ultralight、Thin 和 Light 字重,它们在小字号下很难看清。
  • WCAG 完全没有规定最小字号。它的对比度准则要求 18 pt(或 14 pt 粗体)以下为 4.5:1,以上为 3:1,并说明这些尺寸在 CSS 中大约是 24 px 和 18.5 px。它同样适用于文字图片,而社交图片正是文字图片。

Apple 的 11 pt 是为可以放大的实时界面文字制定的。烙进 PNG 的文字读者无法放大,这就是我们把 11 pt 当作绝对下限而不是目标的原因。

如何把画布像素换算成手机上的尺寸?

三个步骤,以一部手机作为参考。iPhone 16 的显示屏宽 1179 px,每个点绘制 3 个设备像素,所以它的宽度是 1179 / 3 = 393 点。我们把它取整为 390 点作为参考宽度。我们的工作假设是,手机浏览器中的一个 CSS 像素等于一个点,因此这两个单位在这里可以互换。

  1. 缩放系数。 一张铺满 390 点屏幕的 1080 px 帖子,缩放系数为 390 / 1080 = 0.361。
  2. 每点像素数。 反过来,1 点 = 1080 / 390 = 2.77 画布像素。
  3. Apple 的下限换算到您的画布。 11 pt x 2.77 = 30.5 画布像素。

这个 30.5 px 只在图片通栏显示时成立。很多信息流把图片显示得比屏幕窄,放在头像列旁边或留有边距。对于这类信息流,我们的工作假设是图片约 300 点宽:系数降到 300 / 1080 = 0.278,1 点变成 3.6 画布像素,Apple 的 11 pt 变成 11 x 3.6 = 39.6 px。向上取整,就得到我们对关键文字的 40 px 规则。

1080 px 画布上的字号 通栏,390 pt(x 0.361) 带边距信息流,300 pt(x 0.278) 我们的结论
110 px 39.7 30.6 标题
72 px 26.0 20.0 我们推荐的最小标题
48 px 17.3 13.3 舒适的辅助文字
40 px 14.4 11.1 必须读懂的文字的最小值
32 px 11.6 8.9 仅限标签、账号名、页码
24 px 8.7 6.7 对任何重要内容都太小
20 px 7.2 5.6 装饰

中间两列是 CSS px,我们把它当作点。表中每个数字都是我们自己的计算。

最小字号如何随画布尺寸变化?

同一条规则在每种画布上得到的像素数都不同,因为更宽的画布被缩得更厉害。用画布宽度除以显示宽度,得到每点对应的画布像素数,再乘以 11。

画布 显示宽度 每点画布像素 11 pt 对应的画布像素 我们对关键文字的最小值
1080 px 帖子(1:1、4:5、9:16) 390 pt 通栏 2.77 30.5 40 px(带边距信息流)
1080 px 帖子 300 pt 带边距 3.60 39.6 40 px
1200 px 横版或广告 300 pt 带边距 4.00 44.0 44 px
1500 px X 头图 390 pt 通栏 3.85 42.3 48 px
720 px 竖版广告 300 pt 带边距 2.40 26.4 26 px

这就是为什么把字号从一种格式照搬到另一种会出问题。在 720 px 广告上没问题的 32 px 标签,放到 1500 px 头图上就太小了。关于头图本身,请看 X 头图与帖子视觉指南;关于广告,请看 LinkedIn 单图广告设计指南。

文案变长时字号会怎样?

带固定文本框的模板在文字放不下时必须做点什么。我们的渲染器会把字号一步步缩小到设计师设定的下限,然后才截断文字。下面是我们 AURORA 演示品牌中的一个引言模板,配三种长度的文案。引言起始字号为 72 px,下限为 44 px,最多允许六行;以下字号读取自渲染器的输出。

由我们的 AURORA 演示品牌渲染的黑色方形引言卡片:一个绿色引号、两行白色粗体引言 Small type is a decision, not an accident,以及左下角一行小字署名

42 个字符:引言保持 72 px,在手机通栏下约 26 点。

同一张方形引言卡片,159 个字符的引言以白色文字排成六行,明显比两行版本小,署名行不变

159 个字符:字号降到 60 px,约 21.7 点。

同一张方形引言卡片,190 个字符的引言以白色文字排成六行,又小了一些,绿色引号和署名行不变

190 个字符:50 px,通栏下约 18 点,带边距信息流中约 13.9 点。即使到了 44 px 的下限,引言仍然高于我们的 40 px 规则,这正是把下限设在那里的意义。如果下限设在 26 px,同一个模板就会悄悄降到手机能清晰显示的范围以下。

对我们自己的演示说一句实话:这个模板里的署名行固定为 20 px,在手机上约 7 点。作为装饰性署名没问题,但如果名字很重要,它也应该出现在文案说明里。

这些字号在手机宽度下是什么样?

下面是以 390 CSS px 宽显示的长引言,也就是它铺满一台典型 iPhone 屏幕时的宽度。在台式显示器上,一个 CSS 像素在物理上比手机上更大,所以请在手机上打开本页,按真实尺寸判断。

以 390 像素宽显示的 190 字符引言卡片:六行白色引言仍然可读,而底部的署名行和 AURORA 字标则非常小

下面是一张竖版帖子,它的辅助行固定为 24 px,先看原尺寸,再看 390 CSS px。

由我们的 AURORA 演示品牌渲染的 1080 x 1350 竖版帖子:桃色到粉色的渐变配两个柔和圆形,一个小小的 TYPE TEST 标签,大号黑色标题 Small text disappears first,一个 AURORA 字标,以及靠近底部的一行灰色短辅助文字

同一张竖版帖子以 390 像素宽显示:标题仍然清晰,但靠近底部的辅助行和 TYPE TEST 标签很难阅读

在 390 px 下,24 px 的行只有 8.7 点,标签里 13 px 的眉题不到 5 点。标题活了下来,细节没有。这是最常见的失误:没有人会把标题做得太小,被做得太小的总是第二行。

如何把最小字号写进模板?

我们给模板搭建者的检查清单:

  • 为每个文本框设置下限:在 1080 px 画布上,标题 72 px,所有关键内容 40 px,标签 32 px。
  • 用上面的表格按画布宽度换算这些下限,绝不凭肉眼。
  • 限制字符数,让允许的最长文案落在下限或以上。
  • 测试最长的文案,而不是示例文案,并在 390 px 宽下查看。
  • 48 px 以下的任何文字都不要用细字重。
  • 检查每一行小字的对比度;我们的色彩对比度指南列出了 WCAG 的比值。
  • 小字不仅要高于下限,还要留在安全区内;参见 Story 和 Reel 安全区。
  • 把所有关键内容在文案说明和替代文本中重复一遍,因为没有人能放大信息流里的图片。

在 Chikaboom 中,设计师为每个文本框一次性设定起始字号和下限,填写模板的同事无法把文字压到下限以下。您可以在在线演示中试试缩小行为。关于同一问题的版式一面,请阅读我们的社交图片版式原则。

常见问题

1080 x 1080 社交媒体帖子的最小字号是多少?

没有任何平台公布过。我们的建议是:读者必须理解的文字至少 40 px,标签和账号名的绝对下限是 32 px。当帖子铺满 390 点宽的手机屏幕时,这大约相当于 14 点和 12 点。

如何把画布像素换算成人们在手机上看到的大小?

乘以手机宽度(点)除以画布宽度。对于 390 点宽手机上的 1080 px 帖子,就是 390 / 1080 = 0.36,所以 40 px 大约变成 14.4 点。

WCAG 规定了最小字号吗?

没有。WCAG 规定的是随字号变化的对比度:小于 18 pt(或 14 pt 粗体)的文字需要 4.5:1,更大的文字需要 3:1。它没有给出任何允许的最小字号。

为什么我的文字看起来比设计时更小?

要么是模板为了容纳更长的文案把它缩小了,要么是信息流把图片显示得比屏幕更窄。请用允许的最长文案做测试,并在手机宽度下检查结果。

来源

  1. Apple Human Interface Guidelines: Typography
  2. Apple: iPhone 16 technical specifications
  3. WCAG 2.2 Understanding SC 1.4.3: Contrast (Minimum)
  1. 社交媒体帖子的字体排印:实用指南排版2 分钟
  2. 不偏离品牌的员工倡导图片LinkedIn 设计1 分钟
  3. 创始人在 LinkedIn 上的个人品牌视觉LinkedIn 设计1 分钟