September 2025

Using 'clsx' or 'classnames' with 'tailwind-merge'

Combining clsx or classnames with tailwind-merge allows us to conditionally join tailwind classes in classNames without style conflicts.

import { clsx, type ClassValue } from "clsx";
import { twMerge } from "tailwind-merge";
 
export function cn(...args: ClassValue[]) {
  return twMerge(clsx(args));
}