Emojis · Nuxt OG Image · Nuxt SEO

-
-
-
-

[1.4K](https://github.com/harlan-zw/nuxt-seo)

[Nuxt SEO on GitHub](https://github.com/harlan-zw/nuxt-seo)

You're viewing **OG Image v5** documentation. For the latest,

.

OG Image

-
-
-
-
-
-
-
-
-
-

Search…```k`` /`

v5

- Playgrounds
- [Discord Support](https://discord.com/invite/275MBUBvgP)

### Getting Started

-
-
-
-

### Core Concepts

-
-
-
-
-
-
-
-
-
-
-
-
-
-

### Integrations

-
-

Core Concepts

# Emojis

[Copy for LLMs](https://nuxtseo.com/docs/og-image/v5/guides/emojis.md)

Nuxt OG Image integrates with the [Iconify API](https://iconify.design/docs/api/) to provide support for a number of emojis families.

Supported families: `twemoji`, `noto`, `fluent-emoji`, `fluent-emoji-flat`, `fluent-emoji-high-contrast`, `noto-v1`, `emojione`, `emojione-monotone`, `emojione-v1`, `streamline-emojis`, `openmoji`

The default emoji family is `noto`.

## [How it works](#how-it-works)

There is a Regex that detects unicode emoji characters in your template. When it finds them, it will map the characters to the emoji name.

For example, the unicode character `U+1F600` (`😀`) will be mapped to `grinning-face`.

Once we have the emoji name, we can use the Iconify API to fetch the SVG for that emoji, for example `https://api.iconify.design/noto/grinning-face.svg`.

You should be mindful of the number of emojis you use in your template, as each one will result in a separate API request.

## [Configuring the emoji family](#configuring-the-emoji-family)

You can set the default emoji family within your module config.

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    defaults: {
      emojis: 'twemoji'
    }
  }
})
```

## [Per-page emoji family](#per-page-emoji-family)

You can also set the emoji family on a per-page basis.

pages/index.vue

```
defineOgImage({
  emojis: 'twemoji'
})
```

[Edit this page](https://github.com/nuxt-modules/og-image/blob/v5.1.13/docs/content/3.guides/6.emojis.md)

[Markdown For LLMs](https://nuxtseo.com/docs/og-image/v5/guides/emojis.md)

Did this page help you?

On this page

- [How it works](#how-it-works)
- [Configuring the emoji family](#configuring-the-emoji-family)
- [Per-page emoji family](#per-page-emoji-family)

[GitHub](https://github.com/harlan-zw/nuxt-seo) [ Discord](https://discord.com/invite/275MBUBvgP)

###

-
-

Modules

-
-
-
-
-
-
-
-
-

###

-
-
-

###

Nuxt

-
-
-
-
-

Vue

-
-
-
-
-
-
-
-

###

-
-
-
-
-
-
-
-
-
-

Copyright © 2023-2026 Harlan Wilton - [MIT License](https://github.com/harlan-zw/nuxt-seo/blob/main/license) · [mdream](https://mdream.dev)