PostCSS Plugin Directory

advanced-variables

Use Sass-like variables, conditionals, and iterators in CSS

npm: npm -i postcss-advanced-variables
Version: 5.0.0
License: CC0-1.0
PostCSS version range: ^8.4
Node version range: >=18

conditional
media query
sass
scss
variables

alpha-function (csstools)

Use the alpha() function in CSS

npm: npm -i @csstools/postcss-alpha-function
Version: 2.0.1
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

alpha
color

animations

PostCSS plugin that adds `@keyframes` from animate.css, tuesday.css, magic.css, mimic.css

npm: npm -i postcss-animations
Version: 8.0.0
License: MIT
PostCSS version range: >=8.1.0
Node version range: >=10

animation
keyframes

aspect-ratio-property

PostCSS plugin CSS4 aspect-ratio property

npm: npm -i postcss-aspect-ratio-property
Version: 1.0.0
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=10.0.0

aspect-ratio

assets

PostCSS plugin to manage assets

npm: npm -i postcss-assets
Version: 6.0.0
License: MIT
PostCSS version range: ^8.2.15
Node version range: >=10

base64
image
url

atomizer

PostCSS Atomizer plugin

npm: npm -i postcss-atomizer
Version: 2.0.0
License: BSD-3-Clause
PostCSS version range: ^8.3.0
Node version range: >=16.0

atomizer

attribute-case-insensitive

Enable support for case insensitive attribute matching in selectors

npm: npm -i postcss-attribute-case-insensitive
Version: 8.0.0
License: MIT
PostCSS version range: ^8.4
Node version range: >=20.19.0

autoprefixer

Parse CSS and add vendor prefixes to CSS rules using values from the Can I Use website

npm: npm -i autoprefixer
Version: 10.4.23
License: MIT
PostCSS version range: ^8.1.0
Node version range: ^10 || ^12 || >=14

prefix

better-units

A PostCSS plugin to define, transform, and manage custom or existing CSS units with ease.

npm: npm -i postcss-better-units
Version: 1.0.1
License: MIT
PostCSS version range: ^8.5.3
Node version range: >=22.0.0

custom units

blank-pseudo

Style form elements when they are empty

npm: npm -i css-blank-pseudo
Version: 8.0.1
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

a11y
accessibility
selector

browser-comments

Keep only the CSS you need based on comments and your browserslist

npm: npm -i postcss-browser-comments
Version: 7.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

browserslists

bundler (csstools)

Bundle CSS

npm: npm -i @csstools/postcss-bundler
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

bundler
import
url

calc

PostCSS plugin to reduce calc()

npm: npm -i postcss-calc
Version: 10.1.1
License: MIT
PostCSS version range: ^8.4.38
Node version range: ^18.12 || ^20.9 || >=22.0

calc

cascade-layers (csstools)

Use cascade layers in CSS

npm: npm -i @csstools/postcss-cascade-layers
Version: 6.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

cascade
layers
selector
specificity

clamp

PostCSS plugin to transform clamp() to combination of min/max

npm: npm -i postcss-clamp
Version: 4.1.0
License: MIT
PostCSS version range: ^8.4.6
Node version range: >=7.6.0

clamp
max
min

class-apply

PostCSS plugin enabling custom class sets like tailwind css

npm: npm -i postcss-class-apply
Version: 4.0.1
License: Unlicense
PostCSS version range: ^8.4.1

@apply
apply
class apply

classes-to-mixins

PostCSS plugin to intelligently convert CSS classes to SASS, Less and Stylus mixins

npm: npm -i postcss-classes-to-mixins
Version: 3.0.1
License: MIT
PostCSS version range: ^8.3.6

mixin
sass

clip-path-polyfill

Generates SVG fallback for clip-path properties to make it works in Firefox

npm: npm -i postcss-clip-path-polyfill
Version: 1.1.0
License: ISC
PostCSS version range: ^8.0.0

clip-path

cnjm-postcss-px-to-viewport

A CSS post-processor that converts px to viewport units (vw, vh, vmin, vmax).

npm: npm -i cnjm-postcss-px-to-viewport
Version: 1.0.1
License: MIT
PostCSS version range: ^8.4.14

px
vh
viewport
vmax
vmin
vw

color-converter

Post CSS plugin for color conversion.

npm: npm -i postcss-color-converter
Version: 1.2.1
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=8.3.0

color

color-function (csstools)

Use the color() function in CSS

npm: npm -i @csstools/postcss-color-function
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color
display-p3
prophoto-rgb
rec2020
rgb
rgba
srgb-linear

color-function-display-p3-linear (csstools)

Use the display-p3-linear color space on the color() function in CSS

npm: npm -i @csstools/postcss-color-function-display-p3-linear
Version: 2.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color
display-p3-linear

color-functional-notation

Use space and slash separated color notation in CSS

npm: npm -i postcss-color-functional-notation
Version: 7.0.12
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

color
hsl
hsla
hwb
rgb
rgba

color-hex-alpha

Use 4 & 8 character hex color notation in CSS

npm: npm -i postcss-color-hex-alpha
Version: 10.0.0
License: MIT
PostCSS version range: ^8.4
Node version range: >=18

alpha
color
hex
transparency
transparent

color-hsla-fallback

PostCSS plugin to transform hsl() and hsla() to hexadecimal

npm: npm -i postcss-color-hsla-fallback
Version: 1.0.0
License: MIT
PostCSS version range: ^8.2.8
Node version range: >= 12

color
color-convert
hexadecimal
hsl
hsla

color-mix-function (csstools)

Use the color-mix function in CSS

npm: npm -i @csstools/postcss-color-mix-function
Version: 4.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color-mix
display-p3
interpolation
prophoto-rgb
rec2020
rgb
rgba
srgb-linear

color-mix-variadic-function-arguments (csstools)

Mix any number of colors with the color-mix function in CSS

npm: npm -i @csstools/postcss-color-mix-variadic-function-arguments
Version: 2.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color-mix
interpolation
variadic

color-mod-function

Modify colors using the color-mod() function in CSS

npm: npm -i postcss-color-mod-function
Version: 4.1.1
License: CC0-1.0
PostCSS version range: ^8.2.15
Node version range: >= 18

adjusters
adjustments
alpha
black
blackness
blenda
blue
color
colours
contrast
green
hsla
hue
lightness
modifications
mods
red
rgba
saturation
shade
tint
white
whiteness

color-rebeccapurple

Use the rebeccapurple color keyword in CSS

npm: npm -i postcss-color-rebeccapurple
Version: 10.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

color
purple
rebecca
rgb

color-scheme

postcss plugin for handling prefers-color-scheme more gracefully

npm: npm -i postcss-color-scheme
Version: 2.1.0
License: MIT
PostCSS version range: ^8.0.0

color
theme

colorguard

PostCSS plugin to keep a watchful eye on your css colors

npm: npm -i postcss-colorguard
Version: 2.0.29
License: Apache-2.0
PostCSS version range: >8.0.0
Node version range: >=18.0.0

