# tw-merge

> Merge CSS utility classes without style conflicts - small and zero config

Latest version **0.0.1-alpha.3** (published 2023-05-14) · MIT license · 0 weekly downloads

## Install

```sh
npm install tw-merge
pnpm add tw-merge
yarn add tw-merge
bun add tw-merge
```

## Health

**Score 35/100 (D)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; has provenance; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.1-alpha.3 |
| Published | 2023-05-14 |
| First published | 2023-05-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 194.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (Unknown) |
| GitHub stars | 16 |
| Author | Dani Guardiola |
| Maintainers | daniguardiola |
| Keywords | tailwindcss, tailwind, css, classes, className, classList, merge, conflict, override, utility |

## Links

- npm: https://www.npmjs.com/package/tw-merge
- Repository: https://github.com/compi-ui/tw-merge
- Issues: https://github.com/compi-ui/tw-merge/issues
- npm.io page: https://npm.io/package/tw-merge

## Alternatives

- [@sveltejs/kit](https://npm.io/package/@sveltejs/kit.md) — 2.2M weekly downloads
- [@atlaskit/theme](https://npm.io/package/@atlaskit/theme.md) — 402.0K weekly downloads
- [@tangle-network/brand](https://npm.io/package/@tangle-network/brand.md) — 10.0K weekly downloads
- [seneca](https://npm.io/package/seneca.md) — 7.4K weekly downloads
- [@bsb/base](https://npm.io/package/@bsb/base.md) — 7.2K weekly downloads

## Recent versions

- 0.0.1-alpha.3 (latest) — 2023-05-14
- 0.0.1-alpha.3-dev.0b5a5959a838eb88c82f95d3b3d799d21fb9ecc1 (dev) — 2023-05-14
- 0.0.1-alpha.2-dev.6d22191ca9c8c410d0316947abca81ab3a3e8123 — 2023-05-14
- 0.0.1-alpha.2-dev.7931c3fd3344f076dc66439f86d144bdf9238deb — 2023-05-14
- 0.0.1-alpha.2 — 2023-05-14
- 0.0.1-alpha.2-dev.c4bcff64df2ca23d00fd8c295e0ffa66e1c9155d — 2023-05-14
- 0.0.1-alpha.1-dev.b5c4f037c714205d06fbfc21e03cb7ec7327b6da — 2023-05-14
- 0.0.1-alpha.1-dev.c8aaa53e99e0c4f7bb65eddb344cf756c0b2371c — 2023-05-14
- 0.0.1-alpha.1-dev.537928d1cbd2f0229820a1b09f2d76f7890e677a — 2023-05-14
- 0.0.1-alpha.1 — 2023-05-14
- 0.0.1-alpha.1-dev.90c315764915b4ca0ae768c58e433f900fd9093e — 2023-05-14
- 0.0.1-alpha.0-dev.480df2be43522c9d717c2580e6b547407e1fe92a — 2023-05-14
- 0.0.1-alpha.0-dev.99d7f2281b688043fd593161f0fb48509dd4ddff — 2023-05-14
- 0.0.1-alpha.0-dev.fc169f672a08102535f3637c73009f71fba7746e — 2023-05-14
- 0.0.1-alpha.0 — 2023-05-14
- … 10 more at https://npm.io/package/tw-merge/versions

## README

# IMPORTANT NOTE: this package is a fork in development and ALL of the documentation has not been updated yet

<div align="center">
    <br />
    <a href="https://github.com/compi-ui/tw-merge">
        <!-- AUTOGENERATED VERSION START -->
        <img src="https://github.com/compi-ui/tw-merge/raw/v0.0.1-alpha.0/assets/logo.svg" alt="tailwind-merge" height="150px" />
        <!-- AUTOGENERATED END -->
    </a>
</div>

# tailwind-merge

Utility function to efficiently merge [Tailwind CSS](https://tailwindcss.com) classes in JS without style conflicts.

```ts
import { twMerge } from "tailwind-merge";

twMerge("px-2 py-1 bg-red hover:bg-dark-red p-3 bg-[#B91C1C]");
// → 'hover:bg-dark-red p-3 bg-[#B91C1C]'
```

- Supports Tailwind v3.0 up to v3.3 (if you use Tailwind v2, use [tailwind-merge v0.9.0](https://github.com/compi-ui/tw-merge/tree/v0.9.0))
- Works in all modern browsers and Node >=12
- Fully typed
- [Check bundle size on Bundlephobia](https://bundlephobia.com/package/tailwind-merge)

## Get started

<!-- AUTOGENERATED VERSION START -->

- [What is it for](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/docs/what-is-it-for.md)
- [Features](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/docs/features.md)
- [Configuration](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/docs/configuration.md)
- [Recipes](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/docs/recipes.md)
- [API reference](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/docs/api-reference.md)
- [Writing plugins](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/docs/writing-plugins.md)
- [Versioning](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/docs/versioning.md)
- [Contributing](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/.github/CONTRIBUTING.md)
- [Similar packages](https://github.com/compi-ui/tw-merge/tree/v0.0.1-alpha.0/docs/similar-packages.md)

<!-- AUTOGENERATED END -->

---
_Source: https://npm.io/package/tw-merge · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._