# stylelint-rem-over-px

> A stylelint rule to enforce the usage of rem units over px units.

Latest version **2.0.1** (published 2026-08-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install stylelint-rem-over-px
pnpm add stylelint-rem-over-px
yarn add stylelint-rem-over-px
bun add stylelint-rem-over-px
```

## Health

**Score 65/100 (B)** — status: active.

Positive: esm support; no vulnerabilities; has provenance; recently updated; high maintenance score.

Warnings: low downloads; no types.

## Facts

| | |
|---|---|
| Version | 2.0.1 |
| Published | 2026-08-27 |
| First published | 2023-01-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Node | >=20.19.0 |
| Dependencies | 1 |
| Unpacked size | 10.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 30 |
| Author | Ahmed Tarek |
| Maintainers | a-tokyo |
| Keywords | stylelint, stylelint-plugin, rem, pixels, px, css, scss, sass, less, fix, autofix, migrate, migration, migrate-px-to-rem, replace-px-with-rem |

## Links

- npm: https://www.npmjs.com/package/stylelint-rem-over-px
- Repository: https://github.com/a-tokyo/stylelint-rem-over-px
- Issues: https://github.com/a-tokyo/stylelint-rem-over-px/issues
- npm.io page: https://npm.io/package/stylelint-rem-over-px

## Dependencies (1)

- [postcss-value-parser](https://npm.io/package/postcss-value-parser.md) ^3.3.0 || ^4.0.2

## Alternatives

- [style-dictionary](https://npm.io/package/style-dictionary.md) — 2.0M weekly downloads
- [postcss-merge-idents](https://npm.io/package/postcss-merge-idents.md) — 1.7M weekly downloads
- [@fontsource/noto-sans](https://npm.io/package/@fontsource/noto-sans.md) — 93.0K weekly downloads
- [uglifycss](https://npm.io/package/uglifycss.md) — 71.6K weekly downloads
- [mat4-interpolate](https://npm.io/package/mat4-interpolate.md) — 23.3K weekly downloads

## Recent versions

- 2.0.1 (latest) — 2026-08-27
- 2.0.0 — 2026-06-06
- 1.0.2 — 2024-10-31
- 1.0.1 — 2023-08-08
- 1.0.0 — 2023-02-15
- 0.0.4 — 2023-02-09
- 0.0.3 — 2023-02-09
- 0.0.2 — 2023-01-27
- 0.0.1 — 2023-01-27

## README

# stylelint-rem-over-px

A stylelint rule to enforce the usage of rem units over px units. It can also be used to migrate a project that uses px to use rem.

<a href="https://npmjs.com/package/stylelint-rem-over-px">
  <img src="https://img.shields.io/npm/v/stylelint-rem-over-px.svg"></img>
  <img src="https://img.shields.io/npm/dt/stylelint-rem-over-px.svg"></img>
</a>
<a href="https://twitter.com/intent/follow?screen_name=ahmad_tokyo"><img src="https://img.shields.io/twitter/follow/ahmad_tokyo.svg?label=Follow%20@ahmad_tokyo" alt="Follow @ahmad_tokyo"></img></a>

```css
width: 8px; // error -> can be autofixed to width: 0.5rem;
height: 1.5rem; // ok
border: 1px solid #000000; // ok
border: 2px solid #000000; // error -> can be autofixed to width: 0.125rem;
@media (max-width: 768px) { display: none }; // ok
background-image: url('https://example.com?size=500pxX500px'); // ok
```

## Requirements

- `stylelint` >= 17 (declared as a peer dependency)
- Node.js >= 20.19.0

> This package is published as an ES module (ESM). Versions `1.x` remain available on npm for projects on older stylelint (>= 8) or CommonJS setups.

## Installation

```
npm install stylelint-rem-over-px --save-dev
```
OR
```
yarn add -D stylelint-rem-over-px --save-dev
```

## Usage

Add it to your stylelint config

```javascript
// .stylelintrc
{
  "plugins": [
    "stylelint-rem-over-px"
  ],
  "rules": {
    // Declare the rule
    "rem-over-px/rem-over-px": true,
    // Declaring the rule with default values is equivalent to:
    // "rem-over-px/rem-over-px": [true, { "ignore": "1px", "ignoreFunctions": ["url"] , "ignoreAtRules": ["media"], fontSize: 16 }],
  }
}
```

## Options

### ignore: Item[]

ignore value check.

Valid value of Item: `propertyName` | `'1px'` | `'${propertyName} 1px'`

Default: ["1px"]

### ignoreFunctions: string[]

ignore check for functions.

Default: ["url"]

### ignoreAtRules: string[]

ignore check for @ rules.

Default: ["media"]

### fontSize: number

Base font size in pixels. Used to fix px values to rem.

Default: 16

### AutoFixing
This plugin supports auto-fixing. Simply run stylelint with the --fix option. The plugin will then replace all px occurrences with rem.

---
_Source: https://npm.io/package/stylelint-rem-over-px · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._