Bilal UI
Bilal UIalpha
Components

Skeleton

Use placeholders to indicate that content is loading.

Last updated: March 8, 2026

Basic Skeleton

A simple text-based loading placeholder.

Card Skeleton

Full dashboard card placeholder with title and actions.

Avatar Text Skeleton

Profile/comment row with avatar and text lines.

Table Row Skeleton

Row placeholder for table loading states.

Image Text Skeleton

Card skeleton with media and content area.

List Item Skeleton

Reusable loading list item pattern.

Header Skeleton

Navigation/header loading state.

Stat Card Skeleton

KPI/metric card loading placeholder.

Sidebar navigation loading state.

Search Result Skeleton

Search result list loading variant.

Grid Card Skeleton

Grid-based card placeholders for catalog layouts.

Form Skeleton

Form layout with fields and actions placeholder.

Chat Message Skeleton

Alternating chat conversation loading state.

Profile Page Skeleton

Profile page structure placeholder.

Dialog/modal loading content state.

Data Table Skeleton

Full table header and rows loading state.

Timeline Skeleton

Timeline/activity feed placeholder.

Pricing Table Skeleton

Pricing cards comparison loading state.

Page With Breadcrumb Skeleton

Page layout with breadcrumb and content placeholders.

Notification Panel Skeleton

Notification list panel loading state.

Kanban Board Skeleton

Multi-column kanban board loading skeleton.