# @fullhuman/postcss-purgecss

> PostCSS plugin for PurgeCSS

Latest version **8.0.0** (published 2026-01-24) · MIT license · 0 weekly downloads

## Install

```sh
npm install @fullhuman/postcss-purgecss
pnpm add @fullhuman/postcss-purgecss
yarn add @fullhuman/postcss-purgecss
bun add @fullhuman/postcss-purgecss
```

## Health

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

Positive: has types; esm support; no vulnerabilities; has provenance; high quality score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 8.0.0 |
| Published | 2026-01-24 |
| First published | 2018-05-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 17.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 8050 |
| Author | FoundrySH |
| Maintainers | ffloriel, jsnanigans |

## Links

- npm: https://www.npmjs.com/package/@fullhuman/postcss-purgecss
- Repository: https://github.com/FullHuman/purgecss
- Homepage: https://purgecss.com
- Issues: https://github.com/FullHuman/purgecss/issues
- npm.io page: https://npm.io/package/@fullhuman/postcss-purgecss

## Dependencies (1)

- [purgecss](https://npm.io/package/purgecss.md) ^8.0.0

## Recent versions

- 8.0.0 (latest) — 2026-01-24
- 6.0.0-alpha.0 (next) — 2023-04-23
- 7.0.2 — 2024-11-21
- 7.0.1-alpha.0 — 2024-11-21
- 6.0.0 — 2024-03-29
- 5.0.0 — 2022-09-13
- 4.1.3 — 2021-11-29
- 4.1.2 — 2021-11-29
- 4.1.1 — 2021-11-28
- 4.1.0 — 2021-11-28
- 4.0.3 — 2021-03-20
- 4.0.2 — 2021-02-21
- 4.0.1 — 2021-02-21
- 4.0.0 — 2021-01-17
- 3.1.3 — 2020-12-15
- … 17 more at https://npm.io/package/@fullhuman/postcss-purgecss/versions

## README

# PostCSS Purgecss
![David (path)](https://img.shields.io/david/FullHuman/purgecss?path=packages%2Fpostcss-purgecss&style=for-the-badge)
![Dependabot](https://img.shields.io/badge/dependabot-enabled-%23024ea4?style=for-the-badge)
![npm](https://img.shields.io/npm/v/@fullhuman/postcss-purgecss?style=for-the-badge)
![npm](https://img.shields.io/npm/dw/@fullhuman/postcss-purgecss?style=for-the-badge)
![GitHub](https://img.shields.io/github/license/FullHuman/purgecss?style=for-the-badge)

[PostCSS] plugin for PurgeCSS.

[PostCSS]: https://github.com/postcss/postcss

## Installation

```
npm i -D @fullhuman/postcss-purgecss postcss
```

## Usage

```js
const purgecss = require('@fullhuman/postcss-purgecss')
postcss([
  purgecss({
    content: ['./src/**/*.html']
  })
])
```

See [PostCSS] docs for examples for your environment.

## Options

All of the options of purgecss are available to use with the plugins.
You will find below the main options available. For the complete list, go to the [purgecss documentation website](https://www.purgecss.com/configuration.html#options).

### `content` (**required** or use `contentFunction` instead)
Type: `Array<string>`

You can specify content that should be analyzed by Purgecss with an array of filenames or globs. The files can be HTML, Pug, Blade, etc.

### `contentFunction` (as alternative to `content`)
Type: `(sourceInputFile: string) => Array<string>`

The function receives the current source input file. With this you may provide a specific array of globs for each input. E.g. for 
an angular application only scan the components template counterpart for every component scss file:

```js
purgecss({
  contentFunction: (sourceInputFileName: string) => {
    if (/component\.scss$/.test(sourceInputFileName))
      return [sourceInputFileName.replace(/scss$/, 'html')]
    else
      return ['./src/**/*.html']
  },
})
```

### `extractors`
Type: `Array<Object>`

Purgecss can be adapted to suit your needs. If you notice a lot of unused CSS is not being removed, you might want to use a custom extractor.
More information about extractors [here](https://www.purgecss.com/extractors.html).

### `safelist`

You can indicate which selectors are safe to leave in the final CSS. This can be accomplished with the option `safelist`.

Two forms are available for this option.

```ts
safelist: ['random', 'yep', 'button', /^nav-/]
```

In this form, safelist is an array that can take a string or a regex.

The _complex_ form is:

```ts
safelist: {
    standard: ['random', 'yep', 'button', /^nav-/],
    deep: [],
    greedy: [],
    keyframes: [],
    variables: []
}
```

### `blocklist`

Blocklist will block the CSS selectors from appearing in the final output CSS. The selectors will be removed even when they are seen as used by PurgeCSS.

```ts
blocklist: ['usedClass', /^nav-/]
```
Even if nav-links and usedClass are found by an extractor, they will be removed.

### `skippedContentGlobs`

If you provide globs for the `content` parameter, you can use this option to exclude certain files or folders that would otherwise be scanned. Pass an array of globs matching items that should be excluded. (Note: this option has no effect if `content` is not globs.)

```ts
skippedContentGlobs: ['node_modules/**', 'components/**']
```
Here, PurgeCSS will not scan anything in the "node_modules" and "components" folders.


### `rejected`
Type: `boolean`
Default value: `false`

If true, purged selectors will be captured and rendered as PostCSS messages.
Use with a PostCSS reporter plugin like [`postcss-reporter`](https://github.com/postcss/postcss-reporter)
to print the purged selectors to the console as they are processed.

### `keyframes`
Type: `boolean`
Default value: `false`

If you are using a CSS animation library such as animate.css, you can remove unused keyframes by setting the keyframes option to true.

#### `fontFace`
Type: `boolean`
Default value: `false`

If there are any unused @font-face rules in your css, you can remove them by setting the fontFace option to true.

## Contributing

Please read [CONTRIBUTING.md](./../../CONTRIBUTING.md) for details on our code of
conduct, and the process for submitting pull requests to us.

## Versioning

postcss-purgecss use [SemVer](http://semver.org/) for versioning.

## License

This project is licensed under the MIT License - see the [LICENSE](./../../LICENSE) file
for details.

---
_Source: https://npm.io/package/@fullhuman/postcss-purgecss · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._