ASCII Image FX is my hackathon entry: an interactive image-to-ASCII playground built with Framer Agents. Upload any image, turn it into ASCII art, customize the characters, colors, size, brightness, and spacing, then bring it to life with animation and mouse-reactive motion.
## Why I built it
I wanted to build something visual, playful, and actually reusable, not just a landing page. ASCII art is simple at first glance, but once you add real image sampling, live controls, color modes, animation, and cursor physics, it becomes a great test for interactive Framer components.
The goal was to create a component that designers can copy into any Framer project and instantly use to make experimental visuals, hero sections, portfolios, posters, music pages, tech landing pages, or interactive backgrounds.
## What's inside
* A reusable Framer Code Component that converts images into ASCII art
* Image upload support
* Built-in test images and visual presets
* Adjustable character sets and custom ASCII shapes
* Size, brightness, and spacing controls
* Source color, black & white, custom color, and duotone modes
* Animated ASCII characters that keep the image recognizable
* Mouse-reactive movement with a physical cursor effect
* A polished demo website with a live playground, preset gallery, and component documentation
The component uses image pixel data to generate the ASCII output, so the effect is real — not a static mockup or fake filter.
Try it: upload an image, change the character set, switch color modes, turn on animation, and move your cursor across the artwork.
Built with Framer Agents.
ASCII Image FX is my hackathon entry: an interactive image-to-ASCII playground built with Framer Agents. Upload any image, turn it into ASCII art, customize the characters, colors, size, brightness, and spacing, then bring it to life with animation and mouse-reactive motion.
## Why I built it
I wanted to build something visual, playful, and actually reusable, not just a landing page. ASCII art is simple at first glance, but once you add real image sampling, live controls, color modes, animation, and cursor physics, it becomes a great test for interactive Framer components.
The goal was to create a component that designers can copy into any Framer project and instantly use to make experimental visuals, hero sections, portfolios, posters, music pages, tech landing pages, or interactive backgrounds.
## What's inside
* A reusable Framer Code Component that converts images into ASCII art
* Image upload support
* Built-in test images and visual presets
* Adjustable character sets and custom ASCII shapes
* Size, brightness, and spacing controls
* Source color, black & white, custom color, and duotone modes
* Animated ASCII characters that keep the image recognizable
* Mouse-reactive movement with a physical cursor effect
* A polished demo website with a live playground, preset gallery, and component documentation
The component uses image pixel data to generate the ASCII output, so the effect is real — not a static mockup or fake filter.
Try it: upload an image, change the character set, switch color modes, turn on animation, and move your cursor across the artwork.
Built with Framer Agents.