Skip to content

A lightweight utility function that simplifies the process of merging Tailwind Classes

Notifications You must be signed in to change notification settings

mh-jsx/tw-classnames

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

20 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tailwind Classnames

npm npm NPM

twc aka tw-classnames is a lightweight utility function that simplifies the process of merging Tailwind Classes while also supporting conditional classes within objects.

Installation

You can install twc via npm or yarn:

npm install tw-classnames
# OR
yarn add tw-classnames

Usage

Import twc into your JavaScript or TypeScript code:

const twc = require('tw-classnames');
// OR
import twc from 'tw-classnames';

Merging Duplicate Classnames

twc allows you to smartly merge duplicate Tailwind classes.

const mergedClasses = twc('bg-blue', 'text-white', 'p-4', 'bg-green');
console.log(mergedClasses);
// Output: 'text-white p-4 bg-green'

Conditional Classes

twc supports conditional classes within objects. This is especially useful when you want to apply different classes based on certain conditions.

const isActive = true;
const classes = twc('bg-blue-500', 'text-white', { 'font-bold': isActive });
console.log(classes);
// Output: 'bg-blue-500 text-white font-bold'

Dependency Libraries

twc internally uses two popular libraries:

License

twc is open-source and released under the MIT License.