Theming

Customize skeleton styling with CSS custom properties on .sk, a theme wrapper, or the page root:

.custom-skeleton {
  --sk-color: #dbeafe;
  --sk-highlight: #bfdbfe;
  --sk-radius: 0.875rem;
  --sk-duration: 1.1s;
  --sk-gap: 0.75rem;
}

Available tokens:

Token	Default	Purpose
--sk-color	#e5e7eb	Base skeleton color
--sk-highlight	#f3f4f6	Shimmer highlight color
--sk-radius	0.5rem	Default border radius
--sk-duration	1.4s	Animation duration
--sk-gap	0.75rem	Default layout gap

Example

Custom theme