AccordionAlertAlert DialogAspect RatioAvatarBadgeBreadcrumbButtonButton GroupCalendarCardCarouselChartCheckboxCollapsibleComboboxCommandContext MenuData TableDate PickerDialogDirectionDrawerDropdown MenuEmptyFieldHover CardInputInput GroupInput OTPItemKbdLabelMenubarNative SelectNavigation MenuPaginationPopoverProgressRadio GroupResizableScroll AreaSelectSeparatorSheetSidebarSkeletonSliderSonnerSpinnerSwitchTableTabsTextareaToastToggleToggle GroupTooltipTypography
Skeleton
Use to show a placeholder while content is loading.
templ
templ SkeletonDemo() {
<div class="flex items-center space-x-4">
@ui.Skeleton("h-12 w-12 rounded-full", nil)
<div class="space-y-2">
@ui.Skeleton("h-4 w-[250px]", nil)
@ui.Skeleton("h-4 w-[200px]", nil)
</div>
</div>
}