CSS px ↔ rem ↔ em 互转,可视化尺度对比,根字号可调。
- 本地处理
- 分类 计算度量
- 适合 买东西、做计划、训练或排期前,先算出大概范围。
| px | rem | em | pt |
|---|---|---|---|
| 12 | 0.75 | 0.75 | 9 |
| 14 | 0.875 | 0.875 | 10.5 |
| 16 | 1 | 1 | 12 |
| 18 | 1.125 | 1.125 | 13.5 |
| 20 | 1.25 | 1.25 | 15 |
| 24 | 1.5 | 1.5 | 18 |
| 32 | 2 | 2 | 24 |
| 48 | 3 | 3 | 36 |
| 64 | 4 | 4 | 48 |
| px | rem | em | pt |
|---|---|---|---|
| 12 | 0.75 | 0.75 | 9 |
| 14 | 0.875 | 0.875 | 10.5 |
| 16 | 1 | 1 | 12 |
| 18 | 1.125 | 1.125 | 13.5 |
| 20 | 1.25 | 1.25 | 15 |
| 24 | 1.5 | 1.5 | 18 |
| 32 | 2 | 2 | 24 |
| 48 | 3 | 3 | 36 |
| 64 | 4 | 4 | 48 |
这个工具能做什么
给前端工程师和设计师做的 CSS 单位四向换算器。在 px / rem / em / pt 任一字段输入,其它三个实时联动,不用点确定,没有 请求延迟。根字号(html)默认 16px(浏览器默认),可在 12 到 24 之间改,贴合那种自定义了 base 字号的设计系统。Em 单独提 供 parent 字号,方便你看清嵌套组件相对父容器(不是根)的实 际尺度。下面有个实时预览,按当前像素值渲染示例文字,1.125rem 到底像不像一个标题,看一眼就知道。批量模式接受 "12px 14px 16px 18px 24px 32px" 这种列表,直接吐 px → rem / em / pt 对照表,粘到设计规范里就能用。内置常用断点 参考(12px = 0.75rem / 16px = 1rem / 24px = 1.5rem / 32px = 2rem),所有 CSS 框架都认这套数。100% 浏览器本地, 数据不外传。
工具细节
- 输入
- 文本 + 数值
- 页面会根据工具类型展示文本框、数值控件、文件选择或结构化输入。
- 输出
- 即时结果 + 复制 + 预览
- 结果区优先给出可操作结果,支持项会显示复制、下载或可视化预览。
- 隐私
- 浏览器本地处理
- 主工具逻辑未发现外部 API 调用,输入通常留在当前标签页内处理。
- 保存 / 分享
- 免账号使用
- 打开页面即可使用;刷新后是否保留结果取决于具体工具。
- 性能预算
- 首屏 JS ≤ 12 KB
- 没有声明 WASM 依赖,适合快速打开和移动端使用。
- 适用场景
- 计算度量 · 程序员
- 分类和职业标签用于推荐相关工具、组织内链,并帮助用户快速判断是否适合当前任务。
怎么用
-
1. 输入
把内容粘贴或拖入工具面板。
-
2. 处理
点击按钮,在浏览器内本地处理,文件不上传。
-
3. 复制 / 下载
一键复制结果或下载到本地。
PX REM EM 换算器 适合怎么用
适合快速估算、对比和规划数字,帮你在做最终决定前先有底。
适合计算任务
- 买东西、做计划、训练或排期前,先算出大概范围。
- 一次只改一个输入,对比不同方案。
- 把模糊假设变成能讨论的数字。
计算检查项
- 认真核对单位、日期、比例和取整方式。
- 健康、金融、税务、法律相关结果只能做规划参考,不能替代专业意见。
- 重要结果要保存输入条件,方便以后复算。
下一步可以接着做
这些入口会把当前任务接到更完整的工具链里。
真实使用场景
把 px 老样式表迁成 rem 做无障碍
接手一份写死 px 的布局,想让正文跟随读者的字号设置。把 14px 16px 18px 24px 32px 贴进批量模式,拿到 base 16 下的 px 转 rem 对照表,替进 CSS。读者把默认字号调到 20 时,整页会等比放大。
对齐自定义 base 字号的设计系统
交付规范把 html 设成 18px,不是浏览器默认。把 base 字号输入框改成 18,px 和 rem 字段会重算,1.5rem 算出来是 27px 而非 24px。实时预览按真实像素渲染,提交前就能看清标题大小对不对。
常见踩坑
html 不是 16px 时忘了改 base 字号输入框,导致每个 rem 结果都偏
把 em 当成相对根字号读:em 是按父级字号叠加,不是按 html 根
用 62.5 百分比黑魔法把 1rem 当 10px,这会破坏读者自定义的字号偏好
浏览器处在缩放或非默认字号时,还把预览当精确值看
隐私说明
所有换算都在你浏览器里用 JavaScript 跑。你输入的数值、批量列表和 base 字号设置不会发到服务器,不记录,也不存到你设备之外的任何地方。
常见问题
类似工具组合
做你这行的人, 还会一起用这些。