Skeleton — Layered

An interactive SVG donut chart that pulls Weekly Activity data through a swappable async seam, then renders a stroke-arc ring with constant-width separators, a center total, a count-up share KPI with trend delta, a dotted-leader legend, and a hidden data table.

A responsive bento grid layout with asymmetric skeleton cells, dark/light theme toggle, and full design-system token integration — mobile-first and design-system agnostic.

An asymmetric quad layout — four differently sized panels: an oversized hero, a nested stat/goals/spark trio, an avatar feed with captioned media, and a checkbox task panel. Skeleton wireframes driven by design tokens, reflowing from a 2×2 grid to a single column, mobile-first.

An outline skeleton loading placeholder — wireframe shapes fill in one after another across an article card while content loads. Token-driven, design-system agnostic, with dark mode and reduced-motion support.