Homecomponentsstructural

Visible

A container to hide or show contents based on predefined breakpoints.


Use Visible to show or hide elements on given breakpoints. These use breakpoints, so you need to resize the whole browser to see them in effect.

You can see me only on mobile
You can see me only on tablet
You can see me only on desktop
You can see me only on wide screens

You can also use more explicit breakpoints names.

You can see me only on mobile
You can see me only on tablet
You can see me only on desktop
You can see me only on wide screens

API

on
Required
The breakpoints when to show or hide the content.
ResponsiveValue<"yes" | "no">

children
Required
The content to be shown.
ReactNode

data
An object with the data keys and values.
DataAttributeMap
Table of Contents