Emojis

Nuxt OG Image supports emoji rendering using Iconify emoji sets.

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

A regex detects unicode emoji characters in your template and maps them to icon names.

For example, 😀 (U+1F600) maps to grinning-face, which resolves to the emoji SVG.

Emoji Strategy

Control how emojis are resolved with the emojiStrategy option:

export default defineNuxtConfig({
  ogImage: {
    emojiStrategy: 'auto' // 'auto' | 'local' | 'fetch'
  }
})

• auto (default): Uses local if @iconify-json/{emoji-family} is installed, otherwise fetches from API
• local: Uses local @iconify-json package only (faster, no network requests)
• fetch: Always fetches from Iconify API

Local Emoji Support

For faster rendering without network requests, install the iconify package for your emoji family:

pnpm add -D @iconify-json/noto

In dev mode, you'll be prompted to install the package automatically.

Configuring the emoji family

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

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

Per-page emoji family

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

defineOgImage({
  emojis: 'twemoji'
})