Tailwind CSS Converter px-to-rem

Installation

npm install tailwindcss-convert-px-to-rem
//or
yarn add tailwindcss-convert-px-to-rem

Tailwind Config

module.exports  =  { 
    content:  ["./src/**/*.{html,js}"],
    theme:  { 
        extend:  {}, 
    }, 
    plugins:  [require('@tailwindcss-convert-px-to-rem')], //add here a plugin
}

Usage

You need add variant "rem:" before class. For, example:

<div class="rem:mt-[16px]">Hello World!</div> //convert to 1rem
<div class="rem:-top-[2px]">Hello World!</div> //convert to -0.125rem

<div class="mt-[16px]">Hello World!</div> //not convert to rem

Changelog

All notable changes to this project will be documented in this file.

The format is based on Keep a Changelog, and this project mostly adheres to Semantic Versioning.

[1.0.3] - 2022-05-09

Fixed

• Removed autoprefixer from dependencies

[1.0.3] - 2022-05-09

Fixed

• Fixed generating classes who has several properties. For, example: py, px, mx, my

[1.0.2] - 2022-05-07

• Preparing to upload to npm

[1.0.1] - 2022-05-07

• Preparing to upload to npm

[1.0.0] - 2022-05-07

• Initial release