Boring Websites The Blog

Drawing Garden: the website where your mouse plants emoji

05 Sep 2026 · By the Boring Websites editors

Drawing Garden is a single web page that turns aimless mouse movement into a spreading garden of emoji: drag the cursor and flowers, weeds, and small creatures bloom in its wake, each one sounding a soft note. It is worth a look because it does one gentle thing well, asks nothing of the visitor, and turns a few idle seconds into what looks and sounds like a tiny meadow planting itself.

In brief

  • Moving or clicking the mouse across the page fills a grid with random emoji plants and creatures, and every fresh emoji plays a note as it lands.
  • The notes come from just four pitches, C, D, E and G, so any sequence stays consonant however fast or slow the cursor travels.
  • It was made by the Minneapolis media artist Ben Moren, with a copyright date of April 2020, using the creative-coding library p5.js and its sound add-on.
  • There is no account, no goal, and no save button. The page is one screen that answers the mouse and then forgets everything on reload.

What Drawing Garden actually is

Open drawing.garden and the screen greets the visitor with a single instruction spelled out in wobbling letters: click for sound. After that first click, the page becomes a grid that fills the whole browser window, and the real behaviour begins. Move the mouse and each cell the cursor touches sprouts a random emoji, a flower here, a beetle there, while a short note plays in time with it.

The site describes itself with disarming modesty. Its own page summary calls it "gardening, but with emojis and less time," a line written by its creator, Ben Moren. That is an accurate pitch. Drawing Garden is not a game and not quite a musical instrument. It is a toy, tuned so that whatever a visitor does with the mouse comes out looking planted on purpose and sounding vaguely tuneful.

There is nothing to read, nothing to configure, and nothing to win. The cursor is the only tool, the grid is the only canvas, and the whole loop, from movement to emoji to note, closes in a fraction of a second. Both hovering the cursor over a cell and clicking it do the same job, so a mouse, a trackpad, or a finger tapping a touchscreen all plant the same garden. A newcomer does not learn Drawing Garden so much as wander into it.

What a few minutes with it feels like

Spend a little time in Drawing Garden and a rhythm sets in. The first pass is usually greedy, a fast scribble across the whole grid to see every emoji and hear the notes pile up at once. The second is slower. Most visitors find a corner, plant a few deliberate rows, and start listening to the sequence rather than just watching the screen fill.

From there it turns oddly calming. Because nothing can be done wrong, there is nothing to fail at and nothing to finish, which strips out the low background pressure that most interactive things carry. A person is left with a responsive little plot that reacts at once and judges nothing. That is a rare setting online, and it is much of why the page tends to stay open longer than intended.

The four-note trick behind the calm

The reason Drawing Garden never sounds wrong is a small, deliberate constraint. Its source code, published by Moren on GitHub, defines the melody as an array of just four notes: C, D, E and G. Every emoji that appears plays one of those four at random, and because the four sit comfortably together, no combination clashes.

Those pitches are a slice of the C major pentatonic scale, the same five-note pattern that makes the black keys of a piano forgiving to a beginner. The code even keeps a fifth note, A, sitting commented out one line below, a quiet hint that the full pentatonic was considered and then trimmed. Four notes, it turns out, are enough.

The effect is that speed becomes expression rather than error. Sweep the mouse quickly and the notes tumble out in a bright little run. Inch it along and they arrive one at a time, spaced like stepping stones. Commenters on Hacker News noticed the same thing, remarking that the pieces sound harmonious in almost any order.

Why it asks for a click first

That opening "click for sound" prompt is not decoration. Modern browsers refuse to play audio until the visitor has interacted with the page at least once, a rule meant to stop sites from blaring noise the instant they load. Drawing Garden works with that limit instead of against it, spelling out the requirement in its intro screen, a detail visible right there in the source.

Under the surface, the sound runs on p5.js, a JavaScript library for creative coding, together with its p5.sound companion. p5.sound is a wrapper around the browser's own Web Audio API, the standard system for generating and shaping sound inside a web page. That combination is why the whole thing runs in a plain tab, with no plugin and no download.

What grows in the garden

The planting set is larger than a first glance suggests. The code lists twenty plant and nature emoji, among them a cactus, a seedling, a sheaf of grain, tulips, roses, sunflowers, a four-leaf clover, and stray edibles like a carrot, a tomato, and a strawberry. Alongside them sits a second list of fourteen creatures: bees, ladybirds, a snail, an ant, a spider, a snake, a lizard, a rabbit, a butterfly, a hedgehog, and a dove.