color

colormin

Minify colors in your CSS files with PostCSS.

npm: npm -i postcss-colormin
Version: 7.0.5
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

color
minify

combine-duplicated-selectors

automatically keep css selectors unique

npm: npm -i postcss-combine-duplicated-selectors
Version: 10.0.3
License: MIT
PostCSS version range: ^8.1.0
Node version range: ^10.0.0 || ^12.0.0 || >=14.0.0

selector

combine-media-query

PostCSS plugin to combine equal media query rules.

npm: npm -i postcss-combine-media-query
Version: 2.1.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=16.0.0

media query

componentry

React component library for building custom design systems

npm: npm -i componentry
Version: 7.2.0
License: MIT
PostCSS version range: 8

accessibility

conditionals-renewed

PostCSS plugin that enables @if statements in your CSS

npm: npm -i postcss-conditionals-renewed
Version: 1.0.0
License: MIT
PostCSS version range: ^8

conditional
else
if

content-alt-text (csstools)

Generate fallback values for content with alt text

npm: npm -i @csstools/postcss-content-alt-text
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

accessibility
alt
content
fallback

contrast-color-function (csstools)

Dynamically specify a text color with adequate contrast

npm: npm -i @csstools/postcss-contrast-color-function
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

contrast
contrast-color
wcag

convert-values

Convert values with PostCSS (e.g. ms -> s)

npm: npm -i postcss-convert-values
Version: 7.0.8
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

csscomb

PostCSS plugin to apply CSScomb

npm: npm -i postcss-csscomb
Version: 4.0.0
License: MIT
PostCSS version range: ^8.2.4
Node version range: >=12

cssnano

A modular minifier, built on top of the PostCSS ecosystem.

npm: npm -i cssnano
Version: 7.1.2
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0
Funding: opencollective

minify

custom-media

Use Custom Media Queries in CSS

npm: npm -i postcss-custom-media
Version: 11.0.6
License: MIT
PostCSS version range: ^8.4
Node version range: >=18

atrule
media
query

custom-media-generator

PostCSS plugin custom media generator

npm: npm -i postcss-custom-media-generator
Version: 1.1.0
License: MIT
PostCSS version range: ^8.3.0
Node version range: >=12.0.0

custom-properties

Use Custom Properties Queries in CSS

npm: npm -i postcss-custom-properties
Version: 14.0.6
License: MIT
PostCSS version range: ^8.4
Node version range: >=18

variables

custom-properties-fallback

Adds fallbacks to your CSS var() functions

npm: npm -i postcss-custom-properties-fallback
Version: 1.0.2
License: MIT
PostCSS version range: ^8.0.0

variables

custom-selectors

Use Custom Selectors in CSS

npm: npm -i postcss-custom-selectors
Version: 8.0.5
License: MIT
PostCSS version range: ^8.4
Node version range: >=18

atrule
selector

dark-theme-class

CSS solution for light/dark/auto theme switcher for websites

npm: npm -i postcss-dark-theme-class
Version: 2.0.0
License: MIT
PostCSS version range: ^8.2.14
Node version range: >=20.0

auto-theme
dark-theme
theme-switcher

debug-logger (csstools)

Log the AST nodes PostCSS is processing

npm: npm -i @csstools/postcss-debug-logger
Version: 4.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

debug

declaration-sorter

Sorts CSS declarations fast and automatically in a certain order.

npm: npm -i css-declaration-sorter
Version: 7.3.1
License: ISC
PostCSS version range: ^8.0.9
Node version range: ^14 || ^16 || >=18

order

delete-duplicate-css

PostCSS plugin delete duplicate css in the file

npm: npm -i postcss-delete-duplicate-css
Version: 1.0.0
License: MIT
PostCSS version range: ^8.2.8
Node version range: >=10.0.0

duplicate

design-token-utils

PostCSS plugin to convert design tokens to CSS custom properties and utility classes.

npm: npm -i postcss-design-token-utils
Version: 3.0.1
License: MIT
PostCSS version range: ^8.0.0

atomic-css
design-tokens
utility-class

design-tokens

PostCSS plugin that provides a function to retrieve design tokens expressed in JS or JSON, within CSS

npm: npm -i postcss-design-tokens
Version: 1.3.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=12.0.0

token

design-tokens (csstools)

Use design tokens in your CSS

npm: npm -i @csstools/postcss-design-tokens
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

design-tokens

dir-pseudo-class

Use the :dir pseudo-class in CSS

npm: npm -i postcss-dir-pseudo-class
Version: 9.0.1
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

ltr
rtl
selector

disabled

PostCSS plugin to add disabled attributes and disabled classes when the :disabled pseudo class is present.

npm: npm -i postcss-disabled
Version: 2.0.0
License: MIT
PostCSS version range: ^8.4.27
Node version range: >=18.0.0

discard-comments

Discard comments in your CSS files with PostCSS.

npm: npm -i postcss-discard-comments
Version: 7.0.5
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

comments

discard-duplicates

Discard duplicate rules in your CSS files with PostCSS.

npm: npm -i postcss-discard-duplicates
Version: 7.0.2
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

discard-empty

Discard empty rules and values with PostCSS.

npm: npm -i postcss-discard-empty
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

minify

discard-overridden

PostCSS plugin to discard overridden @keyframes or @counter-style.

npm: npm -i postcss-discard-overridden
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

counter-style
keyframes

discard-unused

Discard unused counter styles, keyframes and fonts.

npm: npm -i postcss-discard-unused
Version: 7.0.4
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

minify

double-position-gradients

Use double-position gradients in CSS

npm: npm -i postcss-double-position-gradients
Version: 6.0.4
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

color
double
gradients
linear
position
radial
repeating

each

PostCSS plugin to iterate through values

npm: npm -i postcss-each
Version: 1.1.0
License: MIT
PostCSS version range: ^8.0.0

easings

PostCSS plugin to replace easing names to cubic-bezier()

npm: npm -i postcss-easings
Version: 4.0.0
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=16.0
Funding: opencollective

easings

easy-import

PostCSS plugin to inline @import rules content with extra features

npm: npm -i postcss-easy-import
Version: 4.0.0
License: MIT
PostCSS version range: ^8.4.6
Node version range: >=10.0.0

glob
import

editor-styles-wrapper

Remove your editor-styles from the global scope

npm: npm -i postcss-editor-styles-wrapper
Version: 1.0.1
License: MIT-0
PostCSS version range: ^8.4
Node version range: ^18 || >= 20

em-media-query

PostCSS plugin for transforming min/max-width/height media queries to ems.

npm: npm -i postcss-em-media-query
Version: 4.1.1
License: MIT
PostCSS version range: ^8.1.1
Node version range: >=12

em
media
query

env-function

Use env() variables in CSS

npm: npm -i postcss-env-function
Version: 7.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

constants
variables

exponential-functions (csstools)

