node package manager
Stop wasting time. Easily manage code sharing in your team. Create a free org »


npm node deps tests cover code style chat



npm i -g|-D postcss-cli


postcss [input.css] [OPTIONS] [-o|--output output.css] [-w|--watch]

The input may also be a glob:

postcss src/*.css [OPTIONS]

Recursively read a directory:

postcss src/**/*.css [OPTIONS]

⚠️ If there are multiple input files, the --dir or --replace option must be passed.

cat input.css | postcss [OPTIONS] > output.css

⚠️ If no input files are passed, it reads from stdin. If neither -o, --dir, or --replace is passed, it writes to stdout.


Name Type Default Description
-d, --dir {String} undefined Output Directory
-b, --base {String} undefined Use together with --dir for keeping directory structure.
-x, --ext {String} extname(output) Output File Extension
-o, --output {String} undefined Output File
-r, --replace {String} undefined Replace Input <=> Output
-p, --parser {String} undefined Custom PostCSS Parser
-s, --syntax {String} undefined Custom PostCSS Syntax
-t, --stringifier {String} undefined Custom PostCSS Stringifier
-w, --watch {Boolean} false Enable Watch Mode
--poll {Boolean\|Number} 100 Use polling for file watching. Can optionally pass polling interval; default 100 ms
-u, --use {Array} [] PostCSS Plugins
-m, --map {Boolean} { inline: true } External Sourcemaps
--no-map {Boolean} false Disable Sourcemaps
-e, --env {String} process.env.NODE_ENV Sets $NODE_ENV
-c, --config {String} dirname(file) PostCSS Config Path postcss.config.js
-h, --help {Boolean} false CLI Help
-v, --version {Boolean} false CLI Version

ℹ️ More details on custom parsers, stringifiers and syntaxes, can be found here.


If you need to pass options to your plugins, or have a long plugin chain, you'll want to use a configuration file.


module.exports = {
  parser: 'sugarss',
  plugins: [
    require('postcss-url')({ url: 'copy', useHash: true })

Note that you can not set the from or to options for postcss in the config file. They are set automatically based on the CLI arguments.


For more advanced usage it's recommend to to use a function in postcss.config.js, this gives you access to the CLI context to dynamically apply options and plugins per file

Name Type Default Description
env {String} 'development' process.env.NODE_ENV
file {Object} dirname, basename, extname File
options {Object} map, parser, syntax, stringifier PostCSS Options


module.exports = (ctx) => ({
  parser: ctx.file.extname === '.sss' ? 'sugarss' : false,
  plugins: {
    'postcss-import': { root: ctx.file.dirname },
    'cssnano': ctx.env === 'production' ? {} : false

⚠️ If you want to set options via CLI, it's mandatory to reference ctx.options in postcss.config.js

postcss input.sss -p sugarss -o output.css -m


module.exports = (ctx) => ({
  parser: ctx.options.parser,
  plugins: {
    'postcss-import': { root: ctx.file.dirname },
    'cssnano': ctx.env === 'production' ? {} : false