nextjs component based css

nextjs component based css

Component-level #CSS in in Next.js is an optional feature. You can create a file called button.module.css, import this in you button.js file. In production, all CSS Module files will be automatically concatenated into many minified and code-split .css files.

Copy Snippet
import styles from './Button.module.css'

export function Button() {
  return (
    <button
      type="button"
      // Note how the "error" class is accessed as a property on the imported
      // `styles` object.
      className={styles.error}
    >
      Destroy
    </button>
  )
}