Use pow(), sqrt(), hypot(), log(), exp() exponential functions in CSS

npm: npm -i @csstools/postcss-exponential-functions
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

exp
exponential
hypot
log
pow
sqrt

extend-rule

Use the @extend at-rule and functional selectors in CSS

npm: npm -i postcss-extend-rule
Version: 4.0.0
License: CC0-1.0
PostCSS version range: ^8.4.6
Node version range: ^12 || ^14 || >=16

extend
matches
selector

extract (csstools)

Extract bits of your CSS

npm: npm -i @csstools/postcss-extract
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

extract-css-variables (lesjoursfr)

PostCSS plugin to extract rules with CSS variables

npm: npm -i @lesjoursfr/postcss-extract-css-variables
Version: 3.0.2
License: MIT
PostCSS version range: ^8.5.6
Node version range: 22.x || 24.x

extract-media-query

PostCSS plugin to extract all media query from CSS and emit as separate files.

npm: npm -i postcss-extract-media-query
Version: 3.2.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=16.0.0

media query

figma-blur-fix

PostCSS plugin that adjusts blur values imported from Figma to ensure they visually match the blur effect in browsers. Perfect for syncing design and implementation.

npm: npm -i postcss-figma-blur-fix
Version: 1.0.0
License: MIT
PostCSS version range: ^8.4.27
Node version range: >=18.0.0

flex-gap-polyfill

A PostCSS polyfill for adding gap between flex items

npm: npm -i flex-gap-polyfill
Version: 5.0.0
License: CC0-1.0
PostCSS version range: ^8.3.6
Node version range: >=8.0.0

flex
gutters

flexbox-reset

PostCSS plugin for resetting flexbox

npm: npm -i postcss-flexbox-reset
Version: 1.0.5
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=10.0.0

flex

flexbugs-fixes

PostCSS plugin This project tries to fix all of flexbug's issues

npm: npm -i postcss-flexbugs-fixes
Version: 5.0.2
License: MIT
PostCSS version range: ^8.1.4

flex

flexibility

PostCSS plugin for Flexibility polyfill

npm: npm -i postcss-flexibility
Version: 3.0.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=12.0.0

flex

fluid (lehoczky)

PostCSS plugin that makes it easier to work with fluid css values.

npm: npm -i @lehoczky/postcss-fluid
Version: 1.0.3
License: MIT
PostCSS version range: ^8.3.0
Node version range: >=12.0.0

focus

PostCSS plugin to add :focus-visible selector to every :hover for keyboard accessibility

npm: npm -i postcss-focus
Version: 7.0.0
License: MIT
PostCSS version range: ^8.1.0
Node version range: ^18.0.0 || >=20.0.0

a11y
accessibility
focus
hover

focus-visible

Use the :focus-visible pseudo-selector in CSS

npm: npm -i postcss-focus-visible
Version: 10.0.1
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

a11y
accessibility
button
cursor
focus
selector

focus-within

Use the :focus-within pseudo-selector in CSS

npm: npm -i postcss-focus-within
Version: 9.0.1
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

a11y
accessibility
focus
selector

font-family-system-ui

Use the system-ui font family in CSS

npm: npm -i postcss-font-family-system-ui
Version: 5.0.0
License: CC0-1.0
PostCSS version range: ^8.0.0

font-family

font-format-keywords (csstools)

Use unquoted format on @font-face CSS definitions.

npm: npm -i @csstools/postcss-font-format-keywords
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

font-grabber

It grabs remote font files and update your CSS, just like that.

npm: npm -i postcss-font-grabber
Version: 3.1.0
License: Apache-2.0
PostCSS version range: ^8.0.0
Node version range: >=14.0.0

font-face

font-magician

PostCSS plugin that magically generates all the @font-face rules

npm: npm -i postcss-font-magician
Version: 4.0.0
License: CC0-1.0
PostCSS version range: ^8.0.0
Node version range: >=18

fonts
typography
weights

font-variant

PostCSS plugin to transform W3C font-variant properties to more compatible CSS (font-feature-settings)

npm: npm -i postcss-font-variant
Version: 5.0.0
License: MIT
PostCSS version range: ^8.1.0

fonticons

PostCSS plugin to generate font icons from stylesheets.

npm: npm -i postcss-fonticons
Version: 2.0.2
License: MIT
PostCSS version range: ^8.4.14

functions

PostCSS plugin for exposing JavaScript functions

npm: npm -i postcss-functions
Version: 4.0.2
License: MIT
PostCSS version range: ^8.0.0

gamut-mapping (csstools)

Gamut map css colors to fit display specific gamuts

npm: npm -i @csstools/postcss-gamut-mapping
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color
display-p3
gamut mapping
p3
rec2020
srgb
wide gamut

gap-properties

Use the gap, column-gap, and row-gap shorthand properties in CSS

npm: npm -i postcss-gap-properties
Version: 6.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

gap
grid
prefix
shorthand

glitch

PostCSS plugin for glitch effect

npm: npm -i postcss-glitch
Version: 3.2.38
License: MIT
PostCSS version range: ^8.1.1
Node version range: >=12

animation

global-data (csstools)

PostCSS plugin to define global data that will be injected into PostCSS for use in other plugins.

npm: npm -i @csstools/postcss-global-data
Version: 4.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

productivity

gradients-interpolation-method (csstools)

Use interpolation methods in CSS gradient functions

npm: npm -i @csstools/postcss-gradients-interpolation-method
Version: 6.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color
color space interpolation
gradients
hue interpolation method
interpolation
linear
radial
repeating

grid-kiss

A PostCSS plugin to keep CSS grids stupidly simple

npm: npm -i postcss-grid-kiss
Version: 3.1.0
License: MIT
PostCSS version range: ^8.2.14
Node version range: >=6.0.0

ascii-art
grid

grid-reset

PostCSS plugin for resetting CSS Grid.

npm: npm -i postcss-grid-reset
Version: 1.0.3
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=10.0.0

grid

has-pseudo

Style elements relative to other elements in CSS

npm: npm -i css-has-pseudo
Version: 8.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

contains
has
selector

hexrgba

PostCSS plugin that adds shorthand hex methods to rgba() values

npm: npm -i postcss-hexrgba
Version: 2.1.0
License: MIT
PostCSS version range: ^8.1.4

hex
rgba

hover-focus-visible

PostCSS plugin to add :focus-visible selector and/or :focus to every :hover, this is for keyboard accessibility

npm: npm -i postcss-hover-focus-visible
Version: 1.0.2
License: MIT
PostCSS version range: ^8.0.0

accessibility
focus
focus-visible
hover

hover-media-feature

PostCSS plugin that extracts and wraps rules containing `:hover` pseudo-classes in `@media (hover: hover) {}` media queries

npm: npm -i postcss-hover-media-feature
Version: 1.0.2
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=10.0.0

hover
media
query

hwb-function (csstools)

Use hwb() color functions in CSS

npm: npm -i @csstools/postcss-hwb-function
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color
hwb

