为什么用这个工具
03CSS 单位转换在浏览器本地运行,适合快速处理与复制结果。
CSS 单位转换适用于日常高频小任务,打开即用。
默认本地处理,便于快速检查与复制结果。
如何使用
02复制前快速检查
03先确认输入格式符合你的预期。
在把结果用于文档、链接、配置或消息前快速扫一眼。
只复制你真正需要的输出。
使用场景
Designers often hand off spacing values in px. Convert each one to rem so your CSS scales with user font-size preferences (an accessibility win that doesn't cost anything).
When using CSS clamp(min, preferred, max) for fluid typography, the preferred value is often expressed in vw or a mix. Convert between px and vw to sanity-check that your minimum and maximum bounds make sense at the breakpoints you care about.
Print stylesheets often use pt (the typographic unit). When porting to or referencing them in screen contexts, convert pt to px (96/72 ratio) to align with how the screen will render the same value.
Some design systems use a 10px root size so 1rem = 10px (easy mental math). Set the root field to 10 and the rem/em conversions adjust accordingly — useful when porting designs that assume this convention.
Rule of thumb: typography should be rem (responsive to user prefs); fixed-pixel elements like icons or hairlines should be px. Use this tool to convert and pick the cleaner of the two for your specific use.
使用技巧
- 01rem scales with user font preferences; px doesn't
Many users (often older users or accessibility settings) increase their browser's default font size from 16px to 20px or larger. Layouts in rem scale up gracefully; layouts in px stay rigid and can clip or overflow. Use rem for typography and spacing that should respect user prefs.
- 021pt = 1.333... px (96/72 ratio)
CSS defines the relationship as exactly 1in = 96px = 72pt. So 12pt is 16px, 14pt is ~18.67px. Print stylesheets are the main reason to deal with pt in CSS; for screen, px or rem is more idiomatic.
- 03vw and vh respect the viewport, not the document
A 100vh element fills the visible viewport, NOT the full document height. On mobile, vh has historically been quirky around the browser chrome (address bar). Modern CSS has svh / lvh / dvh for the small / large / dynamic viewport variants — convert by mental adjustment.
- 04% conversion is approximate
CSS % is context-sensitive: relative to parent font for font-size, to containing block width for widths, to containing block height for heights. This tool's % conversion assumes a 16px base, which works for typographic % but not for layout-percent. Use the result as a directional check, not a precise number.
常见问题
01
这个工具会上传数据吗?
默认在浏览器本地处理。