Component · Cursor effects

Brushed velvet line animation

by Informeek Studio 11 November 2026
Live Brush the cursor across the velvet, or pick a colour

The prompt

Build a line animation that behaves like brushed velvet for a sofa maker hero, on a full screen 2D canvas. Lay a staggered grid of short fibres every 8.5px (8px on phones) with slight jitter, each storing a direction. The resting nap follows a slow wave, so the cloth shows soft light and dark patches. Shade each fibre by how it faces a light from the upper right, sorted into 12 tones from shadow to sheen, and draw each tone as one Path2D stroke with round caps. As the pointer moves, fibres within 64px (46px on phones) turn towards the direction of travel, weighted by distance and speed, and lift to show a brighter tip that fades in about 0.5s. The nap relaxes over many seconds, so strokes linger like a hand mark. Start with one curved stroke brushed in, and after 2.5s idle let an unseen hand stroke a slow looping path. Add four 44px round swatches, Moss (#215c4e to #96cdb6), Oxblood, Midnight and Ochre, blending the palette over 0.7s. Copy in cream (#f6eee2) over a dark left gradient, a gold (#e9c98f) label "Fernsby sofas, made to order", an 82px serif headline "Run your hand along the arm" with "arm" in gold italic, one line and two buttons, "Order free swatches" and "Visit the showroom". Cap devicePixelRatio at 2 and draw a still frame for reduced motion.

Written by Informeek Studio to recreate this design. Prompts are not deterministic: running it again gives a similar result, not an identical one.

Use it in three steps

  1. Copy the prompt with the button above.
  2. Paste it into your tool, such as v0, Lovable, Bolt or Claude.
  3. Make it yours by changing the four velvet palettes and the fibre spacing.

About this line animation

Most line animations draw a path. This one uses thousands of tiny lines to fake a fabric. Every short stroke on the page is a velvet fibre with its own direction, and its shade depends on how that direction faces the light, exactly as real velvet looks light one way and dark the other. Run the cursor across the page and the fibres you pass swing round to follow your hand, leaving a bright or dark track that lingers and slowly relaxes, just like the mark you leave on a sofa arm.

Four swatches change the cloth between moss green, oxblood, midnight blue and ochre, blending smoothly so the marks survive the change. All 18,000 fibres are drawn in only twelve strokes, one per tone, which keeps the canvas fast even on a phone, where an unseen hand keeps brushing the seat when nobody is touching it.

Why the prompt works

  • It shades by direction against a light, the whole velvet trick.
  • It gives the nap memory, so strokes stay before they settle.
  • It batches fibres into twelve tones, which is what keeps it smooth.
  • It adds swatches, turning a texture into a product choice.

Where to use it

Furniture and upholstery makers, fabric shops, fashion labels, hotels and any tactile brand that wants a page people stroke rather than scroll.

The prompt is shared under CC BY 4.0. Reuse it freely, including commercially, with a credit linking back to this page.

Keep exploring

More prompts like this

See the collection →