A markup-driven CSS language with enhanced syntax
Visit beta.css.master.co to view the full documentation
Check out the official guides to get started with Master CSS, or walk through the examples for a quick overview of integrating with your framework.
Master CSS provides various compilation modes, allowing you to choose according to the characteristics and needs of different projects.
- Progressive Rendering - Scan the requested HTML on the server side, generate CSS rules, and enable runtime-rendering compilation on the browser side
- Runtime Rendering - Observe the DOM tree, manipulate CSS rules according to the changed class name, and synchronize to the running style sheet at runtime
- Static Extraction - Scan source files for class names at build time, extract class names, and generate CSS files/virtual modules, then import them in the entry file
We've built various Master CSS core functionality/integration packages:
- CSS - The core of Master CSS, including the runtime engine
- React - Integrate Master CSS the React way
- Svelte - Integrate Master CSS the Svelte way
- Vue - Integrate Master CSS the Vue.js way
- Renderer - Pre-renders and injects HTML-required CSS
- Nitro Server - Integrate Master CSS Pre-rendering the Nitro way
- Extractor - Master CSS static extractor for various raw text extraction.
- Vite - Integrate Master CSS Static Extraction in Vite way
- Webpack - Integrate Master CSS Static Extraction in Webpack way
- Validator for Master CSS class syntax
- Server - The core of the Master CSS language server
- Service - The core of the Master CSS language service
- Visual Studio Code - Master CSS Language Service for Visual Studio Code Extension
- Normal CSS - Normalize the browser's styles
- Theme Service - A CSS theme-switching service for Master CSS
- 🚧 Class Variant - Create reusable, extensible, and customizable style class variants
- 🚧 Resolve Class - Conditionally apply classes and trim it to a non-wrap string
The Master CSS community can be found here:
- Discuss on GitHub - Ask questions, voice ideas, and do any other discussion
- Join our Discord Server - Casually chat with other people using the language ✓ 中文
Our 《 Code of Conduct 》 applies to all Master CSS community channels.
Please see our CONTRIBUTING for workflow.
Some of the core concepts and designs are inspired by these giants.
- The concept of enhanced syntax is inspired by SASS and TypeScript
- The concept of Virtual CSS is inspired by the Virtual DOM