Layouts

Visibility

Utilities for show or hide without affecting the layout of the document.

Variant

Active Checked Child-Selection Dark Mode Disabled Expand First-Last-Selection First-Letter Focus Focus-Visible Focus-Within Fullscreen Group-Focus Group-Hover Hover Landscape Light Mode Portrait Reduce-Motion Responsive Selection-Hover Visited

API

class	css
visible	visibility: visible
invisible	visibility: hidden

Usage

Set visible to an element.

<div class="visible">
  ...
</div>

HTML

.dummy {
  @extend
    .visible;
}

SCSS

Set invisible to an elment, the element property remains, but not hidden from existing.

<div class="invisible">
  ...
</div>

HTML

.dummy {
  @extend
    .invisible;
}

SCSS