Atlas · Showcase

Skeletons

Loading-States bevor echte Daten kommen. Tailwind animate-pulse auf --muted Token. shadcn Skeleton-Component ist der Atlas-Standard.

Avatar + Text-Block

Card-Grid (3 Items)

Tabelle (5 Rows)

KPI-Tile

Code

Skeleton-Patterntsx

import { Skeleton } from '@/components/ui/skeleton'

<div className="flex items-center gap-4">
  <Skeleton className="h-12 w-12 rounded-full" />
  <div className="space-y-2">
    <Skeleton className="h-4 w-[250px]" />
    <Skeleton className="h-4 w-[200px]" />
  </div>
</div>