# `useHead` Nuxt provides the `useHead` composable to add and customize the head properties of individual pages of your Nuxt app. `useHead` uses [@vueuse/head](https://github.com/vueuse/head) under the hood. ::alert{icon=👉} **`useHead` must be placed within the `setup` function**. :: ## Type ```ts useHead(meta: Computable): void interface MetaObject extends Record { charset?: string viewport?: string meta?: Array> link?: Array> style?: Array> script?: Array> noscript?: Array> titleTemplate?: string | ((title: string) => string) title?: string bodyAttrs?: Record htmlAttrs?: Record } ``` Application-wide configuration of the head metadata is possible through [nuxt.config](/api/configuration/nuxt.config#head), or by placing the `useHead` in the `app.vue` file. ::alert{type=info} The properties of `useHead` can be dynamic, accepting `ref`, `computed` and `reactive` properties. `meta` parameter can also accept a function returning an object to make the entire object reactive. :: ## Parameters ### `meta` **Type**: `MetaObject` An object accepting the following head metadata: - `charset` **Type**: `string` **Default**: `utf-8` Specifies character encoding for the HTML document. - `viewport` **Type**: `string` **Default**: `width=device-width, initial-scale=1` Configures the viewport (the user's visible area of a web page). - `meta` **Type**: `Array>` **Default**: `width=device-width, initial-scale=1` Each element in the array is mapped to a newly-created `` tag, where object properties are mapped to the corresponding attributes. - `link` **Type**: `Array>` Each element in the array is mapped to a newly-created `` tag, where object properties are mapped to the corresponding attributes. - `style` **Type**: `Array>` Each element in the array is mapped to a newly-created `