The Colors of Motion: the site that turns films into color

The Colors of Motion is a single-purpose website that takes a film, reduces every sampled frame to its average color, and stacks those colors in order to make a single stripe that represents the whole movie. It lives at https://thecolorsofmotion.com/, and it turns two hours of cinema into one quiet image a person can read in a glance.

The result is oddly moving. A film that took a crew years to make collapses into a vertical ribbon of blues, ambers, and greens, and somehow the story is still legible in the color alone. A viewer can see night fall, a mood darken, or a single red scene interrupt an hour of grey. The site proves that color is a narrative device, not just decoration.

In brief

• The Colors of Motion samples a film frame by frame, averages the color of each frame, and stacks the results into a chronological timeline of the movie's palette.
• It was created, designed, and developed by interaction designer Charlie Clark, and it launched in August 2014.
• The project won a Webby award in 2015 and grew from a data visualization into a shop selling physical prints.
• Clicking any color on a film's timeline reveals the exact frame it came from, along with its hex code.

What the website actually does

The premise is simple to state and hard to stop looking at. Pick a film from the library, and the site shows a tall column of horizontal color bands, one after another, from the opening frame to the last. Each band is the average color of a single sampled frame. Read top to bottom, and the column is the movie's color story told in order.

There is no video to watch and no audio to hear. The whole point is the abstraction. By throwing away everything except average color, the site removes plot, faces, and dialogue, and leaves only the palette a director and cinematographer chose. What remains is a fingerprint that is often instantly recognizable to anyone who has seen the film.

An image you can interrogate

The timeline is not a static poster. According to The Next Web, a visitor can click any individual color to pull up the frame it was averaged from, along with that color's hex code. The abstraction folds back into the source at a tap, so curiosity about a particular band never goes unanswered.

That small interaction changes the experience from looking to exploring. A person notices a jarring stripe of orange midway through an otherwise cool film, clicks it, and discovers the explosion or the sunset that produced it. The color leads, and the scene follows. It is a rare interface where the summary and the detail sit one click apart.

How the colors get made

The method is less glamorous than the output, which is part of its charm. As The Next Web reported when the site launched, the project uses a bash script to analyze a movie frame by frame and work out the average color of each, then presents those colors on the page sorted by time. The heavy lifting is done by ordinary command-line tooling rather than anything exotic.

Frames are sampled at regular intervals across a film's runtime rather than every single frame being kept, which keeps the timeline readable instead of impossibly dense. Each sampled frame is reduced to one representative color by averaging its pixels. Stack enough of those averages in sequence and the palette of an entire feature emerges as a smooth gradient of scenes.

The averaging is what gives the site its distinctive softness. A bright frame full of contrasting colors does not appear as a riot of hues. It appears as the single muddy or luminous tone those colors blend into. This is why the timelines look painted rather than pixelated, and why a violent action scene can register as a calm band of warm grey.

Why averaging tells the truth

It might seem that averaging destroys information, and in a narrow sense it does. Yet the blended color often captures a scene's real emotional temperature better than any single pixel could. A candlelit room averages to warm amber. A morgue averages to clinical blue. The math accidentally lands on the mood.

Across a whole film, those averaged moods line up into something like a graph of feeling. The eye reads the transitions without being told what they mean. A long cool passage that suddenly warms signals a turn in the story, even to a viewer who has never seen the movie. The technique is blunt, and it works anyway.

Where it came from

The Colors of Motion is the work of one person. Per the project's own About page, it was designed, created, and developed by Charlie Clark, described elsewhere as an interaction designer. It began, in Clark's framing, as an exploration of the use of color in movies, a personal data visualization rather than a business plan.

The launch date places it firmly in the mid-2010s wave of single-idea web experiments. The Next Web covered the site in August 2014, and Fast Company ran its own piece the same year, headlined around five famous films distilled down to their color palettes. The idea traveled fast because a single screenshot explained the entire concept.

Recognition followed. The About page notes that the project won a Webby award in 2015, the industry prize for web work. For a side project built on a bash script and a good idea, an award normally reserved for polished agency campaigns was a strong signal that the concept had struck a nerve.

A discussion piece from the start

Part of the early spread came from communities that love exactly this kind of thing. The project was picked up on MetaFilter, where commenters traded observations about which films read most clearly as color and which surprised them. The site was built to provoke that kind of talk, and it did.

Design outlets kept the momentum going. Creative Bloq framed the timelines as a guessing game, inviting readers to identify movies from their palettes alone. That framing captured why the project sticks. It is not only pretty. It is a test of how well a person actually remembers the look of the films they claim to love.

Reading a film as a stripe of color

The most surprising thing about the site is how much a single stripe reveals. Certain films have palettes so strong that they are unmistakable. As The Next Web observed, some titles resolve into signature tones the moment they are abstracted, with icy blues, or green and black, or an all-over wash of a single dominant hue.

Animated films tend to read most cleanly, because their color design is deliberate and consistent from shot to shot. A studio picks a palette for a sequence and commits to it, so the timeline shows crisp blocks of mood. Live-action films are often muddier, since natural light and location shooting introduce more variation, but that muddiness is itself informative.

Once a viewer has scanned a few timelines, patterns start to jump out. Horror leans dark and desaturated. Romances warm up. Science fiction frequently drifts toward cold blues and steely greys. None of this is a rule, and the interesting films are the ones that break the pattern, but the tendencies are visible enough that the site doubles as a crash course in how genre and color relate.

