How to change background colors in Reactstrap

reactstrap doesn't have clear documentation, so I only see here 2 options:

  1. Just use inline styles in the components

    <Nav style={{backgroundColor: '#f1f1f1'}}>Something</Nav>

  2. Or use css-modules through

    import styles from './Component.module.css' <Nav className={styles.Component}>Something</Nav> where you define your ctyles in css .Component{ background-color: #f1f1f1 }

Note: css-modules sometimes is not enough to override bootstrap styling, but inline styles should help


Utility classes still work with reactstrap. Just use className='bg-dark' on the parent element, and you'll get your dark background.