# @svgmoji/blob

> The svgmoji sprites for the [`blobmoji`](https://github.com/c1710/blobmoji) library.

Latest version **3.2.0** (published 2021-06-15) · MIT license · 0 weekly downloads

## Install

```sh
npm install @svgmoji/blob
pnpm add @svgmoji/blob
yarn add @svgmoji/blob
bun add @svgmoji/blob
```

## Health

**Score 40/100 (D)** — status: abandoned.

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

Warnings: low downloads.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 3.2.0 |
| Published | 2021-06-15 |
| First published | 2021-01-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 40.9 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 137 |
| Maintainers | ifiokjr |
| Keywords | emoji, svg, icons, google, blobmoji, gmail |

## Links

- npm: https://www.npmjs.com/package/@svgmoji/blob
- Repository: https://github.com/svgmoji/svgmoji/tree/HEAD/packages/svgmoji__blob
- Homepage: https://github.com/svgmoji/svgmoji/tree/HEAD/packages/@svgmoji/blob
- npm.io page: https://npm.io/package/@svgmoji/blob

## Dependencies (2)

- [@svgmoji/core](https://npm.io/package/@svgmoji/core.md) ^3.2.0
- [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.12.5

## 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

- 3.2.0 (latest) — 2021-06-15
- 3.1.0 — 2021-02-15
- 3.0.0 — 2021-01-19
- 2.0.0 — 2021-01-17
- 1.0.0 — 2021-01-16
- 0.2.0 — 2021-01-16
- 0.1.0 — 2021-01-15

## README

# @svgmoji/blob

> The svgmoji sprites for the [`blobmoji`](https://github.com/c1710/blobmoji) library.

<br />

[![Version][version]][npm] [![Weekly Downloads][downloads-badge]][npm] [![Bundled size][size-badge]][size] [![Typed Codebase][typescript]](./src/index.ts) ![MIT License][license]

[version]: https://flat.badgen.net/npm/v/@svgmoji/blob
[npm]: https://npmjs.com/package/@svgmoji/blob
[license]: https://flat.badgen.net/badge/license/MIT/purple
[size]: https://bundlephobia.com/result?p=@svgmoji/blob
[size-badge]: https://flat.badgen.net/bundlephobia/minzip/@svgmoji/blob
[typescript]: https://flat.badgen.net/badge/icon/TypeScript?icon=typescript&label
[downloads-badge]: https://badgen.net/npm/dw/@svgmoji/blob/red?icon=npm

<br />

## Installation

```bash
# yarn
yarn add @svgmoji/blob

# pnpm
pnpm add @svgmoji/blob

# npm
npm install @svgmoji/blob
```

<br />

## Usage

The following code creates an image with a src applied from the cdn. The first it is used it loads the sprite of all the emojis.

```ts
import { Blobmoji } from '@svgmoji/blob';
import data from 'svgmoji/emoji.json';

const blobmoji = new Blobmoji({ data, type: 'all' });
const image = document.createElement('img');
image.src = blobmoji.url('❤️');

document.body.append(image);
```

### html

<br />
<p align="center">
  <a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F44D.svg" alt="thumbs up" title="thumbs up" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F600.svg" alt="grinning" title="grinning" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/2764.svg" alt="red heart" title="red heart" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F602.svg" alt="face with tears of joy" title="face with tears of joy" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F605.svg" alt="grinning face with sweat" title="grinning face with sweat" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F97A.svg" alt="pleading face" title="pleading face" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F4A9.svg" alt="pile of poo" title="pile of poo" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F62D.svg" alt="loudly crying face" title="loudly crying face" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F60E.svg" alt="smiling face with sunglasses" title="smiling face with sunglasses" /></a>&nbsp;&nbsp;&nbsp;<a href="#"><img width="40px" height="40px" src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F631.svg" alt="face screaming in fear" title="face screaming in fear" /></a>
</p>

```html
<!-- Individual -->
<img
  width="40px"
  height="40px"
  src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/svg/1F44D.svg"
  alt="thumbs up"
  title="thumbs up"
/>

<!-- Subgroup Bundle 36KB  -->
<img
  width="40px"
  height="40px"
  src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/sprites/subgroups/face-affection.svg#1F385"
/>

<!-- Group Bundle 421KB -->
<img
  width="40px"
  height="40px"
  src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/sprites/group/smileys-emotion.svg#1F441-FE0F-200D-1F5E8-FE0F"
/>

<!-- Full Bundle 13.2MB -->
<img
  width="40px"
  height="40px"
  src="https://cdn.jsdelivr.net/npm/@svgmoji/blob@2.0.0/sprites/all.svg#1F441-FE0F-200D-1F5E8-FE0F"
/>
```

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