Getting Started

Set up Master CSS in React

A quick guide to start using Master CSS in your React project.

Quick start

1. Create a React project

If you don't have a React project, create one first. It's recommended to refer Create React App :

npx create-react-app project --template typescript
cd project

2. Installation

npm install @master/css

3. Import

import '@master/css';

4. Launch server

npm start

Hello world

Now, start developing your UI with Master CSS. 🎉

localhost:4200

Hello World

import '@master/css';
const App = () => {
  return (
    <h1 className="font:40 font:heavy italic m:50 text:center">
        Hello World
    </h1>
  )
}
export default App;

Hello world

.font\:heavy {
    font-weight: 900
}

@media print {
    .hide\@print {
        display: none
    }
}

@media (min-width:1024px) {
    .font\:24\@md {
        font-size: 1.5rem
    }
}

automatically