CSS Units

[bgoewert]

Problem Statement

There is currently not a CSS unit calculator or any conversions available. You have to use some other tool or website to convert CSS units or to view a reference table. Or use equivalent values to calculate yourself. My first thought was to check to see if the calculator could do these since I know it can perform other unit conversions.

Having this functionality could also be an attraction for designers/developers as a native unit conversion/calculator tool. It certainly would be nice to have instead of using an obscure method to get the conversion/calculation.

Evidence or User Insights

When needing convert point units to pixels because some other design tool doesn't currently support point for whatever reason.

Or if you are working in design software that doesn't support REM and EM units and want to get 1.875rem of 16px. I know you can just do this as a 16*1.875=30. But that is only for relative units. For absolute units you have to convert PT to a common unit value like IN and then convert that value to PX.

Proposal

Have a converter for all of the absolute CSS units Have a calculator for all of the relative CSS units

https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_and_units#numbers_lengths_and_percentages

Example tool: https://pixelsconverter.com/px-to-rem

Goals

User can convert PT to IN User can convert PT to PX And everything in-between

Non-Goals

Low-Fidelity Concept

Requested Assignment

I'm just suggesting this idea. I don't want to implement it.

[MicrosoftIssueBot]

This is your friendly Microsoft Issue Bot. I've seen this issue come in and have gone to tell a human about it.

[ghost]

This pitch looks like it has everything it needs for review. In the meantime, we'll keep this idea open for discussion so the community has the chance to provide feedback. Check out our New Feedback Process for more info on the user-centered process we follow for new feature development.