[Next.js & Tailwind CSS] 動的にCSSを変える

classnames をインストールする

$ npm install classnames

<nav>
  <a
    className={cn(styles.tab, {
      [styles["tab-active"]]: 条件式,
    })}
  ></a>
</nav>

Transition

.tab {
  text-decoration: none;
  color: white;
}

.tab-active {
  color: black;
}