# cuer

> Opinionated QR Code component for React

Latest version **0.0.3** (published 2025-08-26) · MIT license · 0 weekly downloads

## Install

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

## Health

**Score 45/100 (D)** — status: stable.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2025-08-26 |
| First published | 2025-03-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 41.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 99 |
| Maintainers | jmoxey |
| Keywords | qr, code, react |

## Links

- npm: https://www.npmjs.com/package/cuer
- Repository: https://github.com/wevm/cuer
- Homepage: https://wevm.dev
- Issues: https://github.com/wevm/cuer/issues
- Funding: https://github.com/sponsors/wevm
- npm.io page: https://npm.io/package/cuer

## Dependencies (1)

- [qr](https://npm.io/package/qr.md) ~0

## Alternatives

- [flatbuffers](https://npm.io/package/flatbuffers.md) — 6.0M weekly downloads
- [jwt-simple](https://npm.io/package/jwt-simple.md) — 259.5K weekly downloads
- [@exodus/patch-broken-hermes-typed-arrays](https://npm.io/package/@exodus/patch-broken-hermes-typed-arrays.md) — 28.5K weekly downloads
- [@native-to-anchor/buffer-layout](https://npm.io/package/@native-to-anchor/buffer-layout.md) — 12.2K weekly downloads
- [binary-parser-encoder](https://npm.io/package/binary-parser-encoder.md) — 5.3K weekly downloads

## Recent versions

- 0.0.3 (latest) — 2025-08-26
- 0.0.0-canary-20250826040101 (canary) — 2025-08-26
- 0.0.0-main-20250323055300 (main) — 2025-03-23
- 0.0.2 — 2025-03-24
- 0.0.0-canary-20250324051402 — 2025-03-24
- 0.0.0-canary-20250324051234 — 2025-03-24
- 0.0.1 — 2025-03-23
- 0.0.0-canary-20250323061614 — 2025-03-23
- 0.0.0 — 2025-03-22

## README

# cuer

Opinionated QR Code component for React, powered by [`qr`](https://github.com/paulmillr/qr)

<picture>
  <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/wevm/cuer/refs/heads/main/.github/qr-dark.svg">
  <img alt="cuer logo" src="https://raw.githubusercontent.com/wevm/cuer/refs/heads/main/.github/qr-light.svg" width="auto" height="150px">
</picture>

## Install

```sh
npm i cuer
```

## Usage

### Basic

Use the `Cuer` component to render a QR code (with an optional `arena`).

```tsx
import { Cuer } from 'cuer'

export function App() {
  return <Cuer arena="https://example.com/logo.png" value="https://wevm.dev" />
}
```

### Advanced

Further customization is possible by composition components (ie. `Cuer.Root`, `Cuer.Cells`, etc).

```tsx
import { Cuer } from 'cuer'

export function App() {
  return (
    <Cuer.Root value="https://wevm.dev">
      <Cuer.Finder fill="red" radius={0} />
      <Cuer.Cells fill="blue" radius={0} />
      <Cuer.Arena>
        <img
          src="https://example.com/logo.png"
          style={{ width: '100%', height: '100%', objectFit: 'cover' }}
        />
      </Cuer.Arena>
    </Cuer.Root>
  )
}
```

## License

[MIT](/LICENSE) License

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