ic-unit

Use the ic length unit in CSS

npm: npm -i postcss-ic-unit
Version: 2.0.0
License: CC0-1.0
PostCSS version range: ^8.0.0

ic

ic-unit (csstools)

Use the ic length unit

npm: npm -i @csstools/postcss-ic-unit
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

glyph
ic

iconsauce

PostCSS plugin for Iconsauce

npm: npm -i postcss-iconsauce
Version: 1.4.1
License: MIT
PostCSS version range: ^8.0.0

image-inliner

PostCSS plugin to inline images into css

npm: npm -i postcss-image-inliner
Version: 7.0.1
License: MIT
PostCSS version range: ^8.3.0
Node version range: >=16.10

image
inline

image-set-function

Display resolution-dependent images using the image-set() function in CSS

npm: npm -i postcss-image-set-function
Version: 7.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

background
image
image-set
resolution

import

PostCSS plugin to import CSS files

npm: npm -i postcss-import
Version: 16.1.1
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=18.0.0

import

import-ext-glob

A PostCSS plugin to extend postcss-import path resolver to allow glob usage as path

npm: npm -i postcss-import-ext-glob
Version: 2.1.1
License: MIT
PostCSS version range: ^8.2.0

glob
import

import-svg

PostCSS plugin to reference an SVG file and inline it, optionally update currentColor references

npm: npm -i postcss-import-svg
Version: 1.0.5
License: MIT
PostCSS version range: ^8.1.4

inline

import-url

PostCSS plugin inlines remote files.

npm: npm -i postcss-import-url
Version: 7.2.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=10

include-media

PostCSS plugin to output @media definitions from include-media format.

npm: npm -i postcss-include-media
Version: 1.1.1
License: MIT
PostCSS version range: ^8.2.8
Node version range: >=10.0.0

media query

initial

PostCSS plugin to fallback initial keyword.

npm: npm -i postcss-initial
Version: 4.0.1
License: MIT
PostCSS version range: ^8.0.0

reset

initial (csstools)

PostCSS plugin to fallback initial keyword.

npm: npm -i @csstools/postcss-initial
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

inline-base64

PostCSS plugin for encode the file to base64

npm: npm -i postcss-inline-base64
Version: 7.3.1
License: MIT
PostCSS version range: >=8.0.0
Node version range: >=14.17

base64
inline

inline-media

Media queries shortcut on PostCSS

npm: npm -i postcss-inline-media
Version: 1.5.0
License: MIT
PostCSS version range: ^8.4.40

inline
media
query
shortcut

inline-svg

PostCSS plugin to reference an SVG file and control its attributes with CSS syntax

npm: npm -i postcss-inline-svg
Version: 6.0.0
License: MIT
PostCSS version range: ^8.1.4

inline

input-range

Style range inputs with unprefixed pseudo-classes

npm: npm -i postcss-input-range
Version: 6.0.0
License: CC0-1.0
PostCSS version range: ^8.0.0
Node version range: >=18

is-pseudo-class (csstools)

A pseudo-class for matching elements in a selector list

npm: npm -i @csstools/postcss-is-pseudo-class
Version: 6.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

matches
selector

jit-props

PostCSS plugin to insert variables from a data source based on discovered usage

npm: npm -i postcss-jit-props
Version: 1.0.16
License: Apache-2.0
PostCSS version range: ^8.2.8
Node version range: >=10.0.0

custom properties

lab-function

Use lab() and lch() color functions in CSS

npm: npm -i postcss-lab-function
Version: 7.0.12
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

color
lab
lch
rgb
rgba

light-dark-function (csstools)

Use the light-dark() color function in CSS

npm: npm -i @csstools/postcss-light-dark-function
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

logical

Use logical properties and values in CSS

npm: npm -i postcss-logical
Version: 8.1.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

dir
inline
logical
ltr
relative
rtl

logical-float-and-clear (csstools)

Use flow-relative (inline-start and inline-end) values for float and clear

npm: npm -i @csstools/postcss-logical-float-and-clear
Version: 4.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

inline
logical

logical-overflow (csstools)

Use logical overflow properties and values in CSS

npm: npm -i @csstools/postcss-logical-overflow
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

logical

logical-overscroll-behavior (csstools)

Use logical overscroll behavior properties and values in CSS

npm: npm -i @csstools/postcss-logical-overscroll-behavior
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

logical
overscroll-behavior

logical-resize (csstools)

Use logical values in the resize property

npm: npm -i @csstools/postcss-logical-resize
Version: 4.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

inline
logical

logical-viewport-units (csstools)

Use vb and vi length units in CSS

npm: npm -i @csstools/postcss-logical-viewport-units
Version: 4.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

inline
logical

lost

LostGrid is a powerful grid system built in PostCSS that works with any preprocessor and even vanilla CSS.

npm: npm -i lost
Version: 9.0.2
License: MIT
PostCSS version range: ^8.4.14

grid

matches-is-pseudo-class

Postcss plugin which converts :matches() pseudo classes into :is() and reverse.

npm: npm -i postcss-matches-is-pseudo-class
Version: 1.0.7
License: MIT
PostCSS version range: ^8.2.8
Node version range: >=14.0.0

matches

media-minmax

Using more intuitive `>=`, `<=`, `>`, `<` instead of media queries min/max prefix.

npm: npm -i postcss-media-minmax
Version: 5.0.0
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=10.0.0

media query

media-minmax (csstools)

Use the range notation in CSS media queries

npm: npm -i @csstools/postcss-media-minmax
Version: 3.0.0
License: MIT
PostCSS version range: ^8.4
Node version range: >=20.19.0

media query

media-queries-aspect-ratio-number-values (csstools)

Use number values in aspect-ratio media queries.

npm: npm -i @csstools/postcss-media-queries-aspect-ratio-number-values
Version: 4.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

aspect-ratio
media query

merge-at-rules

PostCSS plugin for merging and nesting CSS at rules

npm: npm -i postcss-merge-at-rules
Version: 1.2.0
License: MIT
PostCSS version range: ^8.4.38
Node version range: >=14.0.0

css-optimizations
merge-at-rules
responsive-css

merge-idents

Merge keyframe and counter style identifiers.

npm: npm -i postcss-merge-idents
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

merge-longhand

Merge longhand properties into shorthand with PostCSS.

npm: npm -i postcss-merge-longhand
Version: 7.0.5
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

minify

merge-rules

Merge CSS rules with PostCSS.

npm: npm -i postcss-merge-rules
Version: 7.0.7
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

merge-rules-plus

PostCSS plugin for combining css rules (selectors) that have fully/partially identical declarations

npm: npm -i postcss-merge-rules-plus
Version: 2.0.0
License: MIT
PostCSS version range: ^8.3.0
Node version range: >=12.0.0

minify

PostCSS plugin to remove comments and unnecessary whitespace from CSS files

npm: npm -i postcss-minify
Version: 1.2.0
License: MIT
PostCSS version range: ^8.0

