Building a Pixel Art Converter: From DOOM to Modern Portraits
Last updated: 31.05.2026
Building a Pixel Art Converter: From DOOM to Modern Portraits
Audio Narration
The project began as a simple DOOM-inspired image converter, evolving into a comprehensive pixel art transformation tool. Initially inspired by DOOM's iconic color palette, the tool recreates the retro look using a 32-color palette with Euclidean distance color matching. As it developed, the tool expanded beyond DOOM aesthetics to include a Portrait palette optimized for human faces, making it suitable for profile pictures and avatars. Key features of the tool include seven color palettes: DOOM, Portrait, Skin Tones, Game Boy, PICO-8, Commodore 64, and Grayscale. It also offers Floyd-Steinberg dithering for smooth gradients, adjustable pixel scaling for a retro look, and PNG export with timestamped filenames. Built with Next.js and the Canvas API, the tool processes images through background removal, pixelation, and color reduction or palette mapping. AI-assisted development played a significant role in the project's rapid iteration and refinement, showcasing how modern tools can accelerate prototyping. The result is a practical tool that blends retro gaming aesthetics with modern web development, available for use at /image-converter.
What started with that I was to laisy, to ask my friend for the origina file of the 8bit pixle art portrate of me. turned into a simple DOOM-inspired image converter. The project has evolved into a full-featured pixel art transformation tool. This project showcases how AI-assisted development can rapidly iterate on ideas, turning a nostalgic concept into a practical creative tool.
From DOOM to Portraits
The initial inspiration came from DOOM's iconic color palette - those distinctive reds, browns, and grays from the original PLAYPAL. I wanted to recreate that authentic retro look, so I implemented the true 32-color DOOM palette with nearest-color matching using Euclidean distance in RGB space.
But as the project grew, I realized the tool could do more than just DOOM aesthetics. I added a Portrait palette specifically optimized for human faces, with graduated skin tones, hair colors, and grayscale accents. This made the converter practical for profile pictures and avatars, not just retro gaming tributes.
Key Features
The final tool includes:
- Seven Color Palettes
- DOOM (32 colors), Portrait (28 colors for faces), Skin Tones (20 realistic human tones), Game Boy, PICO-8, Commodore 64, and Grayscale
- Floyd-Steinberg Dithering
- Error diffusion algorithm for smooth gradients
- Pixel Scaling
- Adjustable pixelation from 1-16px for that chunky retro look
- PNG Export
- Download your pixel art with timestamped filenames
Technical Implementation
Built with Next.js and the Canvas API, the converter uses a processing pipeline that applies effects in sequence: background removal → pixelation → color reduction or palette mapping. The Floyd-Steinberg dithering implementation distributes quantization error across four neighboring pixels (7/16 right, 3/16 bottom-left, 5/16 bottom, 1/16 bottom-right) for smooth gradients even with limited color palettes.
The interface includes a loading spinner during processing, since dithering can be computationally intensive. A responsive layout ensures the tool works on both desktop and mobile devices.
AI-Assisted Development
This project was built collaboratively with AI assistance, demonstrating how modern development tools can accelerate prototyping and iteration. From implementing authentic DOOM colors to optimizing portrait rendering, each feature evolved through rapid experimentation and refinement.
The result is a fun, practical tool that bridges retro gaming aesthetics with modern web development. Try it out at /image-converter and transform your photos into pixel art!
The idea that inspired it all, this was created by fedon
Original image
Image after convertion
1 / 3
6 Claude Power Prompts That Change How You Build
Most people use Claude as a smarter search engine, but it can be a disciplined collaborator if you structure your prompts. The article outlines six patterns to unlock this mode. First, launch subagents to split work: one checks brand tone, another reviews code, a third drafts copy, each operating independently to avoid context bleed. Second, write a spec before coding, clarifying purpose, scope, and key decisions while changes are still cheap. Third, have Claude interview you first to surface hidden assumptions, co-create a spec, and get approval before implementation. Fourth, define how success will be verified upfront, then actually run that check afterward, especially for sensitive systems like payments or auth. Fifth, convert productive sessions into a reusable SKILL.md, including gotchas so lessons persist beyond the chat. Sixth, once a workflow is proven through manual runs, automate it via scripts, cron jobs, or CI. All six follow a meta-pattern: plan → build → verify → learn → automate, shifting you from just prompting Claude to designing how it works with you.
Read post
How I Used My Own Blog to Research My Presentation About It
The author needed a fast way to collect 14 blog posts for a presentation without manually copy-pasting from the browser. Fortunately, the blog already exposed each post as clean markdown at /md/posts/[slug], originally built for AI tools. This endpoint strips away HTML, navigation, and cookie banners, returning only the core content, which the author then fed into Claude for rapid reading and summarisation. Before working with individual posts, the author used /llms.txt, a structured, machine-readable index of the site similar to robots.txt but designed for AI discovery. Claude used this index to understand the site’s structure and locate relevant posts. For the presentation itself, the author used Slidev, a markdown-based slide tool, allowing Claude to generate and refine slides directly in markdown. The experience highlighted a “meta” benefit: infrastructure built for AI and other developers ended up being most useful to the author, demonstrating that investing in AI-friendly content formats can pay off immediately for the site owner.
Read post