GHOSTFRAMES

Configuration Playground

Tune config values and preview skeleton behavior in real time.

Controls

Adjust animation, color, radius, and speed

Current Swatches

Base #2525a8
Highlight #090c46

Live Preview

The preview updates as controls change

Previewing skeleton colors

Enterprise Plan

Best for teams managing multiple projects

$99

PriorityAnalytics

Generated Config

Copy and use this config in your app

tsx
const config = {
  "animation": "shimmer",
  "baseColor": "#2525a8",
  "highlightColor": "#090c46",
  "borderRadius": 10,
  "speed": 1,
  "minTextHeight": 12
};

<AutoSkeleton loading={loading} config={config}>
  <YourComponent />
</AutoSkeleton>