postcss-cssnext/docs/content/setup.md

Use tomorrow’s CSS syntax, today

---
title: Install & setup postcss-cssnext
subtitle: How to use postcss-cssnext in your workflow
backgroundModifier: darkTeam
---

@[toc]

## Installation

postcss-cssnext is available on [npm](https://www.npmjs.org/package/postcss-cssnext)

```console
$ npm install postcss postcss-cssnext
```

## Usage

You can use directly PostCSS API but you will probably want to choose and use a
PostCSS runner that suits your workflow:

<p class="cssnext-Tools">
  <a href="https://www.npmjs.com/package/postcss-cli">CLI</a>,
  <a href="https://www.npmjs.com/package/postcss-loader">webpack</a>,
  <a href="https://www.npmjs.com/package/gulp-postcss">gulp</a>,
  <a href="https://www.npmjs.com/package/grunt-postcss">grunt</a>,
  <a href="https://www.npmjs.com/package/browserify-postcss">browserify</a>,
  <a href="https://www.npmjs.com/package/postcss-brunch">brunch</a>,
  <a href="https://www.npmjs.com/package/broccoli-postcss">broccoli</a>,
  <a href="https://www.npmjs.com/package/fly-postcss">fly</a>,
  <a href="https://www.npmjs.com/package/postcss-middleware">connect/express</a>,
  <a href="https://www.npmjs.com/package/duo-postcss">duo</a>
  or in
  <a href="https://prepros.io/">Prepros</a>
</p>

---

## Wait, what? Where is the previous cssnext interface?

[`cssnext` is dead. Long live to `postcss-cssnext`.](/postcss/)


## Wait, what is PostCSS?

[Here is what you are looking for.](https://github.com/postcss/postcss#readme)