minify

minify (csstools)

A very basic CSS minifier

npm: npm -i @csstools/postcss-minify
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

minifier

minify-font-values

Minify font declarations with PostCSS

npm: npm -i postcss-minify-font-values
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

font-family

minify-gradients

Minify gradient parameters with PostCSS.

npm: npm -i postcss-minify-gradients
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

minify-params

Minify at-rule params with PostCSS

npm: npm -i postcss-minify-params
Version: 7.0.5
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

minify

minify-selectors

Minify selectors with PostCSS.

npm: npm -i postcss-minify-selectors
Version: 7.0.5
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

minify
selector

mixins

PostCSS plugin for mixins

npm: npm -i postcss-mixins
Version: 12.1.2
License: MIT
PostCSS version range: ^8.2.14
Node version range: ^20.0 || ^22.0 || >=24.0

mixin
sass

mixins (csstools)

Use mixins in CSS

npm: npm -i @csstools/postcss-mixins
Version: 1.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

mobile-forever

PostCSS 伸缩视图转换插件。To adapt different displays by one mobile viewport.

npm: npm -i postcss-mobile-forever
Version: 5.0.0
License: MIT
PostCSS version range: ^8.0.0

px
viewport

modify-selectors

PostCSS plugin to modify CSS selectors

npm: npm -i modify-selectors
Version: 2.0.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=10.0.0

selector

modules

PostCSS plugin to use CSS Modules everywhere

npm: npm -i postcss-modules
Version: 6.0.1
License: MIT
PostCSS version range: ^8.0.0

modules (wixc3)

PostCSS plugin to use CSS Modules everywhere

npm: npm -i @wixc3/postcss-modules
Version: 6.1.1
License: MIT
PostCSS version range: ^8.0.0

modules-local-by-default

A CSS Modules transform to make local scope the default

npm: npm -i postcss-modules-local-by-default
Version: 4.2.0
License: MIT
PostCSS version range: ^8.1.0
Node version range: ^10 || ^12 || >= 14

modules-values-replace

PostCSS plugin to work around CSS Modules values limitations

npm: npm -i postcss-modules-values-replace
Version: 4.2.2
License: ISC
PostCSS version range: ^8.2.9

momentum-scrolling

PostCSS plugin for adding 'momentum' style scrolling behavior (-webkit-overflow-scrolling: touch) for elements with overflow (scroll, auto) on iOS

npm: npm -i postcss-momentum-scrolling
Version: 3.14.22
License: MIT
PostCSS version range: ^8.3.6
Node version range: >=10.0.0

safari

mq-last

PostCSS plugin that gives media query rules precedence by moving them to the end of the file

npm: npm -i postcss-mq-last
Version: 2.0.0
License: MIT
PostCSS version range: ^8.0.0

last
media
precedence
query

mq-optimize

PostCSS plugin Removes invalid media queries or its expresions

npm: npm -i postcss-mq-optimize
Version: 2.1.0
License: MIT
PostCSS version range: ^8.0.0

multiple-tailwind

PostCSS plugin to process multiple tailwindcss configs

npm: npm -i postcss-multiple-tailwind
Version: 1.0.1
License: MIT
PostCSS version range: ^8.2.8
Node version range: >=10.0.0

nested

PostCSS plugin to unwrap nested rules like how Sass does it

npm: npm -i postcss-nested
Version: 7.0.2
License: MIT
PostCSS version range: ^8.2.14
Node version range: >=18.0

nested
sass

nested-ancestors

PostCSS plugin to reference any ancestor selector in nested CSS

npm: npm -i postcss-nested-ancestors
Version: 3.0.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=12

selector

nested-calc (csstools)

Use nested calc() expressions in CSS

npm: npm -i @csstools/postcss-nested-calc
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

calc
math
nested

nested-import

PostCSS plugin for importing other stylesheet source files anywhere in your CSS.

npm: npm -i postcss-nested-import
Version: 1.3.0
License: MIT
PostCSS version range: ^8.3.0
Node version range: >=12.0

import

nested-once

Postcss plugin to unwrap nested rules (like how Sass does it), compatible with rollup-plugin-styles

npm: npm -i postcss-nested-once
Version: 1.0.0
License: MIT
PostCSS version range: ^8.3.5
Node version range: >=10.0

nested
sass

nesting

Nest rules inside each other in CSS

npm: npm -i postcss-nesting
Version: 13.0.2
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

nested
selector

no-important

PostCSS plugin for delete declarations !important

npm: npm -i postcss-no-important
Version: 11.0.0
License: MIT
PostCSS version range: ^8.0.0

important

node-sass

A PostCSS plugin to parse styles with node-sass

npm: npm -i postcss-node-sass
Version: 3.1.4
License: MIT
PostCSS version range: ^8.x.x
Node version range: >=10.0.0 <23.0.0

sass
scss

normalize

Use the parts of normalize.css or sanitize.css you need from your browserslist

npm: npm -i postcss-normalize
Version: 13.0.1
License: CC0-1.0
PostCSS version range: >= 8
Node version range: >= 18

normalize-charset

Add necessary or remove extra charset with PostCSS

npm: npm -i postcss-normalize-charset
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

normalize-display-values (csstools)

Use two values display syntax for inner and outer display types.

npm: npm -i @csstools/postcss-normalize-display-values
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

flex
grid
inline

normalize-positions

Normalize keyword values for position into length values.

npm: npm -i postcss-normalize-positions
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

normalize-string

Normalize wrapping quotes for CSS string literals.

npm: npm -i postcss-normalize-string
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

normalize-stylus-compatible-container-query-syntax

PostCSS plugin changing the Stylus-compatible irregular container queries syntax to the regular one.

npm: npm -i postcss-normalize-stylus-compatible-container-query-syntax
Version: 1.1.2
License: MIT
PostCSS version range: ^8.4.27
Node version range: >=18.0.0

container-query

normalize-unicode

Normalize unicode-range descriptors, and can convert to wildcard ranges.

npm: npm -i postcss-normalize-unicode
Version: 7.0.5
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

normalize-url

Normalize URLs with PostCSS

npm: npm -i postcss-normalize-url
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

url

normalize-whitespace

Trim whitespace inside and around CSS rules & declarations.

npm: npm -i postcss-normalize-whitespace
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

oklab-function (csstools)

Use oklab() and oklch() color functions in CSS

npm: npm -i @csstools/postcss-oklab-function
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color
display-p3
oklab
oklch

old-safari-logical-properties-polyfill

PostCSS plugin that polyfill W3C's CSS proposal to support logical properties and values

npm: npm -i postcss-old-safari-logical-properties-polyfill
Version: 1.0.1
License: MIT
PostCSS version range: ^8
Node version range: >=12

logical
ltr
rtl
safari

opacity-percentage

PostCSS plugin to transform percentage-based opacity values to more compatible floating-point values.

