WOWHOW
  • Browse
  • Blogs
  • Tools
  • About
  • Sign In
  • Checkout

WOWHOW

Premium dev tools & templates.
Made for developers who ship.

Products

  • Browse All
  • New Arrivals
  • Most Popular
  • AI & LLM Tools

Company

  • About Us
  • Blog
  • Contact
  • Tools

Resources

  • FAQ
  • Support
  • Sitemap

Legal

  • Terms & Conditions
  • Privacy Policy
  • Refund Policy
About UsPrivacy PolicyTerms & ConditionsRefund PolicySitemap

© 2025 WOWHOW— a product of Absomind Technologies. All rights reserved.

All Tools›Developer›CSS Unit Converter

CSS Unit Converter

Convert px, rem, em, vh, vw with Tailwind equivalents

DeveloperFREEYour data never leaves your browser

Input Value

Context Settings

px
px
px

All Conversions

px

Pixels

16.00

rem

Root EM

1

em

EM

1

pt

Points

12.00

vw

Viewport Width

0.8333

vh

Viewport Height

1.4815

Tailwind CSS Equivalents

16.00px

Spacing / Sizing

p-4
m-4
w-4
h-4
gap-4

Font Size

text-base

Highlighted in purple = exact match. Amber note = nearest approximation.

Bulk Reference Table

Base: 16px
pxremptTailwind TokenClasses
20.1251.50.5p-0.5, m-0.5
40.2531p-1, m-1
60.3754.51.5p-1.5, m-1.5
80.562p-2, m-2
100.6257.52.5p-2.5, m-2.5
120.7593p-3, m-3
140.87510.503.5p-3.5, m-3.5
16112.004p-4, m-4
181.12513.504(16px)p-4, m-4
201.2515.005p-5, m-5
241.518.006p-6, m-6
281.7521.007p-7, m-7
32224.008p-8, m-8
362.2527.009p-9, m-9
402.530.0010p-10, m-10
48336.0012p-12, m-12
563.542.0014p-14, m-14
64448.0016p-16, m-16
80560.0020p-20, m-20
96672.0024p-24, m-24

Conversion Formulas

px → rempx / baseFontSize
rem → pxrem * baseFontSize
px → ptpx * 0.75
pt → pxpt / 0.75
px → vw(px / viewportW) * 100
px → vh(px / viewportH) * 100

How to Use

1

Enter a value and select the source unit (px, rem, em, pt, vw, vh)

2

See all equivalent values across every CSS unit instantly

3

Check the Tailwind CSS section for the nearest spacing and font-size class

4

Use the bulk reference table for quick lookups of common values

Frequently Asked Questions

The default is 16px (the browser default). You can change it to match your project's root font size for accurate conversions.

More Free Tools

View all
Developer

JSON Formatter & Validator

Format, validate, diff, and convert JSON

Developer

Regex Playground

Test, visualize, and understand regex patterns

Developer

Color System Generator

One color in, full design system out

Developer

Cron Expression Builder

Build cron jobs visually — no syntax to memorize

Developer

.env File Validator & Converter

Validate, compare, and convert .env files

Learn More

All articles
AI Tools & Tutorials14 min read

7 Prompt Engineering Secrets That 99% of People Don't Know (2026 Edition)

Most people are still writing prompts like it's 2023. These seven advanced techniques — from tree-of-thought reasoning to persona stacking — will transform your AI output from mediocre to exceptional.

Read article
AI Tools & Tutorials14 min read

Claude Code: The Complete 2026 Guide for Developers

Claude Code has evolved from a simple CLI tool into a full agentic development platform. This comprehensive guide covers everything from basic setup to advanced features like subagents, worktrees, and custom skills.

Read article
AI Tools & Tutorials12 min read

How to Use Gemini Canvas to Build Full Apps Without Coding

Google's Gemini Canvas lets anyone build working web applications by describing what they want in plain English. This step-by-step tutorial shows you how to go from idea to working app without writing a single line of code.

Read article
Share: