---
title: "useHead"
description: "useHead customizes the head properties of individual pages of your Nuxt app."
canonical_url: "https://nuxt.com/docs/3.x/api/composables/use-head"
---
# useHead
> useHead customizes the head properties of individual pages of your Nuxt app.
## Usage
The `useHead` composable allows you to manage your head tags in a programmatic and reactive way, powered by [Unhead](https://unhead.unjs.io). It lets you customize the meta tags, links, scripts, and other elements in the `` section of your HTML document.
```vue [app.vue]
```
::warning
If the data comes from a user or other untrusted source, we recommend you check out [`useHeadSafe`](https://nuxt.com/docs/3.x/api/composables/use-head-safe).
::
::note
The properties of `useHead` can be dynamic, accepting `ref`, `computed` and `reactive` properties. The `meta` parameter can also accept a function returning an object to make the entire object reactive.
::
## Type
```ts [Signature]
export function useHead (meta: MaybeComputedRef): ActiveHeadEntry
interface MetaObject {
title?: string
titleTemplate?: string | ((title?: string) => string)
base?: Base
link?: Link[]
meta?: Meta[]
style?: Style[]
script?: Script[]
noscript?: Noscript[]
htmlAttrs?: HtmlAttributes
bodyAttrs?: BodyAttributes
}
interface ActiveHeadEntry {
/**
* Updates the entry with new input.
*
* Will first clear any side effects for previous input.
*/
patch: (input: Input) => void
/**
* Dispose the entry, removing it from the active head.
*
* Will queue side effects for removal.
*/
dispose: () => void
}
```
See [@unhead/schema](https://github.com/unjs/unhead/blob/main/packages/vue/src/types/schema.ts) for more detailed types.
## Parameters
`meta`: An object accepting head metadata properties to customize the page's `` section. All properties support reactive values (`ref`, `computed`, `reactive`) or can be a function returning the metadata object.
| Property | Type | Description |
| --------------- | ---------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------- |
| `title` | `string` | Sets the page title. |
| `titleTemplate` | `string \| ((title?: string) => string)` | Configures a dynamic template to customize the page title. Can be a string with `%s` placeholder or a function. |
| `base` | `Base` | Sets the `` tag for the document. |
| `link` | `Link[]` | Array of link objects. Each element is mapped to a `` tag, where object properties correspond to HTML attributes. |
| `meta` | `Meta[]` | Array of meta objects. Each element is mapped to a `` tag, where object properties correspond to HTML attributes. |
| `style` | `Style[]` | Array of style objects. Each element is mapped to a `