# Leaf Pixels > Source: > Published: 2026-10-10 22:42:09+00:00 *This is a submission for the [Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass](https://dev.to/challenges/hacktoberfest-week1-2026-10-05)* ## What I Built **Leaf Pixels** turns any picture into a printable **colour-by-letter pixel-art sheet** that kids take **outside** and colour in. 1. Pick a picture: a fox, an owl, a pumpkin, a rocket… (or type your own). 2. Choose a paper size (A5, A4, A3 or Letter) and print it. 3. Grab some crayons or pencils and head outside: the park, the garden, a picnic blanket, the front steps. Colour each square to match its letter until the picture appears. The sheet is a 24×24 grid with Battleship-style coordinates (A1, B7…), a letter in every square (R for red, O for orange, and so on) and a colour key. Page 2 has a fun fact about the subject ("Owls can turn their heads almost all the way around!") and a space to draw or stick a photo of where you coloured it. It's made for **kids, parents and teachers** who want a screen-free activity. Pixel art is calm and satisfying, and it quietly practises colour matching, counting and grid coordinates. The name comes from the autumn palette: every pattern uses the colours of October leaves. The screen part takes about a minute; the colouring happens offline, outdoors. ## Demo ## Code # Leaf Pixels 🍁 Pixel art you build **outside**, one leaf at a time. Pick a picture (a fox, an owl, a pumpkin…), print the pattern, then go outside, collect fallen leaves and lay them on the ground, one leaf per square, until the picture appears. The screen part takes a minute; the rest happens outdoors. Built for the [Hacktoberfest Open-Source AI Challenge, Week 1: Touch Grass](https://dev.to/challenges/hacktoberfest-week1-2026-10-05). ## How it works 1. **gpt-oss-120b** (open-weight, Apache 2.0), served by[Groq](https://groq.com) , checks that the subject is kid-friendly and drawable, writes an image prompt, and comes up with a fun fact. 2. **FLUX.1 [schnell]** (open-weight, Apache 2.0), served by[Cloudflare Workers AI](https://developers.cloudflare.com/workers-ai/) , draws a simple flat icon. 3. The server turns the drawing into a 24×24 grid in a fixed autumn palette (red, orange, yellow, green, brown, black). Each square gets the colour most of its pixels have, thin parts like stems and legs… ## How I Built It Leaf Pixels is a Next.js app with two open-weight models at its core: | Step | Model | Licence | Where it runs | | Check the subject, write the drawing prompt, write a fun fact | **gpt-oss-120b** | Apache 2.0 | Groq | | Draw the picture | **FLUX.1 [schnell]** | Apache 2.0 | Cloudflare Workers AI | **The pipeline:** 1. **gpt-oss-120b** decides whether the subject is kid-friendly and drawable. "Fox" is fine, but "my tax return" gets a friendly*"Try a happy animal or a yummy fruit!"* . It then writes a strict prompt for a flat icon in autumn colours, plus a one-line fun fact for a 6-year-old. 2. **FLUX.1 [schnell]** draws the icon in about 2–4 seconds. 3. My own code turns the drawing into a 24×24 grid using a six-colour autumn palette (red, orange, yellow, green, brown and black), so you only need a small box of crayons. 4. The browser builds a two-page printable PDF with **jsPDF** . The hardest part was step 3. A naive downscale gave messy results, so it went through a few rounds: - **Colour fringes:** averaging pixels made a yellow halo around every shape. I switched to a*vote* : each square takes the colour most of its pixels have. - **Wrong colours:** matching pixels to the nearest palette colour turned a red sail orange and grey edges green. Classifying by**hue** fixed it, since the soft edge of a red shape is still red. - **Vanishing details:** a thin mast or a bird's legs covered too little of a square to win the vote, so they disappeared. A morphological opening finds parts thinner than half a square and thickens them before voting. - **Clean-up:** a bounding-box crop centres the subject even when the drawing has a faint drop shadow, and a connected-components pass removes stray specks. There are no accounts and no database, and nothing is stored. A small rate limit keeps the free tiers alive. ## Why Does Open Innovation Matter? **I changed models twice in one week, and each change took one line.** - I first planned to run FLUX on Hugging Face. When I checked, the free tier there had changed. Because the **weights are open** , I moved the same model to Cloudflare Workers AI, which has a free daily allowance. With a closed model, I'd have been stuck with one vendor's pricing. - The Llama model I'd planned to use on Groq was no longer available. I swapped in **gpt-oss-120b** by changing a single model name. The text step uses the OpenAI-compatible API format, so`GROQ_BASE_URL` and`GROQ_MODEL` can point at**any host of an open model** : Ollama on your own laptop, vLLM on a school server, or OpenRouter. That flexibility matters for this audience: - **Kids' data:** a school or library could self-host both models and keep everything on their own hardware, with no third party involved. - **Cost:** both models are Apache 2.0, and both run on free tiers. Making a pattern costs nothing, which is the point for a free family activity. - **Control:** the models' behaviour lives in my own prompt and my own code. Nothing changes under me when a vendor updates a closed model.