CSS Utility Classes Visibility

Control the visibility, with or without modifying the display of elements.

Set element visibility using visibility utilities. Content will be hidden both visually and for assistive technology/screen reader users.

  • ._hidden
  • ._visible
  • ._{xs|sm|md|lg|xl|2xl}:hidden
  • ._{xs|sm|md|lg|xl|2xl}:visible
<div class="_hidden">...</div>
<div class="_visible">...</div>

Without modifying the element's display:

<div class="_visibility:hidden">...</div>
<div class="_visibility:visible">...</div>

Responsive Visibility

Visibility utilities can be applied responsively using the following helper classes: