Skip to content
WebTricks

3 new CSS snippets — gradient text, spinner, skeleton

Three reusable CSS recipes with a live, editable preview you can tweak and copy.

Three new snippets landed, each with an interactive preview — drag the sliders and pickers, then copy the CSS with your settings baked in.

  • Gradient text — fill headings with a gradient using background-clip: text. Adjust the two colors and the angle.
  • Pure CSS spinner — a dependency-free loading spinner; tune size, thickness, color and speed.
  • Skeleton shimmer — an animated loading placeholder with a moving highlight for loading states.

All three are pure CSS — no images, no JavaScript — so they’re tiny and theme with a single custom property. Browse the full set in the snippets library.