npm: npm -i postcss-opacity-percentage
Version: 3.0.0
License: MIT
PostCSS version range: ^8.4
Node version range: >=18

ordered-values

Ensure values are ordered consistently in your CSS.

npm: npm -i postcss-ordered-values
Version: 7.0.2
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

overflow-fallbacks

Postcss plugin which provides fallbacks for `overflow: clip` and `overflow: overlay`

npm: npm -i postcss-overflow-fallbacks
Version: 1.0.7
License: MIT
PostCSS version range: >=8.0.0
Node version range: >=14.0.0

overflow-shorthand

Use the overflow shorthand in CSS

npm: npm -i postcss-overflow-shorthand
Version: 6.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

shorthand

page-break

PostCSS plugin postcss-page-break to fallback `break-` properties with `page-break-` alias

npm: npm -i postcss-page-break
Version: 3.0.4
License: MIT
PostCSS version range: ^8

perfectionist-dfd

Beautify and/or normalize CSS files. Fork and update of a fork and update of an archived project.

npm: npm -i perfectionist-dfd
Version: 3.0.3
License: MIT
PostCSS version range: ^8.4.12

pixrem

A CSS post-processor that generates pixel fallbacks for rem units.

npm: npm -i postcss-pixrem
Version: 6.0.6
License: BSD-3-Clause
PostCSS version range: >=8.0.0
Node version range: >=10

parser
postproccessor
rem

place

Use a place-* shorthand for align-* and justify-* in CSS

npm: npm -i postcss-place
Version: 10.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

shorthand

plugin (eik)

PostCSS plugin that uses Eik defined import map files to transform bare import specifiers to absolute URLs in @import rules

npm: npm -i @eik/postcss-plugin
Version: 5.0.9
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=20

import
url

plugin (shopify)

Shopify's org-wide PostCSS preset

npm: npm -i @shopify/postcss-plugin
Version: 5.0.4
License: MIT
PostCSS version range: ^8.2.8

plugin-ignore-file

PostCSS plugin that ignore a file with a comment

npm: npm -i postcss-plugin-ignore-file
Version: 1.0.1
License: MIT
PostCSS version range: ^8.3.0
Node version range: >=18.0.0

plugin-shared

Shared utilities for postcss-plugins monorepo packages.

npm: npm -i postcss-plugin-shared
Version: 1.0.0
License: MIT
PostCSS version range: ^8

shared
utils

polyfill-flex-gap

PostCSS plugin to polyfill flex gap

npm: npm -i postcss-polyfill-flex-gap
Version: 1.0.0
License: MIT
PostCSS version range: ^8.4.27
Node version range: >=18.0.0

position-area-property (csstools)

Fallback `position-area` to the alternate name `inset-area`

npm: npm -i @csstools/postcss-position-area-property
Version: 2.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

prefers-color-scheme

Use light and dark color schemes in all browsers

npm: npm -i css-prefers-color-scheme
Version: 11.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color
media
query

prefix-hover

PostCSS plugin for prefixing a selection containing :hover

npm: npm -i postcss-prefix-hover
Version: 1.0.3
License: MIT
PostCSS version range: ^8.2.8
Node version range: >=10.0.0

hover

prefix-selector

Prefix all CSS rules with a selector

npm: npm -i postcss-prefix-selector
Version: 2.1.1
License: MIT
PostCSS version range: ^8.0.0

prefix
selector

prefixer

postcss plugin to prefix all css selector classes and ids

npm: npm -i postcss-prefixer
Version: 3.0.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: ^10 || ^12 || >=14

preset-env

Convert modern CSS into something browsers understand

npm: npm -i postcss-preset-env
Version: 10.6.1
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

progressive-custom-properties (csstools)

Correctly declare progressive enhancements for CSS Custom Properties.

npm: npm -i @csstools/postcss-progressive-custom-properties
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

variables

property-lookup

PostCSS plugin that allows referencing property values without a variable

npm: npm -i postcss-property-lookup
Version: 3.0.0
License: MIT
PostCSS version range: ^8.2.15
Node version range: >= 10

property-rule-prelude-list (csstools)

Declare a list of custom properties in a single at-property rule

npm: npm -i @csstools/postcss-property-rule-prelude-list
Version: 2.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

proportional

PostCSS plugin to make layouts responsively proportional

npm: npm -i postcss-proportional
Version: 1.0.0
License: MIT
PostCSS version range: ^8.4.27
Node version range: >=18.0.0

proportional

pseudo-class-any-link

Use the :any-link pseudo-class in CSS

npm: npm -i postcss-pseudo-class-any-link
Version: 10.0.1
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=18

px-morph

A flexible PostCSS plugin to transform px to rem, vw, or a hybrid of both, with advanced configuration.

npm: npm -i postcss-px-morph
Version: 1.0.2
License: MIT
PostCSS version range: ^8.0.0

h5
px
pxtovw
rem
vw

pxtorem

A CSS post-processor that converts px to rem.

npm: npm -i postcss-pxtorem
Version: 6.1.0
License: MIT
PostCSS version range: ^8.0.0

px
rem

pxtorem (minko-fe)

A postcss plugin that converts px to rem.

npm: npm -i @minko-fe/postcss-pxtorem
Version: 1.5.0
License: MIT
PostCSS version range: >=8.0.0

px
rem

pxtorem-vite-vue2

A CSS post-processor that converts px to rem.

npm: npm -i postcss-pxtorem-vite-vue2
Version: 6.0.0
License: MIT
PostCSS version range: ^8.0.0

px
rem

pxtrans

PostCSS plugin that converts px units to rpx/rem/vw/px for multiple platforms.

npm: npm -i postcss-pxtrans
Version: 1.0.0
License: MIT
PostCSS version range: ^8

px
rem
rpx
vw

pxtransform

PostCSS plugin px 转小程序 rpx及h5 rem 单位

npm: npm -i postcss-pxtransform
Version: 4.1.9
License: MIT
PostCSS version range: ^8
Node version range: >= 18

random-function (csstools)

Use the random function in CSS

npm: npm -i @csstools/postcss-random-function
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

random

react-zero-ui (austinserb)

Zero re-render UI state management for React

npm: npm -i @austinserb/react-zero-ui
Version: 1.0.21
License: MIT
PostCSS version range: ^8.5.5
Node version range: >=18.0.0

no-rerender
pre-rendering
react-zero-ui
state
zero-config
zero-ui

rebase-url (csstools)

Rebase url() functions when transforming CSS

npm: npm -i @csstools/postcss-rebase-url
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

url

reduce-idents

Reduce custom identifiers with PostCSS.

npm: npm -i postcss-reduce-idents
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

reduce-initial

Reduce initial definitions to the actual initial value, where possible.

npm: npm -i postcss-reduce-initial
Version: 7.0.5
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

reference

PostCSS plugin for referencing selectors' rules from CSS files and defined rulesets.

npm: npm -i postcss-reference
Version: 2.2.1
License: MIT
PostCSS version range: ^8.4.16

extend
import

