Skeleton
Live preview and documentation for the Skeleton component.
About
Animated placeholder (bone) for content that's loading. KasySkeleton draws a rectangular or circular block; KasySkeletonGroup synchronizes the animation of every bone inside it.
KasySkeleton({ width, height, borderRadius }): rectangular bone.KasySkeleton.circle({ size }): circular bone (avatar, icon).borderRadius: corner radius of the rectangular bone; defaults toKasyRadius.smBorderRadius.KasySkeletonGroup(animation: KasySkeletonAnimation): controls the animation of all childKasySkeletonwidgets.shimmer(default): a highlight band sweeps left to right.pulse: all bones fade in and out together.none: static color, no animation.
Automatically respects the system's "reduce motion" setting (falls back to none). Wrap your loading layout in KasySkeletonGroup and swap it for the real content once the data arrives.
Preview
Loading the component…
Last updated on 11/03/2026

