Installing Master CSS
Install Master CSS with Vite, generate CSS from class names, and start styling in a few steps.
Runtime, zero-runtime, or hydration — it’s your call.
Use the CLI as a standalone static rendering fallback when a project does not have a Vite asset build, framework integration, or server rendering hook. Integration guides should prefer the matching Vite, runtime, static, or progressive setup first.
Installation
Install Master CSS
Install Master CSS CLI as a development dependency.
npm install -D @master/css-cli@rcCreate your CSS entry
Create a stylesheet that imports the default Master CSS entry.
@import "@master/css";Run the build command
Run the command to scan sources and write master.css.
npx @master/css-cli "index.html" --output master.css --watchStart using Master CSS
Master CSS scans raw sources and generates the ./master.css file for you.
Now style your first element using Master CSS syntax!
Hello World
<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="./master.css"> </head><body> <h1 class="m:2xl italic font:5xl font:heavy text:neutral">Hello World</h1></body></html>Stuck or need framework integration? Explore our integration guides for tailored starting points and recommendations.
Learn what Master CSS is, write your first classes, and choose the next guide to read.
Learn browser support, native declaration fallback, vendor prefixes, modern CSS feature strategy, and how Master CSS coexists with third-party styles.