2016-09-09 04:48:17 +00:00
---
layout: docs
2019-10-22 02:27:43 +00:00
title: Close button
description: A generic close button for dismissing content like modals and alerts.
2019-05-10 18:27:22 +00:00
group: components
2016-09-09 04:48:17 +00:00
---
2019-12-27 16:40:06 +00:00
**Be sure to include text for screen readers**, as we've done with `aria-label` . Disabled close buttons have `pointer-events: none` applied to, preventing hover and active states from triggering.
2016-09-09 04:48:17 +00:00
2019-01-08 16:33:28 +00:00
{{< example > }}
2016-09-09 04:48:17 +00:00
< button type = "button" class = "close" aria-label = "Close" >
< span aria-hidden = "true" > × < / span >
< / button >
2019-12-27 16:40:06 +00:00
< button type = "button" class = "close" disabled aria-label = "Close" >
< span aria-hidden = "true" > × < / span >
< / button >
2019-01-08 16:33:28 +00:00
{{< / example > }}
