# splitting

> Micro-library to split a DOM element's words & chars into elements populated with CSS vars.

Latest version **1.1.0** (published 2024-05-31) · MIT license · 7.5K weekly downloads

## Install

```sh
npm install splitting
pnpm add splitting
yarn add splitting
bun add splitting
```

## Health

**Score 33/100 (F)** — status: abandoned.

Positive: has types package; no vulnerabilities; high quality score.

Warnings: no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.0 |
| Published | 2024-05-31 |
| First published | 2018-01-05 |
| Weekly downloads | 7.5K |
| License | MIT |
| TypeScript types | separate (@types/splitting) |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 36.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1758 |
| Author | Stephen Shaw |
| Maintainers | shshaw |
| Keywords | split, text, char, word, splitting, css, vars |

## Links

- npm: https://www.npmjs.com/package/splitting
- Repository: https://github.com/shshaw/splitting
- Homepage: https://splitting.js.org
- Issues: https://github.com/shshaw/splitting/issues
- npm.io page: https://npm.io/package/splitting

## Alternatives

- [d3-force-3d](https://npm.io/package/d3-force-3d.md) — 1.0M weekly downloads
- [ng2-charts](https://npm.io/package/ng2-charts.md) — 486.8K weekly downloads
- [@arcgis/core](https://npm.io/package/@arcgis/core.md) — 257.8K weekly downloads
- [react-sparklines](https://npm.io/package/react-sparklines.md) — 249.3K weekly downloads
- [react-native-gifted-charts](https://npm.io/package/react-native-gifted-charts.md) — 182.3K weekly downloads

## Recent versions

- 1.1.0 (latest) — 2024-05-31
- 1.0.0-beta2 (next) — 2018-08-06
- 1.0.6 — 2018-10-15
- 1.0.5 — 2018-08-08
- 1.0.4 — 2018-08-08
- 1.0.2 — 2018-08-08
- 1.0.1 — 2018-08-08
- 1.0.0 — 2018-08-07
- 1.0.0-beta1 — 2018-08-06
- 1.0.1-beta — 2018-08-03
- 1.0.0-beta — 2018-08-03
- 0.11.3 — 2018-02-13
- 0.11.0 — 2018-02-09
- 0.10.0 — 2018-02-08
- 0.9.12 — 2018-01-25
- … 9 more at https://npm.io/package/splitting/versions

## README

# [<img src="https://splitting.js.org/splitting.gif" alt="Splitting.js" style="max-width: 100%; height:auto" />](https://splitting.js.org)

### _CSS Vars for split words, chars & more!_

![The current build status based on whether tests are passing](https://api.travis-ci.org/shshaw/Splitting.svg?branch=1.0.0)
![The Uncompressed size of Splitting](https://img.shields.io/bundlephobia/min/splitting.svg?label=Minified%20Size)
![The GZIP size of Splitting](https://img.shields.io/bundlephobia/minzip/splitting.svg?label=GZIP%20Size)
![License: MIT](https://img.shields.io/npm/l/splitting.svg?label=License)

Splitting.js is a JavaScript microlibrary designed to split (section off) an element in a variety of ways, such as words, characters, child nodes, and more!

Most Splitting methods utilize a series of `<span>`s populated with CSS variables and data attributes unlocking transitions and animations that were previously not feasible with CSS.

Install with `npm i splitting -s` or [Download](https://github.com/shshaw/Splitting/archive/master.zip).

Consult the [guide & documentation](https://splitting.js.org/guide.html) for more details and installation instructions.

- [**Guide & Documentation**](https://splitting.js.org/guide.html)
- [**Demos**](https://codepen.io/collection/43588e4b7beaaf25ede7e38e61441e54/)

---

## Maintainers

| Maintainer | GitHub | Twitter |
| :- | :- | :- |
| Stephen Shaw | [@shshaw](https://github.com/shshaw) | [@shshaw](https://twitter.com/shshaw) |
| Christopher Wallis | [@notoriousb1t](https://github.com/notoriousb1t) | [@notoriousb1t](https://twitter.com/notoriousb1t) |

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