输入
16px（根字号 16px）
输出
1rem / 1em（父字号同为 16px 时）
设计配色
CSS 单位转换 - px rem em vw 工具
在 px、rem、em、pt、vw、vh、% 之间换算，可自定义根字号、父元素字号与视口宽高，适合响应式与设计稿转代码。
CSS单位换算
设计配色
CSS 单位转换
使用场景
- 把设计稿 px 转成 rem/em
- 按视口宽高估算 vw/vh
- 统一团队根字号基准下的间距换算
如何使用
- 输入数值并选择源单位
- 设置根字号、父字号与视口宽高基准
- 查看并复制所需单位结果
示例输入输出
FAQ
rem 和 em 有什么区别？
rem 相对根元素字号；em 相对父元素字号。本工具用你填写的根字号与父字号分别换算。
% 是相对什么计算的？
百分比依赖具体上下文。这里按你设定的基准近似换算，落地前仍需结合实际布局确认。
工具列表
相关推荐
你可以从这里继续打开相近场景的工具，减少重复搜索。
CSS Clamp 生成
CSS Clamp 生成 - 流式尺寸响应式工具
根据最小/最大视口宽度与目标尺寸范围，计算 clamp() 公式，用于字号、间距等随视口线性缩放的响应式排版。
CSS clamp 响应式
像素标尺
像素标尺 - 屏幕尺寸与刻度工具
在页面内绘制可切换方向的像素刻度标尺，可调长度与刻度间距，并显示窗口尺寸与设备像素比，适合核对 CSS 像素尺寸。
像素 标尺 测量
宽高比计算
宽高比计算 - 在线等比尺寸工具
在线计算并锁定宽高比，可由原始尺寸推比例，也可在锁定比例下改一边求另一边，附预设分辨率与预览，适合切图、视频画幅和响应式布局。
比例 尺寸 设计