AIMRAN
Cargando
HTML + CSSLoaders

Sewing machine stitch loader

A sewing machine needle bobs up and down as denim slides past and leaves a line of stitches behind.

Settings

16px
1x

Code

<div class="uvq10-sew" role="status"><span class="sr">Loading</span><div class="fab" aria-hidden="true"><i class="st"></i></div><div class="hd" aria-hidden="true"><i class="nb"></i><i class="ft"></i></div></div>

Prompt for AI

Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.

Markdown version with all the code, for AI assistants

More in Loaders

See all Loaders

Circular spinner

LoadersReact + Motion

Bouncing dots

LoadersReact + Motion

Indeterminate progress bar

LoadersReact + Motion

Skeleton card

LoadersReact + Motion

Square to circle loader

LoadersHTML + CSS

Sliding tiles loader

LoadersHTML + CSS

3D cube loader

LoadersHTML + CSS

Self-drawing triangle

LoadersHTML + CSS

Where to use it

A vintage sewing machine head with a gold decal, a presser foot and a needle that moves in sync with a strip of denim. The twill texture, the hem and the orange stitch line all scroll by exactly one stitch per cycle, so the loop never jumps. It suits fashion shops, craft blogs and custom order flows.

The main color sets the fabric and the second the thread, so denim with orange thread can become linen with navy. Use it while a product is customised or an order is prepared.