Article 50 Kit

EU AI Act · Article 50 · enforceable 2 August 2026

Transparency, built into the interface.

Four accessible React components for the parts of the EU AI Act that live in the UI — AI disclosure, content labelling, emotion-recognition notice, and a human-in-the-loop review gate. WCAG 2.1 AA. MIT licensed.

Explore the patterns View on GitHub

Article 50 compliance is not a legal document — it is buttons, labels, notices, and review steps a person actually sees. These are the interface patterns, built to the accessibility standard the law itself points to, ready to drop into a React or Astro product.

The patterns

Four components
  1. 01

    AI Disclosure Badge

    Article 50(1)

    Tell people they are interacting with an AI system — clearly and distinguishably.
  2. 02

    AI Content Label

    Article 50(4)

    Mark generated or manipulated content — including deepfakes — for people and machines.
  3. 03

    Emotion Recognition Notice

    Article 50(3)

    Inform people exposed to emotion-recognition or biometric-categorisation systems.
  4. 04

    Human Review Gate

    The accountable layer

    Hold an AI-proposed action until a named human approves, edits, or rejects it.

Get started

# clone and run
git clone https://github.com/sotosili/article50-kit
cd article50-kit
npm install
npm run dev

# or copy a single component from src/components/kit/

Built with Astro, React, and Tailwind — the same stack the components target. Each component is a single self-contained file under src/components/kit/, so you can copy one in or use the set.

These are engineering patterns, not legal advice. They help you meet Article 50 duties in the interface; confirm your specific obligations with qualified counsel.