[Nextjs] Style

Global CSS

pages/_app.css

a {
    color: green;
}

pages/_app.js

import './_app.css';

function App({ Component, pageProps }) {
    return <Component {...pageProps} />
}

export default App;

CSS Modules

components/Button.module.css

.button {
    background: grey;
}

components/Button.js

import styles from './Button.module.css';

const Button = ({children}) => {
    return <button className={styles.button}>{children}</button>
};

export default Button;

pages/index.js

import Button from "../components/Button";

<Button>Click Me</Button>