`useSeoMeta()`

Sets SEO and Open Graph meta tags with a flat, fully typed object.

Since Nuxt 3.1 Spec ↗

Syntax

useSeoMeta(input)

Parameters

Name	Type	Required	Description
`input`	`SeoMetaInput`	Yes	Flat object of SEO keys like `title`, `description`, `ogTitle`, `ogImage`, `twitterCard`. Values may be functions for reactivity.

Returns

void — Registers correctly named meta tags.

Examples

<script setup lang="ts">
useSeoMeta({
  title: 'Nuxt SEO Guide',
  description: 'Improve your Nuxt site SEO',
  ogTitle: 'Nuxt SEO Guide',
  ogImage: 'https://example.com/og.png',
  twitterCard: 'summary_large_image',
})
</script>

<script setup lang="ts">
const { data: post } = await useFetch('/api/post')
useSeoMeta({
  title: () => post.value?.title,
  ogImage: () => post.value?.cover,
})
</script>

Notes

Provides full TypeScript autocompletion and prevents common mistakes like using `name` vs `property` for Open Graph tags. Pass functions for reactive values. Renders server-side so crawlers see correct tags. Use alongside `useHead` for non-meta tags (links, scripts).