Lightning CSS — Blazing-Fast CSS Parser and Minifier in Rust

Introduction

Lightning CSS is a CSS parser, transformer, bundler, and minifier written in Rust. It handles vendor prefixing, syntax lowering, CSS modules, and minification in a single pass, replacing the need for PostCSS, Autoprefixer, and cssnano while running orders of magnitude faster. It is used by Vite, Parcel, and other build tools.

What Lightning CSS Does

• Parses CSS into a typed AST with full spec compliance and error recovery
• Automatically adds or removes vendor prefixes based on browser targets
• Lowers modern CSS syntax (nesting, color functions, cascade layers) for older browsers
• Bundles CSS @import rules into a single file with dependency resolution
• Minifies CSS with structural optimizations beyond simple whitespace removal

Architecture Overview

Lightning CSS is implemented in Rust and compiled to native code and WebAssembly for Node.js and browser usage. The parser produces a typed AST where each CSS property is represented as a Rust enum variant, enabling type-safe transformations. A single pass over the AST handles prefixing, syntax lowering, and minification simultaneously, avoiding the multi-pass overhead of PostCSS plugin chains.

Self-Hosting & Configuration

• Install the CLI with npm install lightningcss-cli or the library with npm install lightningcss
• Set browser targets using browserslist syntax or explicit version numbers
• Enable CSS modules with cssModules: true in the transform options
• Use the bundle() API to resolve @import dependencies into a single output
• Integrate with Vite via its built-in Lightning CSS support or with Parcel as the default

Key Features

• Written in Rust for native performance: 100x faster than equivalent PostCSS setups
• Single-tool replacement for PostCSS, Autoprefixer, cssnano, and CSS modules plugin
• CSS nesting, custom media queries, and oklch color lowering for older browsers
• CSS modules support with scoped class names and composition
• Available as a CLI, Node.js API, Rust crate, and WASM module

Comparison with Similar Tools

• PostCSS + Autoprefixer — plugin-based and slower; Lightning CSS handles all transforms in one native pass
• cssnano — minification only; Lightning CSS also prefixes, lowers syntax, and bundles
• Sass/Less — preprocessors with custom syntax; Lightning CSS works with standard CSS
• Tailwind CSS — utility-first framework; Lightning CSS is a low-level CSS processing tool
• esbuild CSS — fast but limited CSS handling; Lightning CSS has deeper spec compliance and more transforms

FAQ

Q: Can I use Lightning CSS with Vite? A: Yes. Vite has built-in support for Lightning CSS as its CSS processor via the css.lightningcss config option.

Q: Does Lightning CSS replace PostCSS entirely? A: For most use cases (prefixing, nesting, minification, modules), yes. Custom PostCSS plugins may still require PostCSS.

Q: What CSS features does it downlevel? A: Nesting, color functions (oklch, lab), cascade layers, custom media queries, range syntax for media queries, and more.

Q: Is there a Rust API? A: Yes. Lightning CSS is available as a Rust crate for direct integration into Rust-based build tools.

Sources

• https://github.com/parcel-bundler/lightningcss
• https://lightningcss.dev