KO | EN

GitLite

Minimalist Open Source Repository Search Engine

gitlite — search

#dsh #dsh-plugin #ai-agent #developer-tools #codex #typescript #cli #deepseek-harness #claude-code #ai-agents #mcp #rust

stylelint-rem-over-px

★ 30 Open GitHub ↗

🕵️ Stylelint rule to enforce the usage of rem units over px units.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# 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.

```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.

stylelint-rem-over-px

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README