Embroidery Stitch

About this style

Embroidery decorates fabric with needle and thread, and its basic stitches are centuries old. Satin stitch fills a shape with closely laid parallel stitches, cross stitch builds images from X-shaped stitches counted on an even-weave grid, and backstitch draws lines, while a hoop keeps the fabric taut. Hand embroidery has had a revival among makers sharing their work online, and craft brands and pattern sellers use stitch-by-stitch films to show how a design comes together.

Make a 10-second hand-embroidery film: a design is stitched into linen in a wooden hoop, stitch by stitch, starting in close-up at real speed and finishing as a time-lapse.

<inputs>
- Stitched words: "MADE SLOWLY" (cross stitch, two lines).
- Brand: "Hedgerow & Hoop" (a fictional embroidery supply shop), on a kraft tag.
- Tag line: "Kits for patient hands."
- Thread colors: as below.
- Length: 10 seconds.
If I don't give you something, use the default and don't ask.
</inputs>

<direction>
Shot: top-down on an indigo cotton tablecloth #23324D with a faint 2px weave. The hoop is centered at (760, 540): outer diameter 860px, two concentric wooden rings each 26px wide (#C9935A with seeded grain streaks, a darker outer edge and a light inner bevel), and a brass screw clamp at 12 o'clock with a knurled knob. Inside, linen #E9E0CC with a visible plain weave: threads every 5px both ways, alternating slightly lighter and darker, with seeded slubs, generated once at load. The excess linen shows as a 40px ring outside the hoop with a pinked edge.
Props at right: a kraft tag (#C8A77A, 360×220px, a cream twine loop through its hole) at about x 1290–1650, y 430–650, rotated −4°, carrying the brand in Young Serif 44px, ink #2B2118, and the tag line in Karla 500, 24px; below it three floss skeins (bundles of about 40 parallel strands with paper bands) in sage, coral and mustard.
Threads: navy #2E3E6E (cross stitch), olive #6B7F3A (stems), leaf greens #7F9C52 and #A9BE73, coral #E0745A (petals), mustard #E2B23E (flower centers), blush #F2B8B0 (scattered knots).
Design inside the hoop (inner diameter 808px):
- Words: "MADE" over "SLOWLY", centered, in cross stitch on a 10px grid (each X over two linen threads), from a 5×7 uppercase bitmap alphabet you define in code, one cell between letters and three rows between the lines. Each X is two diagonal stitches, bottom-left to top-right first, then top-left to bottom-right on top, with every top stitch running the same way.
- Around them a wreath: a backstitch stem circle of radius 290px, open 60° at the bottom (12px stitches); 18 satin-stitch leaves along it, each split down the middle and filled with parallel stitches at opposing angles (fishbone satin); five lazy-daisy flowers (five looped petals, a tiny tie stitch at each tip) with French-knot centers; twenty blush French knots scattered between.
Stitch rendering: each stitch is a slightly arched capsule 3px wide: base color, a darker 1px edge, a lighter center highlight, diagonal light ticks every 3px for the floss twist, and a soft contact shadow (1.5px offset, 2px blur, 25%). Ends narrow by 20% where they dive into the weave, and the linen darkens slightly at each hole. Satin stitches lie side by side with gaps of 0.5px or less and seeded ±1.5° and ±1px variation. French knots are tight coils (a disc with a spiral highlight); lazy daisies are thin loops held by a tie.
Needle: a 64px steel needle (light #DADDE2 to #8A9099 along its length, with an eye) trailing the current thread to the last exit point as a catenary. Each stitch draws from its start point as the needle travels to its end, then gives a small tug (the thread straightens on arrival).
Pace, the signature of this piece: real speed into time-lapse. The first three crosses take 0.3s per half-stitch with the needle clearly visible; then the rate ramps exponentially to about 220 stitches a second, the needle hopping ahead at 35% opacity while it is that fast, and slows again for the last French knots and the final knot. Every stitch's start time comes from one precomputed monotone schedule, so seek is exact.
Camera: starts at 2.2× on the first letter, pulls back to the full hoop over 2.4–3.6s (easeInOutCubic), then a 3% slow push to the end.
Premium: thread you can believe in (twist, sheen, contact shadow), satin stitches laid edge to edge at a constant angle, true X construction, the linen weave visible between stitches, a needle and thread doing the work. Cheap: dashed lines on beige, uniform vector strokes, whole shapes fading in.
Banned: dashed-line stitches, gradients other than thread, needle and wood shading, any stitch appearing out of schedule order, glow, emoji, anything flashing more than 3 times per second.
</direction>

<structure>
- 0.0–0.6s: a close-up on linen at 2.2×; the needle comes up through the fabric at the first cell of the M.
- 0.6–2.4s: three crosses at real speed, half-stitch by half-stitch, the thread tugging tight each time.
- 2.4–3.6s: the camera pulls back to the full hoop as the stitching speeds up through the words.
- 3.6–4.4s: the backstitch stem runs around the wreath.
- 4.4–6.2s: the satin leaves fill in, half-leaf by half-leaf.
- 6.2–7.0s: lazy-daisy petals loop out, five per flower.
- 7.0–7.8s: French knots, the pace slowing back to real speed.
- 7.8–8.4s: the final French knot at a flower center; the needle lifts away and its thread end disappears behind the fabric.
- 8.4–9.0s: the kraft tag slides in from the right and settles with a slight overshoot; the skeins are already in place.
- 9.0–10.0s: hold.
Other lengths: stretch the time-lapse middle; keep the real-speed opening and closing beats.
</structure>

<build>
- One self-contained index.html (inline CSS and JS), a 1920×1080 (16:9) stage scaled to fit the window, designed for 60fps.
- window.seek(t), t in seconds, computes every visual from t alone: no CSS transitions or animations, no setTimeout/setInterval, no state carried between frames, randomness only from a seeded PRNG. Anything cumulative (growth, simulation, particles) is precomputed once at load at a fixed step or solved analytically, so seek can jump to any time. Past the end, hold the last frame.
- Without ?render in the URL, drive seek from requestAnimationFrame so it plays in a browser (loop after a 1s end hold); with ?render, don't start that loop.
- Google Fonts via <link>; await document.fonts.load() for each face before assigning window.seek.
- Engine: Canvas 2D. Linen, wood grain and every stitch's geometry are precomputed once at load from a seeded PRNG; seek draws the stitches the schedule has finished, the active stitch, the needle and the thread.
</build>

<check>
Before showing me, step through one frame per second (t = 0…10): screenshot each and look at it. Fix overlaps, clipped or cramped text, and anything off-style or Banned. Check that every cross sits on the grid with its top stitch running the same way, satin leaves have no gaps or ragged edges, the close-up reads as thread rather than lines, the words are readable at 1280×720, the tag text is at least 24px and clear, and the needle never hides the stitch it just made. Confirm seek(10) and seek(11) match, so the final frame holds.
</check>

Ours, and free to use under CC0: copy it, change it, ship it. No credit needed.

Similar prompts

Blueprint Technical Drawing

Made by us

A cyanotype-blue engineering sheet that drafts itself: centerlines, compass-swept gears, hatching and dimension lines a…

Art Deco Gold

Made by us

A symmetrical Art Deco reveal in black and metallic gold: a sunburst fans open, stepped pinstripe frames draw from the…

Op Art Illusion

Made by us

A black-and-white Op Art piece: crisp stripes swell into a bulging lens and slow waves, and the title exists only as a…

Japanese Ma Minimal

Made by us

A quiet Japanese minimalist piece on generated washi paper: a single sumi ensō is brushed on with dry-brush texture, sm…