# cyber-circle-identicon

> Cyber Circle are circles containing a variety of randomly spaced circles inside. Cyber circles are generated using text, input a text to have it generate a Cyber Circle.

Latest version **1.0.1** (published 2022-02-04) · MIT license · 0 weekly downloads

## Install

```sh
npm install cyber-circle-identicon
pnpm add cyber-circle-identicon
yarn add cyber-circle-identicon
bun add cyber-circle-identicon
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2022-02-04 |
| First published | 2022-01-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 29 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | KyleSmith0905 |
| Maintainers | kylesmith0905 |
| Keywords | icon, identicon, picture, circles, avatar |

## Links

- npm: https://www.npmjs.com/package/cyber-circle-identicon
- Repository: https://github.com/KyleSmith0905/cyber-circle-identicon
- Homepage: https://github.com/KyleSmith0905/cyber-circle-identicon#readme
- Issues: https://github.com/KyleSmith0905/cyber-circle-identicon/issues
- npm.io page: https://npm.io/package/cyber-circle-identicon

## Alternatives

- [@fortawesome/react-fontawesome](https://npm.io/package/@fortawesome/react-fontawesome.md) — 2.2M weekly downloads
- [roboto-fontface](https://npm.io/package/roboto-fontface.md) — 196.0K weekly downloads
- [@react-native-vector-icons/common](https://npm.io/package/@react-native-vector-icons/common.md) — 150.4K weekly downloads
- [@procore/core-icons](https://npm.io/package/@procore/core-icons.md) — 4.6K weekly downloads
- [@react-md/material-icons](https://npm.io/package/@react-md/material-icons.md) — 1.6K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2022-02-04
- 1.0.0 — 2022-02-04
- 0.2.0 — 2022-01-15

## README

# Cyber Circle Identicons

## Examples

Despite 1 letter being different, the entire image is different.

<table>
	<tr>
		<td>
			<img src='assets/Cyber%20Circle.png' alt='Example 1 Cyber Circle' />
			<h3>Cyber Circle</h3>
		</td>
		<td>
			<img src='assets/Cyber__Circle.png' alt='Example 2 Cyber Circle' />
			<h3>Cyber_Circle</h3>
		</td>
		<td>
			<img src='assets/Cyber-Circle.png' alt='Example 3 Cyber Circle' />
			<h3>Cyber-Circle</h3>
		</td>
	</tr>
	<tr>
		<td>
			<img src='assets/Cyber%20_circle.png' alt='Example 4 Cyber Circle' />
			<h3>Cyber circle</h3>
		</td>
		<td>
			<img src='assets/_cyber%20Circle.png' alt='Example 5 Cyber Circle' />
			<h3>cyber Circle</h3>
		</td>
		<td>
			<img src='assets/_cyber%20_circle.png' alt='Example 6 Cyber Circle' />
			<h3>cyber circle</h3>
		</td>
	</tr>
</table>

## Usage

```
npm install cyber-circle-identicon
```

### Download on Node.js
```ts
import { createIdenticon } from 'cyber-circle-identicon';
import { writeFileSync } from 'fs';

const userIdenticon = createIdenticon('Hello World!');
writeFileSync('identicon.png', userIdenticon);
```

### As a  React \<img> source
```tsx
import { createIdenticon } from 'cyber-circle-identicon'

const ReactComponent = () => {
	const userIdenticon = createIdenticon('Hello World!');

	return (
		<img src={'data:image/png;base64,' + cyberCirclePNG.toString('base64')} />
	);
};
```

## Documentation

### `CreateIdenticon`
Returns a PNG buffer of a cyber circle generated from a string.

`key`: string - The key to generate the PNG from. For example, this is someone's username.

`additionalOptions`: object - An object of options for greater customization.
* `size`: number - The size of the image.
* `clipped`: boolean - Whether the image should be clipped to a circle, this should be false if your platform typically clips images to a circle.
* `compression`: number - The compression level of the image, this corresponds with zlib compression.
* `smoothEdges`: number - how much to smooth the edges of each element. This is synonymous to adding anti-aliasing.
* `overrideData`: object - Overrides the default data, this is great for platforms with themes.

## Contribute
Any contribution is greatly appreciated. Feel free to fork the repository and submit a pull request.

I will actively review all issues and pull requests.

### Contributors
<table>
	<tr>
		<td>
			<img src='assets/KyleSmith0905.png' alt='Kyle Smith contributor cyber circle' />
			<h3>KyleSmith0905</h3>
			<p>Owner<p>
		</td>
	</tr>
</table>

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