Mixing the two lists is what gives the garden its character. A patch of tidy flowers will suddenly host a wandering caterpillar, and a run of leaves might end on a rat. Nothing is placed; everything is chance. The result reads less like a designed picture and more like a real overgrown corner, where the weeds and the wildlife turn up uninvited.

One further touch rewards anyone who glances at the browser tab. The favicon updates on the fly to show whichever emoji was placed most recently, a trick built with the well-known method of using an emoji as a favicon, documented by CSS-Tricks. The little tab icon quietly becomes part of the garden too.

Who made Drawing Garden

Drawing Garden is the work of Ben Moren, a media artist based in Minneapolis who also teaches media arts at the Minneapolis College of Art and Design. His larger practice runs well beyond browser toys: it spans filmmaking, performance, sculpture, sound, and custom software, and it circles repeatedly around human perception and the relationship between people and the natural world.

Seen against that background, Drawing Garden looks less like a throwaway and more like the same preoccupation shrunk to fit a web page. A person makes a small, careless gesture, and a scrap of nature answers. Moren's portfolio lists gallery and festival work for institutions and events across several countries, which makes the free little garden feel like a generous aside.

The choice of tool is not a coincidence either. Moren is an active member of the p5.js community and has published his own additions to it, including a library for passing messages between separate sketches and a toolbar that speeds up local development. Reaching for p5.js to build Drawing Garden was less a technical decision than writing in a native tongue.

A small artwork you can read

Because the source is public, Drawing Garden doubles as a teaching piece. The GitHub repository carries a plain copyright line, "Ben Moren April 2020," and a note that the project has no open-source licence: the rights are retained, and the code is shared so that students and curious readers can learn from its structure. It is source available, not open source, and Moren draws that line clearly.

What is striking, reading it, is how little there is. The behaviour that produces the whole experience, the grid, the random emoji, the four notes, fits inside a short sketch file. There is no framework scaffolding and no build step to wade through. The gap between viewing the source and understanding the entire thing is unusually small, which is much of its value to a beginner.

Why people keep rediscovering it

Drawing Garden has a habit of resurfacing. It reached the front page of Hacker News in January 2024, gathering more than five hundred points and a long comment thread, roughly four years after its 2020 copyright date. It surfaced there again, more quietly, in October 2025. A toy that strangers keep posting, years apart and unprompted, is clearly doing something durable.

The pull is familiar to anyone who has lost a minute to a similar page. A single, immediate cause and effect, repeated with small variations, is quietly satisfying in a way that needs no explanation and no reward. Drawing Garden simply supplies that loop in a pleasant form and then stays out of the way.

The durable thing is restraint. There is no feed to scroll, no streak to keep, and no reason to return beyond wanting to. It belongs with the other unhurried corners of the same small network, such as Today's Rock, which share a plain conviction: that a website can be a brief, self-contained pleasure and nothing more. It also keeps company with Patatap, a sister toy that does the same trick with a keyboard instead of a mouse. Drawing Garden gives a visitor a minute of quiet play and then lets them leave, taking nothing.

How to get the most out of it

Getting the most from Drawing Garden costs no effort, but a couple of habits help. Sound is half the point, so headphones or a decent speaker do more for it than a large screen does. It also rewards a change of pace: drag the cursor slowly to pick out a hesitant little tune, then sweep it in loops to flood the grid with colour and a cascade of notes.

Beyond that, the only advice is to stop steering. Trace a word and listen to the rhythm the letters make, then let both instincts go and move the mouse at random. A reload wipes the grid clean and starts an empty plot, so there is never a mess to tidy, only another garden waiting to be planted over the last one.

FAQ

Is Drawing Garden free to use?

Yes. The website at drawing.garden is free and needs no account or sign-up. The only thing a visitor has to do before anything happens is click once, which lets the browser start playing sound.

Why does everything it plays sound nice together?

Because the palette is tiny. According to the project's source code, every emoji triggers one of just four notes, C, D, E and G, which are drawn from the consonant C major pentatonic scale. With so few closely related pitches, random sequences stay harmonious.

Who created Drawing Garden?

It was made by Ben Moren, a Minneapolis media artist and professor at the Minneapolis College of Art and Design. His repository dates the project to April 2020 and credits the site to p5.js, the creative-coding library he builds with.

Do I need to click before I hear anything?

Yes. The page opens with a "click for sound" prompt because browsers block audio until a visitor interacts with the page. After the first click, moving the mouse plays a note with every emoji it plants.