# getKeyboardLayout

<!-- DO NOT EDIT: this page is autogenerated from the type comments -->

```ts
function getKeyboardLayout(): SvelteKeyboardLayout;
```

Defined in: [packages/svelte-hotkeys/src/getKeyboardLayout.svelte.ts:80](https://github.com/TanStack/hotkeys/blob/main/packages/svelte-hotkeys/src/getKeyboardLayout.svelte.ts#L80)

Svelte function that returns reactive access to the browser's keyboard
layout. `layout` is `null` until the layout loads and in browsers that
don't report one. The layout maps each physical code to the character it
types, such as `KeyQ` to `a` on a French AZERTY keyboard. Only Chromium
browsers report one.

The layout loads after the first component that uses this function mounts,
so server-rendered output hydrates unchanged. `getFormatForDisplay` uses
this function, so you only need it for labels you draw yourself.

To never ask the browser for the layout, set `keyboardLayout: false` in
`HotkeysProvider`'s `defaultOptions`. `layout` then stays `null`.

## Returns

[`SvelteKeyboardLayout`](../interfaces/SvelteKeyboardLayout.md)

Object with a reactive `layout` property

## Example

```svelte
<script lang="ts">
  import { getKeyboardLayout } from '@tanstack/svelte-hotkeys'

  const keyboard = getKeyboardLayout()
  const label = (code: string) =>
    (keyboard.layout?.get(code) ?? code).toUpperCase()
</script>

<kbd>{label('KeyW')}</kbd>
```