Getting StartedInstallation and setup guides 5
LayoutWorkflow and structural layout components 7
OverlayModal and floating layer surfaces 3
FeedbackStatus, empty, progress, and loading placeholder patterns 5
FormInput and selection components 17
UtilityGeneral-purpose interface utilities 7
NavigationMenu surfaces and hierarchical actions 7
Overview API Styling Examples

Skeleton overview

Skeleton gives you ready-made loading blocks with the default shimmer shell, simple size inputs, and the same stable slot and state hooks as the primitive underneath.

Imports

Use the wrapper when you want the default shimmer treatment and width and height inputs.

Component import

ts
import { TngSkeletonComponent } from '@tailng-ui/components';

Style variants

Use the wrapper inside a plain CSS stack or a utility-authored Tailwind surface.

Wrapper skeleton stack (plain CSS)

Accessibility baseline

  • Skeleton placeholders stay decorative and render with aria-hidden="true".
  • Use nearby text, status copy, or a live region for real loading announcements.
  • Set [animated]="false" when shimmer would add too much motion.