PX to REM Converter & CSS clamp() Calculator
Instantly convert pixels to relative REM units and generate a fluid responsive typography clamp() formula — no media queries needed.
Defaults to 16px in modern browsers
Fluid typography CSS clamp() generator:
✓ Copied!
font-size: clamp(1rem, 0.7359rem + 1.1268vw, 1.75rem);
Reference type scale (Tailwind CSS):
| Tailwind class | Pixels (PX) | Value (REM) | Copy |
|---|
Why use REM instead of PX
Accessibility (WCAG)
Users with low vision increase the default font size in their browser. REM units scale text automatically, while fixed PX values ignore that setting and can break the layout.
Responsive clamp()
A clamp() formula removes the need to write dozens of @media rules for phones, tablets and desktop screens.
Tailwind compatibility
Modern CSS frameworks (Tailwind, Bootstrap 5) compile their text-* and p-* classes to rem units.
Related Developer & Office Tools
SQL Formatter & Validator
Beautify and format SQL queries, indent clauses, minify to 1 line for PostgreSQL, MySQL, and ClickHouse client-side.
Color Contrast Checker (WCAG 2.2)
Calculate color contrast ratios for text and backgrounds per WCAG 2.2 AA/AAA accessibility standards with live previews.
Secure Password Generator
Cryptographically secure passwords powered by Web Crypto API running 100% locally on your machine.
JWT Token Decoder & Inspector
Inspect and decode JSON Web Tokens locally: inspect header, payload claims, and token expiration dates safely.
Regular Expression (Regex) Tester
Test and debug regex patterns with live match highlights, capture groups, regex flags, and cheatsheets.
CSS & Tailwind Gradient Generator
Visual gradient designer with angle controls, trendy color presets, and 1-click CSS and Tailwind class export.