@svgmoji/openmoji

The svgmoji sprites for the [`openmoji`](https://github.com/hfg-gmuend/openmoji) library.

Usage no npm install needed!

<script type="module">
  import svgmojiOpenmoji from 'https://cdn.skypack.dev/@svgmoji/openmoji';
</script>

README

@svgmoji/openmoji

The svgmoji sprites for the openmoji library.


Version Weekly Downloads Bundled size Typed Codebase MIT License


Installation

# yarn
yarn add @svgmoji/openmoji

# pnpm
pnpm add @svgmoji/openmoji

# npm
npm install @svgmoji/openmoji

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.

import { Openmoji } from '@svgmoji/openmoji';
import data from 'svgmoji/emoji.json';

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

document.body.append(image);

html

thumbs up   grinning   red heart   face with tears of joy   grinning face with sweat   pleading face   pile of poo   loudly crying face   smiling face with sunglasses   face screaming in fear 

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

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

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

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

All emojis designed by OpenMoji – the open-source emoji and icon project. License: CC BY-SA 4.0.