---
title: "Nuxt Hooks · Nuxt OG Image · Nuxt SEO"
canonical_url: "https://nuxtseo.com/docs/og-image/v5/api/nuxt-hooks"
last_updated: "2026-08-16T10:00:26.563Z"
meta:
  description: "Hook into the Nuxt OG Image build-time behaviour."
  "og:description": "Hook into the Nuxt OG Image build-time behaviour."
  "og:title": "Nuxt Hooks · Nuxt OG Image · Nuxt SEO"
---

Nuxt SEO on GitHub

You're viewing **OG Image v5** documentation. For the latest, [~~switch to v6~~](https://nuxtseo.com/docs/og-image/getting-started/introduction).

](https://nuxtseo.com/docs/og-image/v5/getting-started/introduction)

](https://nuxtseo.com/docs/og-image/v5/api/define-og-image)

](https://nuxtseo.com/docs/og-image/v5/releases/v5)

Switch to OG Image](https://nuxtseo.com/docs/og-image/getting-started/introduction)Switch to Nuxt SEO](https://nuxtseo.com/docs/nuxt-seo/getting-started/introduction)Switch to Robots](https://nuxtseo.com/docs/robots/getting-started/introduction)Switch to Sitemap](https://nuxtseo.com/docs/sitemap/getting-started/introduction)Switch to Schema.org](https://nuxtseo.com/docs/schema-org/getting-started/introduction)Switch to Link Checker](https://nuxtseo.com/docs/link-checker/getting-started/introduction)Switch to SEO Utils](https://nuxtseo.com/docs/seo-utils/getting-started/introduction)Switch to Site Config](https://nuxtseo.com/docs/site-config/getting-started/introduction)Switch to Skew Protection](https://nuxtseo.com/docs/skew-protection/getting-started/introduction)Switch to AI Ready](https://nuxtseo.com/docs/ai-ready/getting-started/introduction)

**Nuxt API**

# **Nuxt Hooks**

Built-time hooks for Nuxt OG Image.

## `**nuxt-og-image:runtime-config**`

**Type:** `**(config: ModuleOptions) => HookResult**`

Allows you to modify the Nuxt OG IMage runtime config at build-time.

Useful for other modules that want to modify the config.

nuxt.config.ts

```ts
export default defineNuxtConfig({
  hooks: {
    'nuxt-og-image:runtime-config': (config) => {
      // modify the config
      config.colorPreference = 'dark'
    }
  }
})
```

## `**nuxt-og-image:components**`

**Type:** `**(ctx: { components: OgImageComponent[] }) => HookResult**`

This hook allows you to programmatically modify the components that are used by the module.

nuxt.config.ts

```ts
export default defineNuxtConfig({
  hooks: {
    'nuxt-og-image:components': (ctx) => {
      // remove community components
      ctx.components = ctx.components.filter(c => c.category !== 'community')
      // add our own community component
      const myComponentPath = resolve('./MyComponent.vue')
      const myComponentContents = fsp.readFile(myComponentPath)
      components.push({
        hash: hash(myComponentContents),
        pascalName: 'MyComponent',
        kebabName: 'my-component',
        path: nuxt.options.dev ? myComponentPath : undefined,
        category: 'community',
        credits: 'My Company',
      })
    }
  }
})
```

**Was this page helpful?**

[**Nuxt Config** The Nuxt OG Image module configuration.](https://nuxtseo.com/docs/og-image/v5/api/config) [**Nitro Hooks** Hook into the Nuxt OG Image runtime.](https://nuxtseo.com/docs/og-image/v5/nitro-api/nitro-hooks)