Skeleton

Overview

Skeleton provides animated placeholder shapes that indicate content is loading. It supports three variants -- default rectangular, circular for avatars, and text-height lines -- for composing realistic loading states.

Usage

import { Skeleton } from "@leanicon/web-builder-library/saas";

<Skeleton variant="default" className="h-12 w-full" />
<Skeleton variant="circular" className="h-10 w-10" />
<Skeleton variant="text" className="w-48" />

Variants

Default

Dark

Circular

Text

Card Skeleton

List Skeleton