# @yoroi/identicon

> The package to create wallet identicons of Yoroi SDK

Latest version **1.0.1** (published 2025-05-15) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install @yoroi/identicon
pnpm add @yoroi/identicon
yarn add @yoroi/identicon
bun add @yoroi/identicon
```

## Health

**Score 50/100 (C)** — status: stable.

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

Warnings: low downloads.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2025-05-15 |
| First published | 2024-08-19 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >= 16.19.0 |
| Dependencies | 2 |
| Unpacked size | 82.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 179 |
| Author | EMURGO Fintech |
| Maintainers | drkost, cryptotitan, vsubhuman, stackchain, abdelkrimdev |
| Keywords | yoroi, cardano, links, browser, react, blockies, jazzicon, identicon |

## Links

- npm: https://www.npmjs.com/package/@yoroi/identicon
- Repository: https://github.com/Emurgo/yoroi
- Homepage: https://github.com/Emurgo/yoroi/packages/identicon#readme
- Issues: https://github.com/Emurgo/yoroi/issues
- npm.io page: https://npm.io/package/@yoroi/identicon

## Dependencies (2)

- [tinycolor2](https://npm.io/package/tinycolor2.md) ^1.6.0
- [mersenne-twister](https://npm.io/package/mersenne-twister.md) ^1.1.0

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2025-05-15
- 1.0.0 — 2024-08-19

## README

# @yoroi/identicon

## Identicon Module for Yoroi

### Overview

The Identicon module for Yoroi to provide a visual representation of a wallet (pub-key) using identicons. Initially, this module leverages Blockies and Jazzicon algorithms to generate these visual identifiers.

### Features

- **Blockies Support**: Generate identicons using the Blockies.
- **Headless Implementation**: Provides a base64 representation of SVGs, enabling easy use across different platforms.
- **Jazzicons Support**: Generate identicons using Jazzicon.

### Installation

To install the Identicon module, use npm/yarn:

```bash
# npm
npm install @yoroi/identicon

# yarn
yarn add @yoroi/identicon

# workspace
yarn workspace <pkg> add @yoroi/identicon
```

### Generating a Blockies identicon

```typescript
const publicKey = 'BEDEAD'
const blockie = new Blockies({seed: publicKey})
const base64Image = blockie.asBase64({size: 44})

// Use the base64Image string as needed, for example, setting it as the src of an img element
document.getElementById('identicon-image').src = base64Image
```

### Generating a Jazzicon identicon

```typescript
const publicKey = 'BEDEAD'
const jazz = new Jazzicon({seed: publicKey})
const base64Image = jazz.asBase64({size: 44})

// Use the base64Image string as needed, for example, setting it as the src of an img element
document.getElementById('identicon-image').src = base64Image
```

### Blockies API

`asBase64({ seed, size, scale })`
Generates a base64 encoded SVG image for the provided seed, the `width` and `height` are the result of `size * scale`

Parameters:

- `seed (string)`: The seed for which to generate the identicon.
- `size (number, optional)`: The size of the identicon grid. Default is 8.
- `scale (number, optional)`: The scale factor for the identicon. Default is 4.

Returns:
A `base64` encoded string representing the SVG image.

### Jazzicon API

`asBase64({ size })`
Generates a base64 encoded SVG image for the provided seed, the `width` and `height` are equals to `size`

Parameters:

- `size (number, optional)`: The size of the identicon grid. Default is 100.

Returns:
A `base64` encoded string representing the SVG image.

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