Collage design (you'll also hear cut-and-paste design or photomontage style) is a web design style assembled from layered scraps: torn paper strips, taped-down photos, clipped headlines, postage stamps, and handwritten notes. Type mixes like a ransom note, a classic serif beside a typewriter face beside a marker scrawl. Everything tilts a degree or two, every layer casts a small honest shadow, and the finished page feels like a scrapbook spread composed by someone with scissors, glue, and taste.
It solves the sameness problem from the human side. A decade of template sites trained visitors to expect neat grids of rounded cards, and collage breaks that expectation with visible handwork. When a page looks physically assembled, people assume a person is behind it, and for artists, ensembles, theatres, and boutique brands, that assumption is the entire pitch.
Where it came from
Collage is older than the web by about a century. The name comes from the French coller, to glue, and painters got there first: Picasso and Braque were pasting newspaper and wallpaper into their pictures around 1912. The Dada artists of the 1920s sharpened the scissors into a weapon, cutting up press photos and recombining them as photomontage. Then punk made it fast and cheap. The zines of the 1970s were photocopied cut-and-paste jobs, and Jamie Reid's ransom-note lettering for the Sex Pistols turned clipped-out type into an attitude the culture never forgot.
The web borrowed the look for the same reason punk did: it reads as human and a little defiant. As template builders made sites feel machine-made, designers started faking paper again, with scanned textures, tape, torn edges, and tilted snapshots, and the style found a natural home with musicians, theatres, magazines, and boutique brands. Modern CSS is what made it practical. Clip-path handles the scissor cuts, transforms handle the tilt, and real drop shadows sell the depth, so a scrapbook page can now load as fast as a plain one.
The six rules that make it work
Layers do the talking
Depth is the medium. Every scrap sits above or below its neighbors, and a soft cast shadow, never a glow, tells you exactly how far off the paper it floats.
Edges are torn, not drawn
Torn strips, scissor cuts, and tape do the framing. A crisp rounded rectangle breaks the illusion faster than anything else on the page.
Type reads like a ransom note
A serif headline next to a typewriter label next to a marker scrawl, as if each word was clipped from a different source. Three or four faces, no more.
Nothing sits perfectly straight
Every element rotates a degree or three. The tilt is the tell that a hand placed it, so a perfectly level card reads as a mistake here.
The chaos is composed
Under the mess sits a strict system: paper tones, one ink, two or three spot colors, and deliberate placement. Random-looking takes twice the design.
Motion behaves like paper
Layers drift gently at different depths and scraps settle with a small spring. Nothing zooms, spins, or bounces like an app widget.
When to pick it, when to skip it
Pick it if
- You're a theatre, ensemble, or performing-arts group with a season worth scrapbooking.
- You're a musician, label, or festival whose posters and merch already live in this world.
- You run a boutique or vintage shop where handmade is the actual selling point.
- You have a real archive to layer: photos, sketches, ticket stubs, press clippings.
Skip it if
- You're shipping a data-heavy product or dashboard. That job belongs to Flat Design or Bento.
- You're in a trust-first field like law or finance, where Editorial Design carries authority better.
- Shoppers need to compare specs and prices at a glance; tilted layers slow scanning. Studio Commerce handles that.
- You have almost no imagery. Collage runs on material, and Big Type does more with words alone.
How we build it
Every collage site we ship is built from scratch, no templates and no page builders, because a collage template is a contradiction in terms. The style only works when the layers belong to you. We start from your real material, photos, clippings, handwriting, ephemera, set the paper tones and spot colors to your brand, and compose each screen by hand the way you'd lay out a scrapbook spread.
The demo at the top of this page is exactly that: an original homepage we designed and coded ourselves, with torn strips, taped snapshots, and a ransom-note headline that recomposes itself. If you want to see how it sits next to calmer directions, the full catalog puts your business name inside all 20 styles at once.
Questions we actually get
How is collage different from maximalism?
Maximalism is about quantity: more color, more pattern, more of everything at once. Collage is about material. It can be surprisingly restrained, three spot colors and a stack of paper scraps, and still feel rich because every element looks physically placed. Maximalism turns the volume up; collage invites you to lean in and read the layers.
What fonts and colors work for it?
Mix three or four contrasting faces the way clippings come from different sources: a classic serif for headlines, a typewriter face for labels, a handwriting font for notes. This page and the demo pair Playfair Display with Special Elite and Caveat. For color, start from paper: warm off-whites, near-black ink, then two or three spot colors that do the shouting.
Can it work with our existing brand?
Yes, usually better than most styles can, because collage is assembled from your own material. Your photos become the taped-down snapshots, your brand colors become the spot inks and paper strips, and your voice becomes the handwritten notes in the margins. If your archive is thin, we art-direct new imagery to fill it.
How long does a build take?
Most of our custom builds go live in three to five weeks, and collage sits in the same range. The composing takes care during design, but the result is clean, fast code underneath: layers and transforms, not heavy image slices.