Components
Skeleton
A placeholder to show while content is loading.
Usage
<template>
<div class="flex items-center gap-4">
<USkeleton class="h-12 w-12 rounded-full" />
<div class="grid gap-2">
<USkeleton class="h-4 w-[250px]" />
<USkeleton class="h-4 w-[200px]" />
</div>
</div>
</template>
API
Props
| Prop | Default | Type |
|---|---|---|
as |
|
The element or component this component should render as. |
Slots
| Slot | Type |
|---|---|
default |
|
Theme
app.config.ts
export default defineAppConfig({
ui: {
skeleton: {
base: 'animate-pulse rounded-[calc(var(--ui-radius)*1.5)] bg-[var(--ui-bg-elevated)]'
}
}
})