Installation

A drop-in AI-proof CAPTCHA widget for React. Works like reCAPTCHA v2 — no signup, no API key, no backend required. Serves faces hidden in AI-generated images.

No signupNo API keyWorks cross-originInline CSS, zero deps

Live demo

Click the widget below to try it — this is the real thing, pulling live challenges from our database.

I'm not a robot
latchaPrivacy - Terms

Getting started

1. Install

npm install @latcha/react
# or
pnpm add @latcha/react

2. Add to your form

import { LatchaWidget } from "@latcha/react";

function ContactForm() {
  const [verified, setVerified] = useState(false);

  return (
    <form>
      <input name="email" type="email" placeholder="Email" />
      <textarea name="message" placeholder="Message" />

      {/* CAPTCHA — works exactly like reCAPTCHA v2 */}
      <LatchaWidget
        onVerify={(token) => {
          setVerified(true);
          // Optionally pass token to your backend for server-side re-verification
        }}
        onError={(err) => console.error("CAPTCHA error", err)}
      />

      <button type="submit" disabled={!verified}>
        Send
      </button>
    </form>
  );
}

Props

PropTypeDefaultDescription
onVerify(token: string) => void—Called on success. token is a short-lived challenge ID.
onError(err: Error) => void—Called if the network request or API fails.
apiBasestring"https://latcha.dev/api/latcha"Override to self-host the API.
theme"light" | "dark""light"Widget color scheme.

How it works

1
Fetch
On click, the widget requests a random 3×3 grid of AI-generated images from our servers. Human faces are hidden inside 2–5 of the cells.
2
Challenge
The user selects all cells containing a face. ±1 error is allowed — AIs fail because the faces blend into the scene.
3
Verify
The answer is checked server-side. On success, onVerify is called with a token. No data is collected.
View on npm