This is a submission for the DEV April Fools Challenge
What I Built
CAPTCHA for Robots — Because why should humans have all the verification fun?
We've all been tortured by CAPTCHAs asking us to identify traffic lights, crosswalks, and suspiciously blurry bicycles. So I thought... what if we flipped it? What if the CAPTCHA was designed to keep humans OUT?
Welcome to the world's first Completely Automated Public Test to tell Computers and Humans Apart — but reversed. Only machines can pass. Humans get roasted.
The app throws 5 randomly selected challenges at you from a pool of 8 impossible tasks:
- Computational Speed — Multiply two 6-digit numbers in your head. In 5 seconds. No calculator.
- Binary Literacy — Read binary like it's your mother tongue. Because for robots, it literally is.
- Precision Targeting — Click on an exact pixel coordinate within 3px. Your shaky human hands don't stand a chance.
- Input Velocity — Type 80 random characters (including
@#$%^&*) in 5 seconds. Good luck, meatbag.
- Reaction Speed — Click within 50ms of a color change. Average human reaction time? 250ms. Sad.
- Chromatic Analysis — See a color, type its exact hex code.
#A7C3E2? Looks blue to you? Too bad.
- Number Theory — Identify ALL prime numbers from a grid of 4-digit numbers. In 10 seconds.
- Temporal Awareness — Type the current Unix timestamp. To the second. Right now. Go.
Fail, and you get a snarky diagnosis like: "Have you considered upgrading to a cybernetic implant?"
The "Humans Passed" counter on the landing page? Permanently stuck at 0.
Demo
https://shopsmartai.github.io/captcha-for-robots-app/
Try it. You WILL fail. (And if you somehow pass, we need to have a conversation about whether you're truly human.)
Code
{% github shopsmartai/captcha-for-robots-app %}
How I Built It
Zero dependencies. Zero frameworks. Zero build tools. Just three files doing the heavy lifting:
index.html — Semantic markup with SVG robot mascotstyles.css — Full cyberpunk aesthetic: scanline overlays, CSS grid backgrounds, glitch text animations, neon glow effects, and pulsing buttons. All pure CSS.script.js — 8 challenge generators with Canvas API for pixel grids, Performance API for millisecond-accurate reaction timing, Web Crypto-grade randomization, and a timer system that turns red when you're about to fail (which is always)
The whole thing is ~500 lines of JS with no external calls. It runs entirely client-side. Even the fake "2,847,293 attempts today" counter ticks up in real-time to make it feel like thousands of humans are failing simultaneously alongside you.
Fun details I'm proud of:
- The pixel grid challenge has a nearly invisible crosshair at the target — just visible enough to taunt you
- Challenge order is shuffled each attempt so you can't memorize the sequence
- The robot SVG eyes blink and the antenna glows between cyan and green
- Share button copies a pre-written message of shame to your clipboard
Prize Category
Community Favorite — Because nothing unites the internet like collective humiliation. Every human who tries this will fail, share their score, and challenge their friends to fail too. It's a universal experience: we're all equally inferior to machines. Together.