---
name: Close
route: /components/common/controls/control-close
menu: Controls
edit: false
---

import { Playground, Props } from 'docz'
import ControlClose from './control-close'

# ControlClose
**SUBCATEGORY:** Controls

<hr />

## Close
### Description
For dismissing a persistent element, such as an alert, or reverting a temporary change in the state of the interface.

<Playground>
  <ControlClose />
</Playground>

**Disabled**
<Playground>
  <ControlClose disabled />
</Playground>

<hr />


## Close (full screen)
### Description
For dismissing a persistent element, such as an alert, or reverting a temporary change in the state of the interface.

<Playground>
  <ControlClose fullScreen />
</Playground>

**Disabled**
<Playground>
  <ControlClose fullScreen disabled />
</Playground>

<hr />

## Close (inverse)
### Description
For dismissing a persistent element, such as an alert, or reverting a temporary change in the state of the interface.

<Playground style={{ backgroundColor: '#333', margin: '-2em', padding: '2em' }}>
  <ControlClose inverse />
</Playground>

**Disabled**
<Playground style={{ backgroundColor: '#333', margin: '-2em', padding: '2em' }}>
  <ControlClose inverse disabled />
</Playground>

<hr />

## Close (inverse, full screen)
### Description
For dismissing a persistent element, such as an alert, or reverting a temporary change in the state of the interface.

<Playground style={{ backgroundColor: '#333', margin: '-2em', padding: '2em' }}>
  <ControlClose fullScreen inverse />
</Playground>

**Disabled**
<Playground style={{ backgroundColor: '#333', margin: '-2em', padding: '2em' }}>
  <ControlClose fullScreen inverse disabled />
</Playground>

<hr />

## Properties
<Props of={ControlClose} />