Cutout
Exceptional
Free in Modulify
You can clone, edit, and host in modulify.ai
More sections
Explore the collection
- New
Lens BloomA scroll-choreographed photoshoot reveal driven by a single timeline scalar. On load, a large two-word display-serif title fades in as a centred phrase, then the two words split apart while the photo cards appear one by one into a fanned row in the opening gap. Scroll or drag and the words fade out as the row gathers into one dominant, dead-centre hero card with the rest of the deck stacked behind and peeking at the top; a restrained editorial layer then rises in as a second beat — a roman-numeral name, a one-line description, and a fraction counter ringed by two concentric circles, joined by a hairline that draws itself from the name across to the number and softly lights the ring on contact. Keep scrolling and the deck advances vertically — the next photo descends from the top stack into the hero slot while the passed one drops away, each switch carrying a velocity-driven chromatic motion-streak; the name, description and counter cross-update. One requestAnimationFrame loop eases the timeline toward the scroll target and lays out every card, word and chrome element; a tween library owns only the one automatic load beat. Wheel, drag, arrow-key or swipe all drive it, and it lets the page scroll past at either end. A one-time bob after load and a persistent "Scroll or drag" cue teach the interaction. Below 768px it becomes an edge-to-edge full-bleed swipe gallery with a lift-to-reveal advance, a bottom-left caption over a scrim, and a thin progress bar. Theme-aware paper/dark stage, honours prefers-reduced-motion (composed, no auto-play), and pauses when the tab is hidden. Ships with a demo photo set — swap the files to use your own shoot.
EmulsionA photography portfolio built as a WALL you pan across. Scrolling doesn't move a page — it dollies a camera sideways along a long bone-coloured wall where photographs hang from pins. The giant word runs ALL the way right on the first scroll — until its own origin sits on the frame edge and you read it from the beginning — then holds dead still while the about-paragraph rises in beneath it, and only afterwards travels left: right, still, left, three distinct movements rather than one drift. It opens with the introduction top-left, three photographs hanging in the RIGHT half, and the headline FILLING THE BOTTOM of the frame — one word at half the viewport height, sitting on the floor with its descenders running off the edge, big enough that it stops being type you read and becomes the surface the photographs are pinned to. The FIRST scroll is sequenced, not simultaneous: everything RECEDES: the headline climbs off the floor toward the centre, walks RIGHT against the pan and shrinks to two-thirds; the same three photographs re-hang themselves in toward the CENTRE and shrink with it; the introduction travels off to the left; and only once it has cleared does a note about the work RISE UP from under the fold. The PHOTOGRAPHS are the fast layer (1.4, one rate for every print) and the giant type is slow (0.70 and 0.90 per word, so the prints run 2x and 1.6x faster), so the pictures skate across in front of a word that sits almost still behind them like paint on the wall itself — scrolling feels like travelling past photographs rather than dragging a poster sideways. Nothing animates on scroll-in — no fade, no develop, no swing-on-arrival, no visibility gate; a photograph is simply on the wall, fully formed, and geometry alone keeps each one out of the beat before its own — three at the opening, five at the statement, six at the archive — and the contact board slides in from the right exactly as the last prints slide out to the left. Past the opening trio the photographs are ONE HORIZONTAL RUN — every print a bead on a single thread, positions solved so neighbours never touch, and because all prints share one parallax rate the gaps are frozen for the entire scroll, so no two can ever overlap. Exactly ONE paragraph is on screen at a time — each clears the left edge before the next appears, which does more for the section than any of the motion in it. Only once all of that has arrived does the introduction let go and travel off to the left. Only then does the wall start travelling, five more prints going up at the statement and six at the archive, each new one pinned over the ones already hanging, before it ends on the contact card. Behind all of it a vermillion serif headline the height of the viewport drifts past at 62% of the camera's speed — it starts SITTING ON THE FLOOR of the section, descenders running off the bottom edge, and climbs as that first scroll lifts everything at once — TWO words — photographer, at nearly two screen-widths, and work. There are TWO pins: a short one at the opening, where the trio comes to rest CENTRED and holds dead still for the whole life of the first word — long enough for it to travel right, hold, and slide completely out of frame from behind the still images, so the photographs become the fixed thing the word moves past — while the about-paragraph rises in beneath them — a hold that costs every downstream beat, since the held word's clock lags for the rest of the wall and everything after it has to be re-derived, and a long one where work holds one screen position for a whole stretch of the wall while NINE photographs are hung over it in three waves, left to right, until they fill the frame in two bands around the giant word — the word arrives first and alone, and its first three pictures travel in behind it and lock on at the exact frame it comes to rest, because a picture that parks itself before the word has arrived at nothing and a picture that leads the word announces it — before the entire frozen formation releases and slides off together, handing the frame straight to the contact board — which has no reveal of its own either; it is simply there, fully formed, when you reach it. Photographer is — its two anchors solved by measuring the real face glyph by glyph, so that 'grapher' fills the frame edge-to-edge on load and then — moving RIGHT as the photographs move left, and shrinking a little — sits WHOLLY inside it, starting flush on a complete letter rather than a sliced one. At that size a second giant word cannot fit on the wall without colliding, so word size and word count are the same decision. THREE THINGS CARRY IT. First, every frame is a real PENDULUM: each print hangs from a pin somewhere along its top edge — never the centre, so it hangs crooked the way a real print does — and swings on θ'' = −(g/L)·sin(θ−θ₀) − c·θ'. Scrolling does not disturb it; the wall pans and the prints ride it dead still, and the camera is direct — one short smoothing lerp, no magnet and no momentum, so the wall stops exactly where the wheel stops. Only you move a print. Sweep the cursor through a cluster and they shove away from it; hover one and it lifts toward you, deepens its shadow and steadies, as if you'd put a finger on it; GRAB one and you swing it by hand — the angle tracks your pointer around the pin and letting go hands the release velocity straight back to the pendulum, so each rings down at its own rate because each carries its own arm length. Second, The photographs fade up 0 to 100% once, on PAGE LOAD, and that fade waits until the film has DECODED and the headline's typeface has loaded, so nothing measured or painted changes after you can see it, and after that nothing animates on scroll-in: no fade, no develop, no swing-on-arrival, no visibility gate. A photograph is simply on the wall, fully formed, and you travel past it — prints enter by TRAVELLING in from off-frame right, which the layout guarantees on its own, so geometry does the whole job an arrival gate used to. The giant words are drawn glyph-by-glyph on canvas but rendered RIGID — one flat baseline, no per-letter spring and no ripple, because at half the viewport height a wave is a wobble rather than a texture. Film grain sits over the whole scene on a per-frame jitter, blended with overlay so it textures the wall without lifting the blacks out of a print. The wall ends on a vermillion contact board — a real form with underline fields, a send state and a footer. ONE raw requestAnimationFrame clock owns the camera, the pendulums, the development curves and the canvas paint; GSAP owns only the copy and chrome reveal — the photographs have NO load animation at all; the wall is simply already hung when the page opens, at full opacity, at rest and developed, because an entrance nobody asked for is a toll charged before the section can even be looked at. Theme-aware (a bone wall or a dark studio), keyboard-navigable (arrows, Home/End), wheel- and touch-driven, DPR-capped, pauses off-screen and in hidden tabs, honours prefers-reduced-motion with a still wall, and lays out its own narrower column on a phone.- New
FriezeA dark, theme-aware 3D cover-flow wall of cinematic frames. On load the panels streak in with heavy horizontal motion blur, straighten into a line, then zoom into a settled flat-plane wall where the centre frame sits head-on and the side frames rotate inward and read a little larger toward the corners. Scroll, drag (axis-locked), or arrow-key through the reel on spring momentum with a clean snap — no auto-drift, it rests composed. Frames in motion smear with a fine 18-level chromatic-aberration blur while the corner frames carry a permanent soft edge aberration, so the wall always has depth. A liquid-glass VIEW lens magnetically tracks the cursor over the wall — real refraction on Chromium, a frosted fallback elsewhere — and reads CLOSE while a frame is open. Click any frame and it flies to a centred medium hero with feathered corners as the rest of the wall tilts edge-on and recedes; a caption then resolves beneath it in a staged second beat — index, hairline rule, serif project name and a one-line description, each line rising and de-blurring in turn. Esc, the close button, or a click returns the frame to its exact slot. One requestAnimationFrame clock owns every transform, opacity and filter; GSAP tweens only the single open/close scalar and the name reveal, so the physics and the chrome never fight. Theme-aware light and dark, keyboard-operable, honours prefers-reduced-motion, DPR-capped, and verified in a 390-wide mobile portrait. Ships as a reusable component that takes any array of image frames with a name and description as data. - New
IrisA full-bleed photographic portfolio that moves like a camera lens. A large circle of focus holds each photograph — bright and sharp — over the same image blown full-bleed and gently dimmed so the two-line serif title (Playfair) reads, framed by three thin concentric rings with cardinal nodes. To travel between frames the picture doesn't cut or slide — a real camera-lens iris shuts over it: a dark round aperture closes inward to a shrinking hole until the frame is black, the photo swaps under cover of black, then the aperture opens again to reveal the new shot as the title lands a beat later. The prev/next buttons are Apple-style liquid-glass camera lenses that refract the photo behind them and blink on each shot. Wheel, drag/swipe, or arrow keys all drive it; slides mix colour and editorial black & white. A single requestAnimationFrame clock owns the aperture timeline; GSAP owns the title. Orientation-aware so the circle fills any screen; honours prefers-reduced-motion with a slow, gentle crossfade that never flashes to black.