A fictional specimen banknote engraves itself on a dark table: braided guilloché rosettes and rope borders sweep around like a rose engine in green and violet inks, lettering and numerals engrave line by line, and a loupe glides past to show a hairline border is microtext.
Written and rendered by AI CSS Animations Oct 16, 2026
Guilloché is engraving of fine, repeating interlaced curves with a rose engine or straight-line engine, lathes in which a cam moves the cutter as the work turns. It decorated watch dials, jewelry and enameled objects such as Fabergé's eggs, and became a standard security feature on banknotes, bonds and passports because its dense, precise linework is very hard to copy by hand. Banknotes pair it with microtext, raised intaglio printing and blended underprint colors, and it still appears on currency, certificates and watch dials today.
Make a 10-second animation of a fictional banknote engraving itself: guilloché rosettes and borders cut like a rose engine, then lettering, numerals and microtext. <inputs> Issuer: Reserve Bank of Merrowind. Denomination: 50, written FIFTY VELLS. Serial: MV 204816. Series: 2026. Marking: SPECIMEN · NOT LEGAL TENDER (always shown). Duration: 10s. If I don't give you something, use the default and don't ask. </inputs> <direction> Stage: dark green-black table #101613. The note: 1520×720 at x 200, y 180, corner radius 16px, soft shadow (0 30px 60px rgba(0,0,0,0.45)). Paper #EEF0E3 with an iris underprint blending peach #EED8C4 at left to mint #CFE5D8 at right under a fine 45° line screen at 6%, and a few dozen seeded red and blue security fibers (1px, 6–14px long). Inks: intaglio green #1E4A3A, violet-brown #5B3A5C for the second pass, serial red #B4261F. Guilloché: every pattern is a family of thin closed curves (1.1px) from polar formulas, each an SVG path of 1,500–3,000 points. Main rosette at (540, 540): an outer braid of 18 curves r = 205 + 18·sin(20θ + 2πk/18); a petal ring of 16 curves r = 125 + 28·sin(8θ + πk/16); an inner disk of 12 curves r = 58 + 20·sin(6θ + 2πk/12). Braid and disk in green, petals in violet-brown, so they interweave. Top and bottom borders: inside a double rule inset 28px, 40px bands (y 236–276 and 804–844) of 10 curves y = yc + 12·sin(2πx/64 + 2πk/10), reading as rope. Corner medallions (radius 58) at (300, 345) and (300, 735), each a small rosette behind a 50 in Bodoni Moda 900, 44px. Tune amplitudes so neighboring curves stay at least 3px apart on average: lace, not solid tone. Layout: center column on x 1045: the issuer on two lines in Cinzel 700, 34px, tracking 0.12em (baselines 352 and 398); a 1px rule; FIFTY VELLS in Cinzel 900, 52px (baseline 520); SPECIMEN · NOT LEGAL TENDER in Cinzel 700, 22px, red (baseline 610); the serial in Courier Prime 700, 30px, red (baseline 700); SERIES 2026 in Cinzel 600, 20px (baseline 750). At right, a watermark window, an ellipse 220×280 centered at (1490, 440) where the underprint stops and a small rosette shows in relief (4% lighter and darker offsets); below it, 50 in Bodoni Moda 900, 190px, baseline 790. Numerals are engraved: 1px horizontal lines at 4px pitch clipped to the glyph, plus a 2px outline. Microtext: 8px Cinzel lines repeating the issuer and FIFTY VELLS run along the inner edge of both bands and around the rosette on a circle of radius 238. It must look like a fine rule until magnified. Motion is mechanical and exact, like a rose engine turning. Each family draws by stroke-dashoffset, all its curves together, sweeping 360° over 1.6s on cubic-bezier(0.45, 0, 0.55, 1), while a 4px ivory cutting point rides the leading end of one curve. Bands draw left to right at constant speed. Type is engraved: each glyph's line fill sweeps top to bottom through a clip in 0.35s, then its outline draws. The real thing is mathematical precision at hairline weight, layered in two inks; the cheap version is a gold-bordered rectangle with a spirograph and a big number. Banned: real currencies, banks, countries or symbols, portraits, holograms, foil, glitter, lines over 2px (except the frame), curves close enough to moiré at 1280×720, gradients other than the underprint, blur on linework, dropping the SPECIMEN marking, anything flashing more than 3 times per second. </direction> <structure> 0.0–0.8s: the blank note slides up 30px onto the table as its shadow settles; the underprint wipes in left to right. 0.8–1.6s: the double rules draw from the top-left corner both ways; the rope bands draw left to right. 1.6–3.4s: the main rosette engraves: braid, then petals, then the inner disk, 0.5s apart. 3.4–4.4s: the corner medallions engrave; the watermark window clears and its relief fades up. 4.4–5.8s: the issuer and FIFTY VELLS engrave letter by letter, 30ms apart; the numerals follow. 5.8–6.8s: microtext reveals along the bands and around the rosette. 6.8–7.6s: the red pass: serial and SPECIMEN print with a 1px offset settling into register; SERIES 2026 appears. 7.6–8.8s: a 220px loupe (thin dark ring, soft shadow) glides right to left along the bottom microtext, magnifying it 4× inside its circle, and exits. 8.8–10.0s: hold, nothing moving. For other durations, scale every timestamp proportionally; keep each rosette sweep at 1.2s or longer. </structure> <build> One self-contained index.html, CSS and JS inline. Google Fonts via <link> are fine; await document.fonts.load() for each face before defining window.seek. No other libraries (no three.js: this style is flat). Draw in inline SVG; generate every guilloché path once at load and reveal it with stroke-dashoffset from seek. The loupe is a scaled clone of the microtext clipped to a circle. The stage is 1920×1080 (16:9), scaled to fit the window. Design for 60fps. window.seek(t), t in seconds, must compute every visual from t alone, clamping past the end to the last frame: no CSS transitions or animations, no setTimeout or setInterval, no state carried between frames, and randomness only from a seeded PRNG. 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. </build> <check> Before showing me, step through one frame per second: screenshot each and look at it. Fix overlaps, clipped or cramped text, accidental edge collisions, and anything off-style or Banned. Check the curves are smooth with no polygon facets, bands read as lace rather than solid tone or moiré at 1280×720, the loupe's magnified text lines up with the text beneath it, nothing crowds the watermark window, and SPECIMEN shows from 7.6s on. Confirm seek(duration) and seek(duration + 1) match, so the final frame holds. </check>
Ours, and free to use under CC0: copy it, change it, ship it. No credit needed.
A cyanotype-blue engineering sheet that drafts itself: centerlines, compass-swept gears, hatching and dimension lines a…
A symmetrical Art Deco reveal in black and metallic gold: a sunburst fans open, stepped pinstripe frames draw from the…
A black-and-white Op Art piece: crisp stripes swell into a bulging lens and slow waves, and the title exists only as a…
A quiet Japanese minimalist piece on generated washi paper: a single sumi ensō is brushed on with dry-brush texture, sm…
More like this on the motion design inspiration board: Line art animation inspiration