All Collections
Distribute design data to Destinations
How to display your measurements tokens in rem in Notion
How to display your measurements tokens in rem in Notion

This article helps you add column in your Notion database displaying your measurements in rem.

Louis Chenais avatar
Written by Louis Chenais
Updated over a week ago

By default, Specify only distributes your measurements design tokens in pixels in your Notion databases.

However, you may want to update the Notion database created by Specify to customize it.

We're gonna use Notion formula to convert our px values to rem and get the following result:

Let's do it step by step.

  1. Create a new column of type "formula"

  2. Name it how you want (e.g., "Value (rem)") and set the formula as concat(format(divide(toNumber(replaceAll(prop("Value"), "px", "")), 16)), "rem")

And that's it ✌️

Your formula column will automatically be updated everytime Specify updates values in the "Value" column.

What does this formula do?

How to convert "16px" to "1rem"?

Well we must do several things in the following order:

  1. Remove the "px" part in "16px": replaceAll(prop("Value"), "px", "")

  2. Convert "16" to a number: toNumber(replaceAll(prop("Value"), "px", ""))

  3. Divide 16 by 16 (our opinionated base rem value) to get a rem value: divide(toNumber(replaceAll(prop("Value"), "px", "")), 16)

  4. Convert our new rem value (in our case 16/16 = 1) to a string: format(divide(toNumber(replaceAll(prop("Value"), "px", "")), 16))

  5. Add the "rem" part to our new rem value: concat(format(divide(toNumber(replaceAll(prop("Value"), "px", "")), 16)), "rem")

Did this answer your question?