# Drawer

## Introduction

```tsx
<Drawer
  open
  children={<Box sx={{
  width: '100%',
  height: '100%',
  backgroundColor: 'white',
  boxShadow: 'var(--ceed-shadowRing, 0 0 #000),0px 2px 8px -2px rgba(var(--ceed-shadowChannel, 21 21 21) / var(--ceed-shadowOpacity, 0.08)),0px 6px 12px -2px rgba(var(--ceed-shadowChannel, 21 21 21) / var(--ceed-shadowOpacity, 0.08))'
}}>
        asdas
      </Box>}
/>
```

| Field                        | Description | Default |
| ---------------------------- | ----------- | ------- |
| Controls resolved at runtime | —           | —       |

## Usage

```tsx
import { Drawer } from '@ceed/cds';
```
