Skeleton

Feedback

Loading placeholder block with pulse animation, 4 shapes and custom dimensions.

Shapes

default · rounded · circle · pill

Profile card loading state

Instalação via CLI

$ npx kikitocn add skeleton

Interno:

@/lib/utils

Exemplo de uso

SkeletonExample.tsx

import { Skeleton } from "@/components/ui/cn/skeleton/Skeleton";

export function SkeletonExample() {
  return (
    <Skeleton />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`width`	`string \| number`	`'100%'`	Largura (string CSS ou px number)
`height`	`string \| number`	`'1rem'`	Altura (string CSS ou px number)
`shape`	`'default' \| 'circle' \| 'rounded' \| 'pill'`	`'default'`	Forma do skeleton
`animate`	`boolean`	`true`	Ativa animação de pulse

Carregando…