Skeleton

The Skeleton component is a placeholder UI element that simulates the layout of content while the actual data is being loaded.

Anatomy

Skeleton Anatomy

Item

Name

Description

1

Shape

Shape that represents different content types in a single skeleton loader.


Specification and properties

Variants

The Skeleton component comes in different variants, which can be used individually or in a composition, depending on the content.

Text

Text

Card

Card

Circle

Circle

 

Motion

Action: Skeleton pulse Fade In

Layer

Trigger

Attribute

Duration

Easing

Delay

Effect

Skeleton element

Auto

Opacity

Duration50

EasyInOut

 

Fade In

Action: Skeleton pulse Fade Out

Layer

Trigger

Attribute

Duration

Easing

Delay

Effect

Skeleton element

Auto

Opacity

Duration50

EasyInOut

 

Fade Out