relative-color-syntax (csstools)

Use the relative color syntax in CSS

npm: npm -i @csstools/postcss-relative-color-syntax
Version: 4.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

color
relative color syntax

rem-to-responsive-pixel

Convert rem units to px or rpx units using PostCSS. Based on postcss-pxtorem and postcss-rem-to-pixel, and rewrite with typescript, and support Postcss8

npm: npm -i postcss-rem-to-responsive-pixel
Version: 7.0.0
License: MIT
PostCSS version range: ^8
Node version range: >=16.6.0

miniprogram
mp
preset
px
rem
rpx
uni
uni-app
wechat
小程序
微信

rem-to-viewport

Convert rem units to viewport units using PostCSS.

npm: npm -i postcss-rem-to-viewport
Version: 2.0.0
License: MIT
PostCSS version range: ^8

rem
rem-to-viewport
viewport
vw

remove-duplicate-values

🚀 PostCSS plugin that intelligently removes duplicate CSS properties, reduces bundle size, and improves CSS maintainability. Handles !important declarations, vendor prefixes, and selector filtering with zero configuration.

npm: npm -i postcss-remove-duplicate-values
Version: 2.0.0
License: MIT
PostCSS version range: ^8.4

bundle-optimization
performance

remove-font-face-format

PostCSS plugin to remove font faces by format

npm: npm -i postcss-remove-font-face-format
Version: 5.0.0
License: MIT
PostCSS version range: 8.5.6
Node version range: >=20.0.0

remove-google-fonts

PostCSS plugin to remove Google Fonts

npm: npm -i postcss-remove-google-fonts
Version: 1.2.4
License: GPL-3.0-only
PostCSS version range: ^8.4.33

replace

PostCSS plugin for replacing strings.

npm: npm -i postcss-replace
Version: 2.0.1
License: MIT
PostCSS version range: ^8.4
Node version range: ^12 || ^14 || >=16

replace-overflow-wrap

PostCSS plugin to replace overflow-wrap with word-wrap or optionally retain both declarations.

npm: npm -i postcss-replace-overflow-wrap
Version: 4.0.0
License: MIT
PostCSS version range: ^8.0.3

rewrite-url (csstools)

Rewrite url values in CSS

npm: npm -i @csstools/postcss-rewrite-url
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

rewrite
url

round-subpixels

PostCSS plugin that rounds sub-pixel values to the nearest full pixel.

npm: npm -i postcss-round-subpixels
Version: 2.0.0
License: MIT
PostCSS version range: ^8.0.0

compatibility
fallback

rtl

PostCSS plugin for RTL-optimizations

npm: npm -i postcss-rtl
Version: 2.0.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=14.0.0

ltr
rtl

rtl (mjhenkes)

PostCSS plugin for RTL-optimizations

npm: npm -i @mjhenkes/postcss-rtl
Version: 2.0.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=0.12

ltr
rtl

rtlcss

PostCSS plugin to build Cascading Style Sheets (CSS) with Left-To-Right (LTR) and Right-To-Left (RTL) rules

npm: npm -i postcss-rtlcss
Version: 5.7.1
License: Apache-2.0
PostCSS version range: ^8.4.21
Node version range: >=18.0.0

ltr
rtl

sass (csstools)

Use Sass as a PostCSS plugin

npm: npm -i @csstools/postcss-sass
Version: 5.1.1
License: CC0-1.0
PostCSS version range: ^8.4.6
Node version range: ^12 || ^14 || >=16

sass
scss

scope-pseudo-class (csstools)

The Reference Element Pseudo-class: :scope

npm: npm -i @csstools/postcss-scope-pseudo-class
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

scope
selector

scopify

PostCSS plugin that adds a user input scope to each selector

npm: npm -i postcss-scopify
Version: 1.0.0
License: MIT
PostCSS version range: ^8.3.0

css post processing
scope
scoped css

selector-not

PostCSS plugin to transform :not() W3C CSS level 4 pseudo class to :not() CSS level 3 selectors

npm: npm -i postcss-selector-not
Version: 8.0.1
License: MIT
PostCSS version range: ^8.4
Node version range: >=18

selector

selector-prefix

PostCSS plugin to add a selector prefix to all selectors.

npm: npm -i postcss-selector-prefix
Version: 5.0.1
License: MIT
PostCSS version range: ^8.4.27
Node version range: >=18.0.0

prefix
selector

selector-rename

A PostCSS plugin to rename css selector

npm: npm -i postcss-selector-rename
Version: 3.0.1
License: MIT
PostCSS version range: ^8.0.0

shadrem (classicmike)

This PostCSS plugin replaces standard rem units with a custom shadrem unit to enable REM-like support within Shadow DOM. It uses the font size of the shadow root as the base for shadrem measurements, ensuring consistent styling that adapts to the shadow D

npm: npm -i @classicmike/postcss-shadrem
Version: 1.1.0
License: MIT
PostCSS version range: ^8.4.27
Node version range: >=16.0.0

sign-functions (csstools)

Use sign and abs functions in CSS

npm: npm -i @csstools/postcss-sign-functions
Version: 2.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

abs
sign

simple-vars

PostCSS plugin for Sass-like variables

npm: npm -i postcss-simple-vars
Version: 7.0.1
License: MIT
PostCSS version range: ^8.2.1
Node version range: >=14.0
Funding: opencollective

sass
variables

size

PostCSS plugin for size shortcut

npm: npm -i postcss-size
Version: 5.0.0
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=18.0

slow-plugins (csstools)

Identify slow plugins in your PostCSS config

npm: npm -i @csstools/postcss-slow-plugins
Version: 3.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

debug
performance
profiling
slow

smart-asset

PostCSS plugin to rebase or inline on url().

npm: npm -i postcss-smart-asset
Version: 3.1.0
License: MIT
PostCSS version range: ^8.4.12
Node version range: >=14

base64
inline
url

sort-media-queries

PostCSS plugin for sorting and combining CSS media queries with mobile first / **desktop first methodologies

npm: npm -i postcss-sort-media-queries
Version: 5.2.0
License: MIT
PostCSS version range: ^8.4.23
Node version range: >=14.0.0

combine-media-query
css-mqpacker
css-optimizations
desktop-first
media query
node-css-mqpacker
responsive-css
sort-media-query

sorting

PostCSS plugin to keep rules and at-rules content in order.

npm: npm -i postcss-sorting
Version: 9.1.0
License: MIT
PostCSS version range: ^8.4.20

order
sorting

sparrow

A PostCSS plugin that helps you remove, replace, append or prepend CSS declarations without the need of writing another PostCSS plugin.

npm: npm -i postcss-sparrow
Version: 1.0.2
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=8.0.0

stack

A better way to manage z-indexes

npm: npm -i postcss-stack
Version: 5.0.0
License: MIT
PostCSS version range: ^8.3.6
Node version range: >=12.0.0

z-index

stepped-value-functions (csstools)

Use round, rem and mod functions in CSS

