1---
2category: Browser
3---
4 
5# usePreferredLanguages
6 
7Reactive [Navigator Languages](https://developer.mozilla.org/en-US/docs/Web/API/NavigatorLanguage/languages). It provides web developers with information about the user's preferred languages. For example, this may be useful to adjust the language of the user interface based on the user's preferred languages in order to provide better experience.
8 
9## Usage
10 
11```ts
12import { usePreferredLanguages } from '@vueuse/core'
13 
14const languages = usePreferredLanguages()
15```
16 
17## Component Usage
18 
19```vue
20<template>
21  <UsePreferredLanguages v-slot="{ languages }">
22    Preferred Languages: {{ languages }}
23  </UsePreferredLanguages>
24</template>
25```
26 
27## Type Declarations
28 
29```ts
30/**
31 * Reactive Navigator Languages.
32 *
33 * @see https://vueuse.org/usePreferredLanguages
34 * @param options
35 *
36 * @__NO_SIDE_EFFECTS__
37 */
38export declare function usePreferredLanguages(
39  options?: ConfigurableWindow,
40): ShallowRef<readonly string[]>
41```
42