Skeleton
Skeleton is a placeholder to display instead of the actual content.
Various shapes and sizes can be created using styling properties like shape, width, height, borderRadius and class.
Rectangle
Rounded
Square
Circle
Usage #
Examples #
Shapes #
Various shapes and sizes can be created using styling properties like shape, width, height, borderRadius and class.
Rectangle
Rounded
Square
Circle
Card #
Sample Card implementation using different Skeleton components and Tailwind CSS utilities.
List #
Sample List implementation using different Skeleton components and Tailwind CSS utilities.
DataTable #
Sample DataTable implementation using different Skeleton components and Tailwind CSS utilities.
| Code | Name | Category | Quantity |
|---|---|---|---|
Accessibility #
Screen Reader
Skeleton uses aria-hidden as "true" so that it gets ignored by screen readers, any valid attribute is passed to the root element so you may customize it further if required. If multiple skeletons are grouped inside a container, you may use aria-busy on the container element as well to indicate the loading process.
Keyboard Support
Component does not include any interactive elements.
