PX 转 REM
将像素值转换为 REM 单位，可调节根字号——实时转换并提供完整对照表，100% 在浏览器中运行。
输入
结果
对照表（1–100 px）
| PX | REM | PX | REM |
|---|
什么是 REM？
REM（root em）是 CSS3 引入的一种相对长度单位。与 em 单位不同——em 相对于元素自身的字号（嵌套时会逐层叠加），rem 始终相对于根元素（即 <html> 元素）的字号。1rem 正好等于根元素的计算字号，浏览器默认将其设为 16 像素，因此默认情况下 1rem = 16px、0.5rem = 8px、2rem = 32px。
由于 rem 始终参照同一个根字号，它避免了 em 单位的叠加问题，能在整个样式表中产生可预测、可缩放的尺寸。设计师和开发者只需修改一个值——根字号——就能让整个界面按比例缩放，这正是 rem 已成为现代 CSS 中字体、间距和组件尺寸推荐单位的原因。
PX 与 REM 对比
像素（px）和 rem（root em）都是 CSS 中的长度单位，但在可访问性和响应式缩放方面表现差异很大。理解它们的权衡有助于针对不同场景选择合适的单位。
| 特性 | PX | REM |
|---|---|---|
| 类型 | 绝对单位 | 相对单位（相对于根字号） |
| 默认值 | 1px = 1/96 英寸 | 1rem = 16px（浏览器默认） |
| 尊重用户字号设置 | 否 | 是 |
| 嵌套时叠加 | 否 | 否（基于根） |
| 可缩放性 | 固定——需逐个覆盖 | 改一处根即可整体缩放 |
| 最适用于 | 边框、细线、设备像素 | 字号、间距、布局尺寸 |
简而言之，px 提供像素级精确控制，但忽略用户的浏览器字号偏好；而 rem 具有可访问性、可缩放，是字体和大多数布局间距的更好选择。许多团队采用混合方式：rem 用于字体和间距，px 用于细边框和固定装饰元素。
根字号
根字号是声明在 <html> 元素上的字号，是所有 rem 值解析的唯一参照基准。浏览器默认为 16px，但你可以在 CSS 中覆盖它——许多设计系统会这样做，例如用 html { font-size: 62.5%; } 让 1rem 等于 10px，使心算变得简单（1.4rem = 14px）。
本转换器允许你设置 8px 到 32px 之间的任意根字号，以便计算与你项目根设置匹配的 rem 值。滑动改变根字号会立即重新计算结果和整个对照表，让你始终看到针对特定配置的正确转换。
何时使用 REM
REM 是现代可访问 Web 设计中大多数尺寸设置的推荐单位。当某个值需要随用户的字号偏好或全局设计令牌变化而缩放时，都应使用它。最常见的使用场景包括：
- 排版。用 rem 设置
font-size，让标题、段落和正文都尊重用户的浏览器字号设置。 - 间距与内边距。用 rem 设置外边距、内边距和间距，使整个布局按比例缩放。
- 组件尺寸。用 rem 定义的按钮、卡片和弹窗宽度会随根字号整体缩放。
- 媒体查询。用 rem 编写的断点会响应用户的字号偏好，而不仅仅是视口宽度。
- 设计系统。以 rem 表示的间距阶梯（4px / 8px / 16px…）成为可全局重新缩放的令牌。
对于边框（1px 细线）、需要设备像素精度的图形，以及任何在根字号变化时不应改变的值，请改用 px。
REM 与响应式设计
REM 是响应式与可访问设计的基石。由于 rem 值派生自根字号，你只需修改一条声明即可重新缩放整个界面。常见做法是用 clamp() 函数设置根字号，使其随视口平滑增长：html { font-size: clamp(16px, 2vw, 20px); }。所有基于 rem 的尺寸随后会从移动端到桌面端平滑缩放，无需额外的媒体查询。
将基于 rem 的字体和间距与 vw、% 等相对单位结合用于布局，你的网站就能在各类设备上优雅适配，同时仍尊重用户的可访问性偏好。这正是 Tailwind、Bootstrap 5 和 Material Design 等大多数现代 CSS 方法默认以 rem 提供间距和字号阶梯的原因。
如何将 PX 转换为 REM？
用像素值除以根字号：rem = px ÷ 根字号。默认根字号 16px 时，24px 即为 24 ÷ 16 = 1.5rem。
默认根字号是多少？
所有主流浏览器在 <html> 元素上默认使用 16px，因此默认情况下 1rem 等于 16px。
为什么有些项目把根字号设为 62.5%？
设置 html { font-size: 62.5%; } 会让 1rem 等于 10px，方便心算（1.6rem = 16px）。随后再在 body 上重置为可读字号。
REM 比 EM 更好吗？
大多数情况下是的——rem 基于根字号，嵌套时不会叠加，因此更可预测。em 仍适合需要随自身字号缩放的组件。
我的数值会发送到服务器吗？
不会。所有计算均在浏览器本地完成，不上传任何内容。