---
title: "Emojis"
description: "Use emojis in your OG Images."
canonical_url: "https://nuxtseo.com/docs/og-image/v5/guides/emojis"
last_updated: "2026-05-06T23:35:32.625Z"
---

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

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

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

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  ogImage: {
    defaults: {
      emojis: 'twemoji'
    }
  }
})
```

## Per-page emoji family

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

```ts [pages/index.vue]
defineOgImage({
  emojis: 'twemoji'
})
```