---
name: Overlay
menu: Components
route: /components/Overlay
---

import { Playground, PropsTable } from 'docz'
import { State, Toggle } from 'react-powerplug'
import { Button, overlay } from '@personio/ui-components'
import styles from './styles.scss'

# Overlay

## Example

<Playground>
  <div>
    <div className={styles.container}>
      <Button theme="primary" onClick={() => {
        overlay.show(); setTimeout(overlay.hide, 3000);
      }}>
        Show overlay (will close after 3s)
      </Button>
    </div>
  </div>
</Playground>
