Bootstrap Close icon

Use a generic close icon for dismissing content like modals and alerts.

Torus Kit new features for Close icon
Torus Kit close icon Example - Animated alert

Be sure to include text for screen readers, as we’ve done with aria-label.

Bootstrap close icon

Bootstrap close icon uses HTML entity ×.

<button type="button" class="close" aria-label="Close">
  <span aria-hidden="true">&times;</span>
</button>
Free

Torus Kit close icon

Torus Kit includes simple Torus Kit Icon Font font that can be used for close icon also. Use .tk-icon-times class for that.

<button type="button" class="close" aria-label="Close">
  <span aria-hidden="true" class="tk-icon-times"></span>
</button>

Example of use

Alert

Bootstrap alert with default icon.

<div class="alert alert-primary" role="alert">
  Alert
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>
Pro

Animated alert

Bootstrap alert with Torus Kit icon and Animated dismissing.

<div class="alert alert-primary" role="alert">
  Alert
  <button type="button" class="close" data-animate-dismiss="alert" aria-label="Close">
    <span aria-hidden="true" class="tk-icon-times"></span>
  </button>
</div>