Low sun glows through rows of cut tissue banners strung across a lime-washed street: rosa, orange and turquoise sheets cut with flowers, swallows and stars flutter, print colored light on stone and plaster, swing back as a gust runs down the street and settle under a row spelling FIESTA.
Written and rendered by AI CSS Animations Oct 19, 2026
Papel picado, Spanish for "perforated paper", is a Mexican folk art of cutting intricate designs into colored tissue paper and stringing the sheets into banners. Artisans traditionally cut stacks of up to fifty sheets at once with chisels and a mallet over a drawn template, and the town of San Salvador Huixcolotla in Puebla is known for the craft. Each sheet stays one connected piece, its motifs held by small bridges of paper, and the banners hang over streets, plazas and altars for weddings, saints' days, fiestas and the Day of the Dead. Today they are also cut from plastic to last outdoors, and designers borrow the look widely for festive work.
Make a 10-second 3D film of papel picado: rows of cut tissue-paper banners strung across a narrow street flutter in the wind, the low sun glowing through their cut patterns and printing colored light on the wall and paving. <inputs> If I don't give you something, use the default and don't ask. - Event: the Barrio Tepalcate street fiesta (fictional). - Title: "Under the paper sky" - Line: "Barrio Tepalcate street fiesta · Saturday 12 September · from 5 PM" - Lettered row: FIESTA, one letter per sheet, in the second row. - Banners: five rows of 14 sheets (70 in all). - Length: 10 seconds. </inputs> <direction> - Look: late-afternoon light down a lime-washed street, looking toward a low sun. The banners overhead glow like stained glass where the sun comes through the tissue, and every sheet throws a colored print of its cut pattern onto the sunlit wall and paving. Warm, bright and clear from the first frame. - Palette: sky dusty turquoise #5FB3C4 at the top, warming through #9FD0C8 to #FFD9A0 over the far end of the street, with a soft sun glow #FFF0C8 low behind the far rows; lime-wash #F3E8D4 in sun and #D3C6CC in shade (a cool lilac grey, never dark); terracotta base band #B8562F; paving #DCC9A8 with joints #A8916F; door and window frames cobalt #1F4FA3 and turquoise #12A3A0; tissue rosa mexicano #E6007E, cempasúchil orange #FF8A00, yellow #FFD100, lime #8DC63F, turquoise #00A9B5, violet #6B2D91, red #E5222D; cord #F7F2E8; type #3A0F2E, secondary #6E3A5C. - How the colors interact: backlit tissue glows at up to twice its base value, so rosa and orange run hot against the turquoise sky, their complement; where two sheets overlap they multiply like stained glass (yellow over rosa reads scarlet, turquoise over yellow reads green, violet over orange reads brick); each sheet's print lands as a tinted pool at about 60% brightness with its cut motifs as bright sunlit holes, and overlapping prints deepen. - The street (1 unit = 1 m): 6 wide and 40 long, running away from the camera toward the sun and open to the sky at its far end over a low hazy roofline #E8BE96. Paving of 0.5 × 0.35 stones in running bond, each slightly domed with a seeded tone (±5%) and 2 cm joints. Two walls 5.5 tall, lime-washed (a CanvasTexture of soft trowel blotches and grit, ±4%) over a 0.8-tall terracotta base band. Set 0.25 into them: on the left, a cobalt door and two barred windows with red geraniums in clay pots on their sills, all placed 8–20 m down the street so the near wall stays plain; on the right, a wooden double door in a turquoise frame, a wrought-iron lamp bracket and a small balcony with a thin rail. One far facade is painted ochre #E0A43A for depth. - Sun: low at the far end of the street, 20° left of its axis and 30° up. The right wall and the right half of the paving are in sun, the left wall's face and the left third of the paving lie in soft shade from the left wall, and the sheets are backlit from the camera's side. - Cords: rows at z −3, −6.5, −10, −14 and −19, strung wall to wall at 4.4 m and sagging 0.3 m in a catenary; cotton cord (TubeGeometry, radius 0.006). - The sheets, built like the real thing: 0.36 wide by 0.46 tall, folded over the cord along a 0.025 band and spaced 0.06 apart. Each is a PlaneGeometry of 12 × 16 segments carrying a 1024 × 1300 CanvasTexture mask cut from one of six designs drawn at load: a border of small cut triangles and diamonds; a scalloped inner frame; a central motif (an eight-petal flower with leaves; two swallows facing a flower; a sun disc of 16 rays; an eight-point star in rings; a basket of three flowers; a field of small hexagons); and a bottom edge cut into points. The paper stays one connected piece: every motif is held to the frame by bridges 6–10px wide, as a real cut stack must be. The six FIESTA sheets carry one letter each (Alfa Slab One, 560px) cut as an opening, its counters held by two bridges, ringed by small cut flowers. Paper texture: fine crinkle (seeded noise, ±8% brightness), the faint cross creases of a sheet folded in quarters for packing, and the double-thick top fold 25% deeper in color. Colors run along each row in a seeded order with no two neighbors alike; FIESTA reads rosa, orange, yellow, lime, turquoise, violet, with four patterned sheets on each side. - Tissue shader: discard wherever the mask is cut. Front-lit: color × (0.65 + 0.35 × the sun's diffuse term). Backlit (the sun behind the sheet as seen from the camera): color × sun × (0.55 + 1.2 × pow(max(0, dot(viewDir, sunDir)), 2)), times the crinkle, so sheets near the sun's line glow hottest and the rest stay rich. Draw sheets back to front in two passes, a multiply pass that tints whatever lies behind by the sheet's color and a glow pass at 85% opacity, so overlaps deepen like stained glass. - Light prints: for every sheet, two more meshes of the same geometry whose vertices are projected along the sun direction, one onto the paving (y = 0.005, discarded beyond the right wall) and one onto the right wall (x = 2.995, discarded below the paving), computed in the vertex shader from the same flutter function and drawn with multiply blending: paper multiplies by mix(white, tint, 0.62), cut areas leave the surface untouched. Prints that would land in the left wall's shade are skipped. They stretch toward the camera and ripple as the sheets move. - Wind, all closed-form: each sheet hangs from its fold and bends like thin paper, an out-of-plane displacement A · v² · sin(k·u + ω·t + φ) (v from 0 at the fold to 1 at the bottom edge, u across the sheet, A = 0.03, k = 9, ω 5–8 rad/s, a seeded φ per sheet), its bottom corners curling ±0.02 out of phase, plus a swing about the cord θ = 6° + 3°·sin(1.3t + φ) + the gust. Each cord sways ±0.05 on a 2.4 s sine. The gust runs down the street from the sun toward the camera at 10 m/s, reaching the far row at 3.0 s; at each sheet it adds 48°·(1 − e^(−τ/0.12))·e^(−τ/0.7) + 10°·e^(−τ/0.5)·sin(2π·1.6τ) of swing (τ is the time since it arrived) and doubles the flutter for 1.2 s. Sheets never touch a neighbor, another row or a wall. - Light: a sun DirectionalLight #FFDDB0 at 2.6 from the direction above, with soft shadows from the architecture only (PCFSoftShadowMap, 2048), so the left wall's shade falls across the paving; a HemisphereLight #DDEFF2 / #E9D2AE at 1.2 so the shaded wall stays at least 70% as bright as the lit one; walls and paving MeshStandardMaterial, roughness 0.95. The sky is a large backdrop sphere carrying the gradient. ACESFilmic, exposure 1.1. - Camera: fov 46. It opens 0.9 m from a rosa flower sheet in the first row, below and in front of it, looking up 30° toward the sun, so the sheet, glowing through its cut flower, fills about 60% of the frame height. It cranes down and back to eye height (1.6 m) by 2.8 s, looking down the street with all five rows overhead and their prints on the paving, then dollies forward 4 m (easeInOutSine) and settles by 6.0 s in the final view: 1.4 m from the left wall, pitched up 14° and yawed 8° right, the FIESTA row across the top of the frame with its letters between about x 880 and 1540, the far rows receding toward the sun glow, prints dappling the right wall, and the shaded left wall filling the lower left as plain lime-wash behind the type. By then the first row is overhead and out of frame. It never passes through a sheet. - Type (HTML over the canvas): title Bricolage Grotesque 800 (opsz 96), 84px, #3A0F2E, left-aligned at x 120 on baseline 910; line Bricolage Grotesque 500, 26px, #6E3A5C, on baseline 962. Text rises 14px as it fades in over 0.6 s on cubic-bezier(0.22, 1, 0.36, 1). In the final frame no sheet or print enters x 100–980, y 800–1000. - Premium: tissue that glows where the sun comes through, cut motifs held by real bridges, overlaps that deepen like stained glass, colored prints on stone and plaster that dance in the wind. Cheap: flat colored rectangles with a lace pattern, sheets waving in unison like a flag, grey shadows. Banned: sombreros, cacti, piñatas, maracas, skulls or skeletons, mustaches or any caricature, invented Spanish, people, bloom, lens flares, grey or black shadows from the sheets, sheets passing through each other, motion blur, anything flashing more than 3 times per second. </direction> <structure> - 0.0–1.2s: close under the first row: a rosa flower sheet glows against the sky, its crinkle, creases and bridges visible, fluttering in the breeze. - 1.2–2.8s: the camera cranes down and back to eye height: the street, all five rows and their colored prints appear. - 2.8–4.7s: the dolly begins; the gust comes down the street from the sun: row by row the sheets swing back and snap, the prints race across the stones and up the wall, and it passes over the camera at about 4.7 s. - 4.7–6.0s: the sheets settle in shrinking swings as the camera eases into its final view; at 6.0 s the FIESTA row hangs nearly still, glowing across the top of the frame. - 6.0–7.4s: the sun glow warms 10% and sinks 20px; the title rises in at 6.4 s and the line at 6.8 s. - 7.4–10.0s: hold: only the breeze flutter and the cord sway, at half amplitude. For other lengths, stretch the dolly and the settle; keep the gust's own timing and at least 1 s of hold. </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. No image, video, texture or model files: every shape and texture is generated in code. - window.seek(t), t in seconds, computes every visual from t alone: no CSS transitions or CSS animations, no setTimeout/setInterval, no state carried between frames, randomness only from a seeded PRNG. Anything cumulative is solved analytically from t or precomputed once at load at a fixed step. Past the end, seek clamps to 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> are fine; await document.fonts.load() for each face before defining window.seek. - Engine: three.js as an ES module pinned to three@0.160.0 through an import map on jsDelivr (`three` and `three/addons/`). WebGLRenderer with antialias, preserveDrawingBuffer: true and setPixelRatio(window.devicePixelRatio); render once at the end of every seek. Text is HTML over the canvas. - Flutter, swing and gust are closed-form functions of t and each sheet's seeds, evaluated in the vertex shader from a time uniform and shared by the sheet and print meshes; the masks are drawn once after the fonts load. </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 every sheet stays one connected piece with its bridges visible, backlit sheets glow and overlaps deepen, prints are colored (never grey) and fall where the sun would throw them, the gust reaches the far rows first, FIESTA reads left to right, no sheet intersects another, a cord or a wall, the shaded wall never goes dark, the 6.0 s frame is settled, and the title sits on plain wall. 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.
A jazz-tempo film title sequence in flat vermilion, mustard, bone and black: hand-cut paper shards jab in on the beat,…
A Swiss-style event poster that builds itself on a visible 12-column grid: grotesque type rises out of baseline masks,…
A primary-colored circle, square and triangle roll, drop and turn into place on a black bar, assembling a constructed B…
A Constructivist poster in motion: red bars, a wedge piercing a black circle, halftone fields and condensed uppercase t…
More like this on the motion design inspiration board: 3D motion design inspirationMotion graphics inspiration