# Lean Count
URL: https://remocn.dev/docs/numbers/lean-count

A heavy figure counts up in a few surges, each snapping its slant, beside a short label.

- Install: `npx shadcn@latest add @remocn/lean-count`
- Vibe: premium
- Natural length: 76f @ 30fps

## Installation

```bash
npx shadcn@latest add @remocn/lean-count
```

## Usage

```tsx
// src/Root.tsx
import { Composition } from "remotion";
import { LeanCount } from "@/components/remocn/lean-count";

const LeanCountScene = () => (
  <LeanCount value={3.2} suffix="×" label="Faster renders on the laptop you already own." />
);

export const RemotionRoot = () => (
  <Composition
    id="LeanCount"
    component={LeanCountScene}
    durationInFrames={130}
    fps={30}
    width={1280}
    height={720}
  />
);
```

The label words rise in while the figure counts from `from` up to `value` in `steps` surges, each surge swinging the slant from leaning back to leaning forward. The suffix is drawn in the accent color. Pass `value`, `suffix` and `label` to make it yours; it ships light and dark through `theme`.

## Props

| Prop | Type | Default | Description |
|---|---|---|---|
| `value` | `number` | `3.2` | Final number the figure counts up to. |
| `from` | `number` | `1` | Number the count starts from. |
| `decimals` | `number` | `1` | Decimal places shown while counting. |
| `prefix` | `string` | `""` | Text drawn before the number, such as a currency sign. |
| `suffix` | `string` | `"×"` | Text drawn after the number, in the accent color. |
| `label` | `string` | `"Faster renders on the laptop you already own."` | Short sentence that rises in word by word at the top left. |
| `lean` | `number` | `14` | Slant angle in degrees at the extremes of each surge. |
| `steps` | `number` | `3` | Number of count surges the figure is split into. |
| `accent` | `string` | — | Accent color for highlights and small marks. |
| `background` | `string` | — | Background color override. Pass "transparent" to composite over other layers. |
| `speed` | `number` | `1` | Playback speed multiplier for the whole timeline. |
| `theme` | `"dark" \| "light"` | `"dark"` | Color theme, "dark" or "light". |

## Use when
- A benchmark beat where a multiplier like 3.2x lands as the headline result of the video.
- A speed-up or improvement stat that should feel punchy and kinetic rather than calm.
- A poster-style stat with a short label pinned top-left and the number anchored bottom-right.

## Don't use when
- The figure is a large integer that should roll like an odometer — use `carry-count`.
- You need a calm static headline number with no motion on the digits — use `compact-stat`.
- Several stats should appear one after another — use `stat-sequence`.