React CSS can be used in 4 ways:

• External CSS file
• Inline CSS
• CSS Modules
• Sass / SCSS

External CSS:

App.css

.title {
  color: blue;
  font-size: 24px;
}

import "./App.css";

function App() {
  return <h1 className="title">Hello React</h1>;
}

export default App;

Inline Css:

function App() {
  const style = { color: "red", fontSize: "30px" };

  return <h1 style={style}>Hello React</h1>;
}

CSS Mobules:

App.module.css

.text {
  color: green;
}

App.js

import styles from "./App.module.css";

function App() {
  return <h1 className={styles.text}>Hello React</h1>;
}

Using Sass:

$color: purple;

.title {
  color: $color;
}