> ## Documentation Index
> Fetch the complete documentation index at: https://docs.zopio.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# React Wrap Balancer

> A simple React component that makes titles more readable

### Installation

To install `react-wrap-balancer`, simply run the following command:

```sh Terminal theme={"system"}
pnpm add react-wrap-balancer
```

### Usage

Here is an example of how to use `react-wrap-balancer` to make titles more readable:

```tsx my-component.tsx theme={"system"}
import { Balancer } from 'react-wrap-balancer';

function MyComponent() {
  return (
    <div>
      <Balancer>This is a title that is too long to fit in one line.</Balancer>
    </div>
  );
}
```

### Benefits

* <Icon icon="check" iconType="solid" /> **Improved Readability**: `react-wrap-balancer` makes titles more readable by automatically wrapping them at the appropriate breakpoints.
* <Icon icon="check" iconType="solid" /> **Easy Integration**: `react-wrap-balancer` is easy to integrate into your existing React application, providing a seamless installation experience.

For more information and detailed documentation, visit the [react-wrap-balancer website](https://react-wrap-balancer.vercel.app/).