Skeleton

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

React documented

undefined

React

Is new design vision part implemented using new tokens?

Up to date

Resources

Storybook

React guidance

Source

GitHub code

Example

SkeletonCard

SkeletonCircle

SkeletonText


                                                        
                                                        
                                                            import { SkeletonCard, SkeletonCircle, SkeletonText, Stack } from '@optimus-web/core';
                                                        
                                                        <SkeletonCard width="200px" height="160px" />
                                                        <Stack spacing="200" vertical>
                                                            <SkeletonCircle diameter={60} />
                                                            <SkeletonText width="200px" />
                                                            <SkeletonText width="120px" />
                                                            <SkeletonText width="160px" />
                                                        </Stack>