Layout
Skeleton
Display a placeholder while content is loading.
Usage
Use to show a placeholder while content is loading.
<template>
<div class="flex items-center space-x-4">
<USkeleton class="h-12 w-12" :ui="{ rounded: 'rounded-full' }" />
<div class="space-y-2">
<USkeleton class="h-4 w-[250px]" />
<USkeleton class="h-4 w-[200px]" />
</div>
</div>
</template>
Props
ui
any
undefined
Config
USkeleton.vue
{
"base": "animate-pulse",
"background": "bg-gray-100 dark:bg-gray-800",
"rounded": "rounded-md"
}