2026-07-07 07:11:50 +00:00
# clsx [](https://github.com/lukeed/clsx/actions?query=workflow%3ACI) [](https://codecov.io/gh/lukeed/clsx)
2026-07-05 06:41:32 +00:00
2026-07-07 07:11:50 +00:00
> A tiny (228B) utility for constructing `className` strings conditionally.<Br>Also serves as a [faster](/bench) & smaller drop-in replacement for the `classnames` module.
2026-07-05 06:41:32 +00:00
This module is available in three formats:
2026-07-07 07:11:50 +00:00
* **ES Module**: `dist/clsx.m.js`
2026-07-05 06:41:32 +00:00
* **CommonJS**: `dist/clsx.js`
* **UMD**: `dist/clsx.min.js`
## Install
```
$ npm install --save clsx
```
## Usage
``` js
import clsx from 'clsx' ;
// or
import { clsx } from 'clsx' ;
// Strings (variadic)
clsx ( 'foo' , true && 'bar' , 'baz' ) ;
//=> 'foo bar baz'
// Objects
clsx ( { foo : true , bar : false , baz : isTrue ( ) } ) ;
//=> 'foo baz'
// Objects (variadic)
clsx ( { foo : true } , { bar : false } , null , { '--foobar' : 'hello' } ) ;
//=> 'foo --foobar'
// Arrays
clsx ( [ 'foo' , 0 , false , 'bar' ] ) ;
//=> 'foo bar'
// Arrays (variadic)
clsx ( [ 'foo' ] , [ '' , 0 , false , 'bar' ] , [ [ 'baz' , [ [ 'hello' ] , 'there' ] ] ] ) ;
//=> 'foo bar baz hello there'
// Kitchen sink (with nesting)
clsx ( 'foo' , [ 1 && 'bar' , { baz : false , bat : null } , [ 'hello' , [ 'world' ] ] ] , 'cya' ) ;
//=> 'foo bar hello world cya'
```
## API
### clsx(...input)
Returns: `String`
#### input
Type: `Mixed`
The `clsx` function can take * * *any*** number of arguments, each of which can be an Object, Array, Boolean, or String.
> **Important:** _Any_ falsey values are discarded!<br>Standalone Boolean values are discarded as well.
``` js
clsx ( true , false , '' , null , undefined , 0 , NaN ) ;
//=> ''
```
## Benchmarks
2026-07-07 07:11:50 +00:00
For snapshots of cross-browser results, check out the [`bench` ](/bench ) directory~!
2026-07-05 06:41:32 +00:00
## Support
All versions of Node.js are supported.
All browsers that support [`Array.isArray` ](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/isArray#Browser_compatibility ) are supported (IE9+).
>**Note:** For IE8 support and older, please install `clsx@1.0.x` and beware of [#17 ](https://github.com/lukeed/clsx/issues/17 ).
## Related
- [obj-str ](https://github.com/lukeed/obj-str ) - A smaller (96B) and similiar utility that only works with Objects.
## License
MIT © [Luke Edwards ](https://lukeed.com )