How to Use Calculator in Responsive Manager?

Table of Contents

You can export your Figma design as a responsive ready Elementor template using the UiChemy Responsive Manager. While exporting as a regular responsive layout you have to enter responsive values for different devices individually as a percentage of the desktop value.

To simplify the calculation process, you can use the Calculator feature of the UiChemy Responsive Manager.

Calculate the Percentage

Once the Responsive Manager is open you’ll find the Calculator at the bottom of the popup for Font Size, Line Height, Padding and Gap

Here you’ll find three fields – Desktop, Responsive and Percentage.

In the Desktop field, you have to add the desktop value, and in the Responsive field, you have to add the value you want in the responsive screen, then in the Percentage field, it will auto calculate the percentage which you need to enter in the respective device field of the responsive manager.

For instance, you have set 100px font size for the desktop, and you want to set 45px font size for the tablet. To calculate the percentage enter 100 in the Desktop field and 45 in the Responsive field it will show the percentage in the Percentage field. Now you have to copy the number by clicking the copy button and then paste it in the appropriate Tablet field.

uichemy responsive manager calculator

Calculate the Pixel Value

Similarly, you can calculate the mobile and tablet screen values for font size, line height, padding and gap individually.

You can also find the responsive screen value in pixels by entering the Desktop value and Percentage value then in the Responsive field it will show the value in pixel.

For instance, you have set 80px font size for the desktop and have set 35 percent for the mobile, now to find the font size in pixel for the mobile add 80 in the Desktop field and 35 in the Percentage field then in the Responsive field it will show the value in pixel.

uichemy responsive manager calculator pixel

By using the calculator feature you can add more accurate values for responsive devices.