npm: npm -i @csstools/postcss-stepped-value-functions
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

stylehacks

Detect/remove browser hacks from CSS files.

npm: npm -i stylehacks
Version: 7.0.7
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

svgo

Optimise inline SVG with PostCSS.

npm: npm -i postcss-svgo
Version: 7.1.0
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >= 18

minify

syntax-descriptor-syntax-production (csstools)

Use the syntax production in syntax descriptors

npm: npm -i @csstools/postcss-syntax-descriptor-syntax-production
Version: 2.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

system-ui-font-family (csstools)

Use the `system-ui` keyword

npm: npm -i @csstools/postcss-system-ui-font-family
Version: 2.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

text-decoration-shorthand (csstools)

Use text-decoration in it's shorthand form in CSS

npm: npm -i @csstools/postcss-text-decoration-shorthand
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

shorthand

themes (wordpress)

PostCSS plugin to generate theme colors.

npm: npm -i @wordpress/postcss-themes
Version: 6.38.0
License: GPL-2.0-or-later
PostCSS version range: ^8.0.0
Node version range: >=18.12.0

color

trigonometric-functions (csstools)

Use sin(), cos(), tan(), acos(), atan(), and atan2() to compute trigonometric relationships

npm: npm -i @csstools/postcss-trigonometric-functions
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

trigonometric

typescript-d-ts

Generates TypeScript definition (.d.ts) files for each of the postcss modules file

npm: npm -i postcss-typescript-d-ts
Version: 1.0.0
License: MIT
PostCSS version range: ^8.1.5
Node version range: >=10.0.0

unique-selectors

Ensure CSS selectors are unique.

npm: npm -i postcss-unique-selectors
Version: 7.0.4
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

unit-processor

PostCSS plugin to process css unit.

npm: npm -i postcss-unit-processor
Version: 1.4.2
License: MIT
PostCSS version range: ^8.0.0

unit

unset-value (csstools)

Use the unset keyword in CSS.

npm: npm -i @csstools/postcss-unset-value
Version: 5.0.0
License: MIT-0
PostCSS version range: ^8.4
Node version range: >=20.19.0

url

PostCSS plugin to rebase or inline on url().

npm: npm -i postcss-url
Version: 10.1.3
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=10

base64
inline
url

urlrebase

PostCSS plugin Rebase URLs to a given root URL.

npm: npm -i postcss-urlrebase
Version: 1.4.0
License: MIT
PostCSS version range: ^8.3.0

urlrev

PostCSS plugin for css url revision

npm: npm -i postcss-urlrev
Version: 3.0.1
License: MIT
PostCSS version range: ^8.4.12
Node version range: ^10 || ^12 || >=14

url

utopia

PostCSS plugin to generate fluid typopgraphy and space scales

npm: npm -i postcss-utopia
Version: 1.1.0
License: MIT
PostCSS version range: ^8.4.33

utopia

var-func-fallback

PostCSS plugin Adds fallback values to var(name) occurences.

npm: npm -i postcss-var-func-fallback
Version: 3.0.1
License: MIT
PostCSS version range: ^8
Node version range: >= 14

var-optimize

PostCSS plugin to convert css variables that are not redeclared and remove duplicates

npm: npm -i postcss-var-optimize
Version: 8.1.0
License: MIT
PostCSS version range: ^8.0.0
Node version range: >=8.0.0

variables

var-replace

PostCSS plugin to replace CSS variables with their static values

npm: npm -i postcss-var-replace
Version: 1.0.0
License: MIT
PostCSS version range: ^8.4.31
Node version range: >=18.0.0
Funding: github

var
variables

variable-compress

PostCSS plugin cleans up the variable names and saves space. It can will reduce your css variable to smaller variables

npm: npm -i postcss-variable-compress
Version: 3.0.0
License: MIT
PostCSS version range: ^8.2.8
Node version range: >=10.0.0

cssnano
minify

variables-prefixer

postcss plugin to prefix all css custom properties

npm: npm -i postcss-variables-prefixer
Version: 1.2.0
License: MIT
PostCSS version range: ^8.2.13
Node version range: >=10.0.0

100vh-fix

PostCSS plugin to fix height/min-height: 100vh on iOS

npm: npm -i postcss-100vh-fix
Version: 2.0.0
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=20.0
Funding: opencollective

safari

view-sizes

PostCSS plugin size based on the viewport polyfill

npm: npm -i postcss-view-sizes
Version: 1.0.0
License: MIT
PostCSS version range: ^8.4.27
Node version range: >=18.0.0

watch-folder

PostCSS plugin which watches folder for new files

npm: npm -i postcss-watch-folder
Version: 2.0.0
License: MIT
PostCSS version range: ^8.0.0

will-change

PostCSS plugin to insert 3D hack before will-change property

npm: npm -i postcss-will-change
Version: 4.0.1
License: MIT
PostCSS version range: ^8.1.0
Node version range: >=10.0
Funding: opencollective

fallback

windicss

PostCSS plugin for Windi CSS

npm: npm -i postcss-windicss
Version: 1.0.0
License: MIT
PostCSS version range: ^8.0.0

zindex

Reduce z-index values with PostCSS.

npm: npm -i postcss-zindex
Version: 7.0.1
License: MIT
PostCSS version range: ^8.4.32
Node version range: ^18.12.0 || ^20.9.0 || >=22.0

z-index

PostCSS Plugin Directory

Criteria

Directory

advanced-variables

alpha-function (csstools)

animations

aspect-ratio-property

assets

atomizer

attribute-case-insensitive

autoprefixer

better-units

blank-pseudo

browser-comments

bundler (csstools)

calc

cascade-layers (csstools)

clamp

class-apply

classes-to-mixins

clip-path-polyfill

cnjm-postcss-px-to-viewport

color-converter

color-function (csstools)

color-function-display-p3-linear (csstools)

color-functional-notation

color-hex-alpha

color-hsla-fallback

color-mix-function (csstools)

color-mix-variadic-function-arguments (csstools)

color-mod-function

color-rebeccapurple

color-scheme

colorguard

colormin

combine-duplicated-selectors

combine-media-query

componentry

conditionals-renewed

content-alt-text (csstools)

contrast-color-function (csstools)

convert-values

csscomb

cssnano

custom-media

custom-media-generator

custom-properties

custom-properties-fallback

custom-selectors

dark-theme-class

debug-logger (csstools)

declaration-sorter

delete-duplicate-css

design-token-utils

design-tokens

design-tokens (csstools)

dir-pseudo-class

disabled

discard-comments

discard-duplicates

discard-empty

discard-overridden

discard-unused

double-position-gradients

each

easings

easy-import

editor-styles-wrapper

em-media-query

env-function

exponential-functions (csstools)

extend-rule

extract (csstools)

extract-css-variables (lesjoursfr)

extract-media-query

figma-blur-fix

flex-gap-polyfill

flexbox-reset

flexbugs-fixes

flexibility