Beautiful AI Attribution
for the Modern Web

Transparent, customizable badges that clearly indicate when content is AI-assisted. Choose from 10+ styles with full dark mode support.

10+ Badge Styles
6 Size Variants
Customizable

Choose Your Style

From minimalist to eye-catching, find the perfect badge for your content

Made with AI

Glass

Elegant transparency effect

Made with AI

Solid

Bold and prominent

Made with AI

Gradient

Modern color transitions

Made with AI

Neon

Eye-catching glow effect

Quick Start

Add beautiful AI attribution badges in seconds

<!-- Include CSS -->
<link rel="stylesheet" href="https://attest.ink/css/badge-variants.css">

<!-- Add Badge -->
<a href="https://attest.ink" class="ai-badge ai-badge-medium ai-badge-glass">
    <svg class="ai-logo" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
        <circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5"/>
        <path d="M8 12C8 9.79086 9.79086 8 12 8C14.2091 8 16 9.79086 16 12C16 14.2091 14.2091 16 12 16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
        <circle cx="12" cy="12" r="2" fill="currentColor"/>
        <path d="M12 6V8M12 16V18M18 12H16M8 12H6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
    </svg>
    <span>Made with AI</span>
</a>
<!-- Simple PNG Badge (no CSS required) -->
<img src="https://attest.ink/badges/ai-glass-medium.png" 
     alt="Made with AI" 
     width="120" 
     height="32">

<!-- Or link it -->
<a href="https://attest.ink">
    <img src="https://attest.ink/badges/ai-glass-medium.png" 
         alt="Made with AI" 
         width="120" 
         height="32">
</a>

Browse PNG Badges →

import { AIBadge } from '@attest-ink/react';

function MyComponent() {
    return (
        <div>
            <h1>My AI-Assisted Article</h1>
            <p>Content here...</p>
            <AIBadge 
                style="glass"
                size="medium"
                platform="claude"
            />
        </div>
    );
}
<template>
    <div>
        <h1>My AI-Assisted Article</h1>
        <p>Content here...</p>
        <AIBadge 
            :style="'glass'"
            :size="'medium'"
            :platform="'gemini'"
        />
    </div>
</template>

<script>
import { AIBadge } from '@attest-ink/vue';

export default {
    components: { AIBadge }
};
</script>
[![Made with AI](https://attest.ink/badge/ai/glass/medium)](https://attest.ink "AI-assisted content")

# Platform-specific badges:
[![Claude AI](https://attest.ink/badge/claude/solid/small)](https://attest.ink)
[![ChatGPT](https://attest.ink/badge/chatgpt/gradient/medium)](https://attest.ink)
[![Gemini](https://attest.ink/badge/gemini/neon/large)](https://attest.ink)

Why Choose attest.ink?

Built for developers, designers, and content creators

10+ Styles

From subtle to bold, find the perfect badge style for your brand

Dark Mode

Beautiful in light and dark themes with automatic detection

Lightweight

No dependencies, pure CSS and SVG for maximum performance

Accessible

WCAG compliant with proper ARIA labels and keyboard support

Start Using AI Badges Today

Join thousands of creators who value transparency in AI-assisted content