Visibility

.hidden: Remove an element from both visual display and screen readers.
.invisible: Hide an element from visual display and screen readers, but keep its space in the layout.
.sr-only: Hides an element visually but keeps it accessible for screen readers.

Responsive Visibility

Class	xs	sm	md	lg	xl	2xl	3xl
`.hidden-xs-only`	❌	✅	✅	✅	✅	✅	✅
`.hidden-sm-only`	✅	❌	✅	✅	✅	✅	✅
`.hidden-md-only`	✅	✅	❌	✅	✅	✅	✅
`.hidden-lg-only`	✅	✅	✅	❌	✅	✅	✅
`.hidden-xl-only`	✅	✅	✅	✅	❌	✅	✅
`.hidden-2xl-only`	✅	✅	✅	✅	✅	❌	✅
`.hidden-3xl-only`	✅	✅	✅	✅	✅	✅	❌
`.hidden-sm`	✅	❌	❌	❌	❌	❌	❌
`.hidden-md`	✅	✅	❌	❌	❌	❌	❌
`.hidden-lg`	✅	✅	✅	❌	❌	❌	❌
`.hidden-xl`	✅	✅	✅	✅	❌	❌	❌
`.hidden-2xl`	✅	✅	✅	✅	✅	❌	❌
`.hidden-3xl`	✅	✅	✅	✅	✅	✅	❌
`.hidden-no-sm`	❌	✅	✅	✅	✅	✅	✅
`.hidden-no-md`	❌	❌	✅	✅	✅	✅	✅
`.hidden-no-lg`	❌	❌	❌	✅	✅	✅	✅
`.hidden-no-xl`	❌	❌	❌	❌	✅	✅	✅
`.hidden-no-2xl`	❌	❌	❌	❌	❌	✅	✅
`.hidden-no-3xl`	❌	❌	❌	❌	❌	❌	✅