# useScreenSafeArea

Reactive

**Package:** `@vueuse/core`
**Category:** Browser

## Usage

```ts
import { useScreenSafeArea } from '@vueuse/core'

const {
  top,
  right,
  bottom,
  left,
} = useScreenSafeArea()
```

## Returns

| Name   | Type         |
| ------ | ------------ |
| top    | `shallowRef` |
| right  | `shallowRef` |
| bottom | `shallowRef` |
| left   | `shallowRef` |
| update | `Ref`        |

## Reference

[VueUse Docs](https://vueuse.org/core/useScreenSafeArea/)
