TRACE Style Guide v0.1

Transparent Reporting of AI Content & Editing — Implementation guidance for the [TRACE U_] label and metadata.

[TRACE U3] [TRACE U4 +PR] [TRACE U2 +SR]

Overview

Purpose & Scope

TRACE is a neutral, tiered disclosure that makes AI involvement obvious at a glance. This guide specifies how to render the [TRACE U_] badge and where to surface additional metadata so audiences quickly recognize the label across platforms.

Audience: product & design teams, content platforms, CMS vendors, creators & publishers.
Non-negotiable: Always render the label with square brackets, e.g. [TRACE U3].
Neutrality: The label informs; it does not judge quality.

Brand System

Color & Type

DeepBlum
#5C3A5B
Primary badge background

Ink
#221E22
Primary text

Snow
#FAFAFC
Background

Typography

Primary: System UI sans-serif (no external webfonts for GitHub safety).

Monospace: System UI mono for labels & code.

[TRACE U3] — badge uses mono for instant scannability.

Spacing

Base grid: 8pt. Common paddings: 8, 12, 16, 24, 32. Card radius: 10–14px. Badge radius: 8px.

Keep whitespace generous around the badge for recognition.

Badge

Badge Specification

[TRACE U1] [TRACE U2] [TRACE U3] [TRACE U4] [TRACE U5]

Text: always include square brackets, e.g. [TRACE U4].
Typeface: monospace, bold (700), letter-spacing ~0.02em.
Color: background #5C3A5B, text #FFFFFF.
Shape: rounded rectangle (8px radius).
Sizes: small (24px), default (28px), large (34px). Keep consistent per surface.
Suffixes: show compactly: [TRACE U4 +PR +SR].

Do & Don’t

✅ Use square brackets; keep contrast high; place near title/byline/controls.

❌ Don’t remove brackets; don’t bury the badge below the fold; don’t restyle it to look like an ad.

Placement

Where to Place the Badge

Video Platforms (YouTube-like)

Primary: directly under the video title, left-aligned.
Secondary: within the description header or next to channel/byline row.
Controls: optional small duplicate near like/share cluster (for quick reference).

Image/Reel Platforms (Instagram-like)

Primary: inline with the caption metadata line (after username/time).
Alt: end of caption text, visible without “more.”

Writing Platforms (Substack/Medium/LinkedIn)

Primary: in the byline/metadata line near date & reading time.
Footer: repeated near licensing/copyright.

Feeds & Cards

Primary: in the card metadata strip (below title or next to domain).
Accessibility: include badge text in the accessible name.

“What’s this?” link: adjacent to the badge should open a lightweight panel or tooltip summarizing level & suffixes, with a link to full metadata.

Metadata

Surfacing Additional Metadata

Compact Summary Panel

Trigger: “What’s this?” link next to the badge. Include:

Level: U0–U5 label name (e.g., “U4 — Generative (Human-reviewed)”).
Modality: text | image | audio | video | multimodal.
Human Review: yes/no; optional authorship.
Suffixes: +PR (Prompt Revealed), +CR (Content Credentials), +SR (Safety Review).
Date: ISO date (YYYY-MM-DD).

Full Details (Drawer / Modal)

Expose the JSON fields for transparency, optionally pretty-formatted:

{
  "trace": {
    "version": "0.1",
    "level": "U4",
    "modality": "video",
    "human": { "review": true, "authors": ["Channel Team"] },
    "date": "2025-09-12",
    "ai": { "role": "generative", "method": "iterative", "models": ["disclosed"] },
    "safety": ["copyright"],
    "ext": {
      "prompt": { "disclosure": "summary", "summary": "AI drafted script; human edited VO and pacing." },
      "provenance": { "type": "none" }
    }
  }
}

Developer Integration Hints

Meta tag

<meta name="trace" content="[TRACE U4 +PR]">

Data attribute

<article data-trace='{"version":"0.1","level":"U4","modality":"video","human":{"review":true}}'></article>

JSON-LD (optional)

<script type="application/ld+json">
{
  "@context":"https://trace.spec/0.1",
  "@type":"CreativeWork",
  "trace": { "version":"0.1","level":"U4","modality":"video","human":{"review":true} }
}
</script>

Accessibility

Accessibility & Localization

Contrast: maintain WCAG AA contrast between badge background and text.
Screen readers: include badge text in accessible names (e.g., aria-label="[TRACE U4]").
Keyboard: “What’s this?” must be focusable and dismissible via keyboard.
Localization: keep the core token [TRACE U_] intact; localize the accompanying description text.

Examples

UI Placement Examples (Wireframe)

Video Title

Bigfoot Vlog — Low Light Forest Hunt

[TRACE U4 +PR] What’s this?

1.2M views • 2 days ago

Description

Join us deep in the mountains…

Compliance

Do / Don’t for Platforms

Place [TRACE U_] near the title/byline or control cluster.
Provide a one-click “What’s this?” summary and a link to full details.
Respect the square brackets and the U-level format.
Cache and expose JSON metadata via API for downstream consumers.

Don’t hide the badge behind multiple clicks or below the fold.
Don’t restyle the token (e.g., remove brackets) or change its wording.
Don’t blend it into ads or sponsored UI; it must read as provenance/label.
Don’t require creators to disclose secrets/PII; summaries are acceptable.