Components · 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)

### Nuxt API

-
-
-
-
-
-

### Nitro API

-

Nuxt API

# Components

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

## [Introduction](#introduction)

It's recommended to use composables over components, as they are more flexible and will provide better type safety.

## [`OgImage`](#ogimage)

Render a customisable OG Image.

Uses the

 composable.

```
<template>
  <OgImage />
</template>
```

## [`OgImageScreenshot`](#ogimagescreenshot)

Takes a screenshot of the page and uses it as the image.

Uses the

 composable.

```
<template>
  <OgImageScreenshot />
</template>
```

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

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

Did this page help you?

On this page

- [Introduction](#introduction)
- [OgImage](#ogimage)
- [OgImageScreenshot](#ogimagescreenshot)

[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)