PX转REM
将 px 换算为 rem，就是把像素值除以根字号：rem = px / 根字号。在浏览器默认的 16px 根字号下，24px / 16 = 1.5rem。调整下方的基准字号（Ant Design 用 14px，62.5% 技巧用 10px），rem 和 em 会随之变化；磅值则跟着像素走，因为 1px 恒等于 0.75pt。
转换 px、rem、em 和 pt，并检查 CSS 尺寸替换结果。
根字号必须为正，数值绝对值≤10亿，结果舍入至六位小数。预览限制在8–72px。CSS 最多100,000字符。只转换声明值中未加引号的 px 标记；保留注释、字符串、URL 和 content 声明。请检查输出；这是有限的词法转换器，不是 CSS 验证器。 指数形式的 CSS 数字（如 1e+3px 或 1e-3px）作为完整标记保持不变。
转换在本页面内进行，不会将输入的数字或 CSS 发送至转换服务。
em 字段假设该元素继承上方的基准字号。在 CSS 中，em 相对于元素自身的字号计算；只有用在 font-size 属性本身时，才相对于父元素的字号。
批量转换：粘贴 CSS 或一列 px 数值
每个 px 数值都会按上方的基准字号改写为 rem。
已复制
复制失败。请选择结果并手动复制。
px 怎么换算成 rem？
公式是 rem = px / 根字号，反过来则是 px = rem x 根字号。无论元素嵌套多深，只有根元素 html 的字号才算数，这正是 rem 运算可预测的原因。在默认的 16px 根字号下：10px = 0.625rem，12px = 0.75rem，14px = 0.875rem，18px = 1.125rem，20px = 1.25rem，40px = 2.5rem。
不要对结果四舍五入。在 16px 根字号下，15px 恰好是 0.9375rem；写成 0.94rem 会把渲染尺寸挪到 15.04px，整个栅格的对齐就此被破坏。浏览器会计算亚像素长度，并在绘制时把它对齐到设备像素网格，所以请直接复制换算器给出的精确数值。换算器最多输出六位小数：对 16px、10px 这类能整除的根字号是精确值，对 14px 这类除不尽的根字号则精确到百万分之一 rem。
根字号 16px、14px 与 10px 的 px 转 rem 对照表
同一个像素值会因项目设定的根字号不同而得到三种 rem 结果，因此本表把三种都列了出来，并附上磅值（CSS 规定 1px 为 1/96 英寸、1pt 为 1/72 英寸，因此 1px = 0.75pt）。16px 与 10px 两列是精确值。根字号为 14px 时大多除不尽，这些数值保留四位小数并标有约等号；上方的换算器会给出更多位数。
| 像素 | rem（根字号 16 px） | rem（根字号 14 px） | rem（根字号 10 px） | 磅 |
|---|---|---|---|---|
| 1px | 0.0625rem | ≈0.0714rem | 0.1rem | 0.75pt |
| 2px | 0.125rem | ≈0.1429rem | 0.2rem | 1.5pt |
| 4px | 0.25rem | ≈0.2857rem | 0.4rem | 3pt |
| 8px | 0.5rem | ≈0.5714rem | 0.8rem | 6pt |
| 10px | 0.625rem | ≈0.7143rem | 1rem | 7.5pt |
| 12px | 0.75rem | ≈0.8571rem | 1.2rem | 9pt |
| 14px | 0.875rem | 1rem | 1.4rem | 10.5pt |
| 16px | 1rem | ≈1.1429rem | 1.6rem | 12pt |
| 18px | 1.125rem | ≈1.2857rem | 1.8rem | 13.5pt |
| 20px | 1.25rem | ≈1.4286rem | 2rem | 15pt |
| 24px | 1.5rem | ≈1.7143rem | 2.4rem | 18pt |
| 28px | 1.75rem | 2rem | 2.8rem | 21pt |
| 32px | 2rem | ≈2.2857rem | 3.2rem | 24pt |
| 36px | 2.25rem | ≈2.5714rem | 3.6rem | 27pt |
| 40px | 2.5rem | ≈2.8571rem | 4rem | 30pt |
| 48px | 3rem | ≈3.4286rem | 4.8rem | 36pt |
| 64px | 4rem | ≈4.5714rem | 6.4rem | 48pt |
| 80px | 5rem | ≈5.7143rem | 8rem | 60pt |
| 96px | 6rem | ≈6.8571rem | 9.6rem | 72pt |
px、rem 还是 em：该用哪个单位？
实用的分工：凡是要跟随读者文字大小的用 rem，必须跟随元素自身字号的用 em，只有必须保持物理固定的长度才用 px。示例一列假设根字号为 16px、父元素也是 16px。
| 单位 | 相对于 | 20px 等于 | 最适合 | 是否跟随读者的文字大小 |
|---|---|---|---|---|
| px | 不相对于任何值——绝对单位（1px = 1/96 英寸） | 20px | 发丝般的细边框、焦点环、精确的图标尺寸 | 否 |
| rem | 根元素 html 的字号 | 1.25rem | 字号、间距、断点，以及整套排版比例 | 是 |
| em | 元素自身的字号（设置 font-size 时则为父元素的字号） | 1.25em | 需要随所包裹文字一起变大的内边距 | 是 |
| % | 父元素在该属性上的取值 | 125% | 流式宽度与遗留的 font-size 继承链 | 是（font-size） |
内边距、外边距和边框该用 px 还是 rem？
凡是应当随文字变大而变宽松的内外边距都用 rem：按钮内边距、卡片间距、区块间距、栅格间隙。发丝般的细线则保留 px。1px 边框就是一个清晰的设备无关像素，而同样的边框写成 0.0625rem 时，在某些缩放级别下可能被舍入为零或变糊，2px 的焦点环和分隔线同理。这正是上方批量转换默认不改动 1px 与 2px、只改写其余数值的原因。
媒体查询是 rem 另一个值回票价的地方。在媒体查询内部，rem 相对于浏览器的初始字号而非你写的 html 规则解析，所以 48rem 的断点对使用默认设置的读者等于 768px，对调大了文字的读者则会变大。用 px 写的断点则永远不动。
在 Figma、VS Code 和 Tailwind 里怎么把 px 换成 rem？
Figma 以 px 计量，但 Dev Mode 可以输出 rem：打开 Inspect 设置，选择「Set unit scale」并填入你的根字号（默认 1rem = 16px）。cssrem 之类的 VS Code 扩展通过自动补全完成换算，并把根字号做成配置项（cssrem.rootFontSize，默认为 16），所以在 14px 的项目里采信结果前先确认它是否匹配。整份文件则粘贴到上方的批量转换框，并先设好基准字号。Tailwind 的默认比例在 16px 根字号下已经是 rem 制：一个间距单位是 0.25rem（4px），因此 16px 是 4，24px 是 6，40px 是 10。
参考来源
关于PX转REM
转换 px、rem、em 和 pt，并检查 CSS 尺寸替换结果。
16px: 24px → 1.5rem = 1.5em = 18pt.
font-size:24px → font-size:1.5rem; border:1px → border:1px (≤2px).
根字号必须为正，数值绝对值≤10亿，结果舍入至六位小数。预览限制在8–72px。CSS 最多100,000字符。只转换声明值中未加引号的 px 标记；保留注释、字符串、URL 和 content 声明。请检查输出；这是有限的词法转换器，不是 CSS 验证器。 指数形式的 CSS 数字（如 1e+3px 或 1e-3px）作为完整标记保持不变。
使用场景
如何使用
设置根字号，编辑任意单位，也可粘贴 CSS。≤2px 选项保留小尺寸；CSV 列出已转换的唯一数值对。
根字号必须为正，数值绝对值≤10亿，结果舍入至六位小数。预览限制在8–72px。CSS 最多100,000字符。只转换声明值中未加引号的 px 标记；保留注释、字符串、URL 和 content 声明。请检查输出；这是有限的词法转换器，不是 CSS 验证器。 指数形式的 CSS 数字（如 1e+3px 或 1e-3px）作为完整标记保持不变。
专业提示
- 根字号必须为正，数值绝对值≤10亿，结果舍入至六位小数。预览限制在8–72px。CSS 最多100,000字符。只转换声明值中未加引号的 px 标记；保留注释、字符串、URL 和 content 声明。请检查输出；这是有限的词法转换器，不是 CSS 验证器。 指数形式的 CSS 数字（如 1e+3px 或 1e-3px）作为完整标记保持不变。
- rem = px ÷ 根字号；此处 em 假定与根字号上下文相同；按每英寸96个 CSS 像素计算，pt = px × 0.75。
常见问题解答
这里假定 em 上下文等于根字号。CSS 中 em 取决于相关字号，嵌套元素中可能不同。
字符串、注释、URL 函数和 content 属性都会保留。请在样式表中检查结果；不验证复杂或格式错误的 CSS。