The exceptions are the best part

The strongest reason to browse is to find the films that refuse to behave. A comedy that suddenly plunges into a bruised purple act. A war film that stays improbably golden. A thriller with a single scene so red it dominates the entire column. Those anomalies are where a director's choices become visible as data.

This is the quiet argument the site makes. Color in film is authored, not incidental. When a timeline breaks its own trend, it is usually because someone decided it should, to mark a death, a dream, or a shift in fortune. The Colors of Motion makes those decisions legible to people who would never notice them frame by frame.

From visualization to prints

The project did not stay a screen-only curiosity. According to the About page, popular demand pushed it toward physical objects, and the team began selling prints, first through Etsy and later through a dedicated platform that combines browsing and buying. Each print stacks a film's colors into a poster-sized timeline meant for a wall.

The print is a natural translation of the idea. A movie's color story, printed tall and narrow, becomes an abstract artwork that quietly signals a favorite film to anyone who recognizes the palette. It reads as pure design to a stranger and as a specific memory to a fan, which is a lot of meaning to carry in a strip of colored bands.

That commercial turn also explains why the site is still maintained years later. A project that only cost its maker time might have been left to rot. One that funds itself through prints has a reason to keep adding films, fixing links, and staying online. The shop is what turned a 2014 experiment into an ongoing archive.

The wider tradition of movie color

The Colors of Motion did not invent the idea of squeezing a film into a color image, and it has never pretended to. The technique sits within a small tradition of movie color visualizations that predate it. As the writer Jason Kottke has documented, the moviebarcode format, which compresses each frame or scene into a thin vertical line, was already circulating before Clark's site appeared.

The difference is in the reading. A classic movie barcode packs an entire film into a single wide image meant to be seen all at once, like a bar of static. The Colors of Motion instead runs vertically and invites scrolling, treating the palette as a timeline to travel down rather than a poster to glance at. The same raw idea, arranged for a different kind of attention.

That lineage matters because it shows how a simple concept keeps getting reinvented. Averaging film color is now common enough that open-source tools and command-line scripts can produce a barcode from any video file. What The Colors of Motion added was taste: a clean interface, a curated library, the click-to-frame detail, and the decision to sell the results as art. Execution, not novelty, is why this version is the one people remember.

Why a color timeline still matters

It would be easy to treat the site as a pretty distraction and close the tab. That undersells what it quietly teaches. It trains the eye to notice something that is always present in film and almost never consciously seen. After an afternoon of browsing, a person watches movies slightly differently, half-aware of the palette shifting under every scene.

The site also belongs to a vanishing kind of web. It is small, focused, and made because its creator found the subject interesting, not because a growth team mapped a funnel. It asks for nothing to start exploring, it explains itself instantly, and it rewards curiosity rather than harvesting it. Pages like that are the whole reason the wider Boring Websites network exists, cataloguing single-idea sites that do one thing cleanly and stop there.

There is something fitting about a project whose entire pitch is restraint. The Colors of Motion could have become a bloated film database with reviews, accounts, and recommendations. Instead it stayed a machine for turning movies into color and letting people look. That discipline is why it reads as art rather than product, and why it has outlasted flashier things launched the same year.

An argument for looking slowly

The deeper pleasure of the site is how it slows a viewer down. Cinema normally moves at twenty-four frames a second, far too fast to register color as a shape over time. Flatten it into a still timeline and the pace inverts. Suddenly a person can linger on a transition that lasted a fraction of a second on screen and finally see what it did to the film's mood.

That inversion is the gift. A medium built on motion becomes, for a moment, something to study at rest. The Colors of Motion is one of the few places online where a movie holds still long enough to be read as a single picture, and where the picture turns out to have been telling the story the whole time.

The takeaway

The Colors of Motion is a clean example of the small web doing one thing exceptionally well. It takes a film, discards almost everything, keeps only average color, and discovers that what remains is still full of meaning. The interface is quiet, the concept is instant, and the payoff deepens the more a person looks.

Anyone can open https://thecolorsofmotion.com/, pick a film they know by heart, and see it rearranged into a ribbon of color they have watched a hundred times without ever noticing. It costs nothing, it teaches the eye something real, and it turns two hours of motion into one image worth standing in front of. The films a person picks first are almost always the ones with the strongest looks, which is its own small lesson in what memory keeps. For a project built on a bash script in 2014, that is a remarkably durable reason to still exist.

FAQ

Who created The Colors of Motion?

The project was designed, created, and developed by interaction designer Charlie Clark, according to its own About page. It began as a personal data visualization exploring the use of color in movies before growing into a print shop, and it won a Webby award in 2015.

How does the site turn a movie into colors?

As The Next Web explained at launch, a bash script analyzes a film frame by frame, averages the color of each sampled frame, and the site stacks those averages in chronological order to build the timeline.

Can I see which scene a color came from?

Yes. Clicking any color band on a film's timeline reveals the exact frame it was averaged from, along with that color's hex code, per The Next Web. The abstraction and the source frame stay one tap apart.

Can I buy a print of a film's colors?

Yes. The About page notes that popular demand led the project to sell prints, first on Etsy and later through its own platform. Each print stacks a movie's colors into a tall, poster-sized timeline.