---
title: "Meta Descriptions in Nuxt"
description: "Set useful meta descriptions with useSeoMeta in Nuxt. Use reactive values and server-side data fetching so summaries reach the initial HTML."
canonical_url: "https://nuxtseo.com/learn-seo/nuxt/mastering-meta/descriptions"
last_updated: "2026-10-08"
---

> Index of every page on this site: [llms.txt](https://nuxtseo.com/llms.txt)

::key-takeaways
- Use `useSeoMeta()`{lang="ts"} for type-safe descriptions with autocomplete
- Google can choose page content instead of your description; keep both accurate and useful
- Target roughly 150-160 characters and front-load the value, since Google truncates the snippet to fit the device width
::

Meta descriptions don't directly impact rankings. They affect click-through rates by giving users context about your page.

```html
<meta name="description" content="Learn how to implement meta descriptions in Nuxt. Includes reactive content, SEO best practices, and social sharing tips.">
```

## Quick Facts

1. **Google can choose another passage**: [snippet guidance](https://developers.google.com/search/docs/appearance/snippet) says snippets primarily come from page content. It may use your description when that better describes the page.
2. **Length isn't fixed**: Google truncates the snippet to fit the device width rather than a set character count ([official guidance](https://developers.google.com/search/docs/appearance/snippet)). Aim for roughly 150-160 characters and front-load the value, since mobile truncates sooner.
3. **Template descriptions are lazy**: "Buy  at great prices" won't differentiate you. Summarize using AI tools if you're short on time.

::tip
Write an accurate summary rather than a vague invitation to click. It should describe the content users will find.
::

## Setting Meta Descriptions in Nuxt

Nuxt includes [Unhead](https://unhead.unjs.io/) by default. Use `useSeoMeta`{lang="ts"} for type-safe descriptions:

```ts
useSeoMeta({
  description: 'Your description here'
})
```

Alternatively, `useHead()`{lang="ts"} gives you more control:

```ts
useHead({
  meta: [
    { name: 'description', content: 'Your description here' }
  ]
})
```

## Dynamic Meta Descriptions

Use Nuxt's data fetching composables for reactive descriptions:

```vue
<script setup lang="ts">
const { data: post } = await useFetch('/api/post')

useSeoMeta({
  // computed getter syntax
  description: () => post.value?.description
})
</script>
```

## Writing for AI & LLMs

Write descriptions that match the visible page. [Google requires no special markup for its AI features](https://developers.google.com/search/docs/appearance/ai-features). A description does not guarantee a citation or inclusion in an AI answer.

## Open Graph Description `'og:description'`{lang="ts"}

The [Open Graph protocol](https://ogp.me/#optional) defines `og:description` as an optional description for your object. Set explicit X metadata when you need separate copy, and test [link previews](https://nuxtseo.com/learn-seo/nuxt/mastering-meta/open-graph) on the target platform.

```ts
useSeoMeta({
  description: 'Technical description for search',
  ogDescription: 'More casual description for social sharing',
  twitterDescription: 'Description for X',
})
```

**Testing tools:**

- [Facebook Sharing Debugger](https://developers.facebook.com/tools/debug/)
- [LinkedIn Post Inspector](https://www.linkedin.com/post-inspector/)
- [OpenGraph.xyz](https://www.opengraph.xyz/) (tests Facebook, LinkedIn, Discord, X)

## Nuxt SEO Module

Automates meta descriptions, titles, and social sharing:

::module-card{slug="nuxt-seo" .w-1/2}
::

A deployed description does not immediately replace a Google snippet. Google must recrawl and process the page, and it may select another passage.

Record the edit date and check the displayed result before comparing complete CTR periods. The [reported serving timings](https://nuxtseo.com/learn-seo/google-search-timelines) do not predict when Google will use your description.

## Checklist

::checklist{#nuxt-descriptions}
- Use `useSeoMeta()`{lang="ts"} instead of hardcoded meta tags
- Write a unique description per page, not a template
- Keep to roughly 150-160 characters and front-load the value
- Set `og:description` for social sharing
- Fetch data server-side so descriptions render in the initial HTML
- Accept that Google may rewrite it: focus on content quality first
::

## Sitemap

See the full [sitemap](https://nuxtseo.com/sitemap.md) for all pages.