Data-display

252 components

data-display0
Chakra UI Format Byte
File sizes formatted with FormatByte in bytes or bits, with a unit display switch.
Chakra UIchakra-uidata-displayformat-byteMIT
data-display0
Chakra UI Flex
A toolbar laid out with Flex, switching justify content between start, centre and space-between.
Chakra UIchakra-uidata-displayflexMIT
data-display0
Chakra UI Em
Editorial copy with emphasised words rendered by Chakra Em.
Chakra UIchakra-uidata-displayemMIT
data-display0
Chakra UI Data List
A customer record in a horizontal Data List with a vertical layout switch.
Chakra UIchakra-uidata-displaydata-listMIT
data-display0
Chakra UI Color Swatch
Theme colour swatches that pick an accent, with readable colour names.
Chakra UIchakra-uicolor-swatchdata-displayMIT
data-display0
Chakra UI Code Block
A two-file code viewer built with the Chakra UI Code Block, highlighted by shiki, with line numbers, a highlighted line and a copy button.
Chakra UIchakra-uicode-blockdata-displayMIT
data-display0
Chakra UI Code
Inline code tokens in surface, subtle and outline variants with a variant switch.
Chakra UIchakra-uicodedata-displayMIT
data-display0
Chakra UI Carousel
A testimonial Carousel with previous and next triggers and page indicators.
Chakra UIcarouselchakra-uidata-displayMIT
data-display0
Chakra UI Blockquote
Rotating customer quotes in a Chakra Blockquote with an icon and caption.
Chakra UIblockquotechakra-uidata-displayMIT
data-display0
Chakra UI Avatar
A channel member avatar group with initials fallbacks and a show-all toggle.
Chakra UIavatarchakra-uidata-displayMIT
data-display0
Chakra UI Aspect Ratio
A map placeholder that keeps 16:9, 4:3 or 1:1 proportions as you switch.
Chakra UIaspect-ratiochakra-uidata-displayMIT
data-display0
Base UI Separator
Account menu groups divided by separators that switch between horizontal and vertical.
Base UIbase-uidata-displayinteractiveMIT
data-display0
Base UI Scroll Area
A keyboard-focusable activity feed in a scroll area with a styled vertical scrollbar.
Base UIbase-uidata-displayinteractiveMIT
data-display0
Base UI Preview Card
An inline link that shows a preview card of the linked article on hover or focus.
Base UIbase-uidata-displayinteractiveMIT
data-display0
Base UI Meter
Usage meters built on the Base UI meter primitive, with labelled values, formatted readouts and a local usage control.
Base UIaccessiblebase-uidata-displayMIT
data-display0
Base UI Avatar
Team member avatars with a local image and initials fallbacks when no photo loads.
Base UIavatarbase-uidata-displayMIT
data-display0
Ark UI Scroll Area
A keyboard-focusable release notes area with a styled vertical scrollbar.
Ark UIark-uidata-displayinteractiveMIT
data-display0
Ark UI QR Code
A Wi-Fi sharing QR Code rendered by Ark from an editable network name.
Ark UIark-uidata-displayinteractiveMIT
data-display0
Ark UI Marquee
A scrolling headline ticker built from Ark Marquee that pauses on interaction or from a control.
Ark UIark-uidata-displayinteractiveMIT
data-display0
Ark UI Image Cropper
A profile photo cropper from Ark Image Cropper with draggable handles, a grid and a round or square shape.
Ark UIark-uidata-displayimage-cropperMIT
data-display0
Ark UI Hover Card
A repository link that previews its description and stars on hover or focus.
Ark UIark-uidata-displayhover-cardMIT
data-display0
Ark UI Carousel
A product image Carousel with previous and next triggers and slide indicators.
Ark UIark-uicarouseldata-displayMIT
data-display0
Ark UI Avatar
Reviewer avatars with an inline image, a broken image and initials fallbacks.
Ark UIark-uiavatardata-displayMIT
data-display0
Ant Design Typography
An editable release title with Typography text types and an expandable paragraph.
Ant Designant-designdata-displayinteractiveMIT