Published on

Merge TailwindCSS Classes

1

Install the tailwind merge package

yarn add tailwind-merge

# OR

npm install tailwind-merge
2

Create a utility function to accept multiple classnames and merge them

lib/classNames.ts
import { twMerge } from 'tailwind-merge'

const classNames = (...classes: string[]) => {
  return twMerge(classes.filter(Boolean).join(' '))
}

export default classNames
3

Use it in a component

See how it is can be used in the Gradient text snippet

Views

······