{"generatedAt":"2026-07-19T03:01:59.645Z","tool":{"id":"css-units-converter","name":"CSS Units Converter","description":"Convert between CSS units: px, rem, em, vw, vh, %, and pt. Bidirectional with configurable base font size and viewport dimensions.","category":"converter","icon":"📐","keywords":["css units converter","px to rem","rem to px","em to px","px to em","vw to px","css unit calculator","responsive units converter"],"isNew":true,"remoteCallable":true,"remoteMode":"dedicated_api","riskClass":"M","maxInputBytes":262144,"timeoutMs":4000,"supportsStreaming":false,"url":"/css-units-converter/","tags":["converter"],"faqs":[{"question":"What is CSS Units Converter?","answer":"CSS Units Converter is a developer tool that instantly converts between all common CSS units: px, rem, em, vw, vh, %, and pt. Enter a value in any unit and see the equivalent in all others simultaneously."},{"question":"How do I convert px to rem?","answer":"Enter your pixel value, select px as the source unit, and configure the root font-size (default 16px). The rem value updates instantly. For example, 32px with a 16px root font-size equals 2rem."},{"question":"Is CSS Units Converter free?","answer":"Yes. This tool is free to use with immediate access—no account required."},{"question":"Does CSS Units Converter store or send my data?","answer":"No. All calculations happen entirely in your browser. Your data never leaves your device — nothing is sent to any server."},{"question":"What is the difference between rem and em?","answer":"rem (root em) is relative to the document root font-size (typically 16px). em is relative to the current element's parent font-size, which can cascade and change contextually. rem is generally more predictable for layouts."}],"howTo":[{"title":"Enter a value and select your source unit","description":"Type any number into the Value field and choose your starting unit (px, rem, em, vw, vh, %, or pt). All other units update instantly as you type."},{"title":"Configure root and parent font-size","description":"Set the root font-size (default 16px) to get accurate rem conversions. Set the parent font-size for em and % calculations — useful when you know the inherited font-size in your component tree."},{"title":"Set viewport dimensions for vw/vh","description":"Enter the target viewport width and height for accurate vw and vh conversions. Default is 1440×900 (typical desktop). Change to 375×812 for iPhone layout work."},{"title":"Copy any converted value","description":"Use the Copy control on any unit card to copy the numeric value to your clipboard — ready to paste directly into your CSS."},{"title":"Use the quick reference table","description":"Scroll down to see a reference table of common px values (4px–128px) converted to all units. Helpful for building consistent spacing scales."}],"agentContract":{"toolId":"css-units-converter","contractVersion":"2.0.0","remote_callable":true,"remote_mode":"dedicated_api","risk_class":"M","max_input_bytes":262144,"timeout_ms":4000,"supports_streaming":false,"preferred_surface":"dedicated_api","dedicated_api":{"baseUrl":"https://aidevhub.io/api/css-units-converter/","openapiUrl":"https://aidevhub.io/api/openapi.yaml","endpoints":[{"method":"GET","path":"/api/css-units-converter/","summary":"GET css-units-converter"},{"method":"POST","path":"/api/css-units-converter/","summary":"POST css-units-converter"}],"riskClass":"M","inputMaxBytes":262144,"timeoutMs":4000},"runtime":{"endpoint":"/api/tools/run/","methods":["GET","POST"],"queryParams":[{"name":"toolId","required":true,"description":"Tool identifier"},{"name":"a","required":true,"description":"Primary input"}],"postBodyShape":{"toolId":"string","input":"{ a, b?, c?, mode? }"},"exampleGet":"https://aidevhub.io/api/tools/run/?toolId=css-units-converter&a=...","policy":{"riskClass":"M","limit":30,"burst":10,"windowSec":60,"inputMaxBytes":262144,"timeoutMs":4000,"cacheTtlSec":0,"networkEnabled":false,"supportsStreaming":false}}},"relatedTools":[{"id":"tailwind-converter","name":"CSS to Tailwind Converter","url":"/tailwind-converter/","category":"converter"},{"id":"html-to-jsx","name":"HTML to JSX Converter","url":"/html-to-jsx/","category":"converter"},{"id":"color-converter","name":"Color Converter","url":"/color-converter/","category":"converter"},{"id":"json-to-go","name":"JSON to Go Struct","url":"/json-to-go/","category":"converter"},{"id":"json-to-python","name":"JSON to Python Dataclass","url":"/json-to-python/","category":"converter"},{"id":"json-to-typescript","name":"JSON to TypeScript Converter","url":"/json-to-typescript/","category":"converter"}]}}