Home Widgets CSS Unit Converter
CSS Unit Converter icon

CSS Unit Converter

px ↔ rem ↔ em ↔ % — live, with a configurable base font.
DeveloperFree

Stop dividing by 16 in your head.

Type a value in any of the four CSS length units and the other three fill in instantly — rem and em resolve against the base font size, and 100% always equals the base in pixels. Change the base to 10 for the classic 62.5% trick, or to whatever your design system actually uses.

Every result row has its own copy button, and the whole converter runs offline as pure arithmetic. Bookmark ?base=10&from=rem to pin your team's setup and only ever touch the input.

⚙️ Settings & Customization

  • Theme
  • Size
  • Transparent background
  • Language
  • 🎨 Accent color

Changes apply live — the embed link on the right and the preview above update instantly.

📖 How to embed in Notion

  1. Copy the embed link from the sidebar on the right.
  2. Open the Notion page you want the widget on and type /embed.
  3. Paste the link into the embed dialog and press Embed link.
  4. Drag the embed's bottom edge to resize it to taste.
🆕 What's new in v1.0
  • ✦ Live four-way conversion as you type — px, rem, em, %
  • ✦ Configurable base font (16px default, any value via URL)
  • ✦ Per-row tap-to-copy results
  • ✦ Arabic-Indic numerals in Arabic mode
  • ✦ 100% offline — pure arithmetic, no API

You might also like.

CategoryDeveloper
CompatibilityNotion · iframe
Size~10 KB
ThemeLight · Dark
Version1.0.0
UpdatedAugust 2026
Languages21 languages