Layout Components

AI Transparency: Family Standard

Last updated: 6 September 2026

When Amoleo products use AI to generate or assist with content, users deserve to know. This standard defines how we mark and communicate that across the family.

Principle

We disclose AI involvement in content. When a user encounters something an AI created or substantially polished, they should see that clearly — not in alarm, but as transparent information they can act on.

• AI-Generated: The content originates entirely from an AI model. The user asked for something (a character bio, a help article), and the AI wrote it.
• AI-Assisted: A human wrote the base content, then used AI to polish or refine it (grammar, clarity, tone — no new information added).
• Threshold for transition: If a user generates content and then edits it beyond a certain percentage (to be determined per-product based on user intent), it flips from AI-Generated to AI-Assisted.

Visual Identity

The Badge

The badge is a pill-shaped box with a sparkle/wand icon (CSS/SVG, not an image) plus a text label.

✨ AI Generated   |   ✨ AI Assisted

• Shape: Rounded pill (border-radius: 9999px or similar)
• Icon: Sparkles or wand, rendered in CSS/SVG
• Text: "AI Generated" or "AI Assisted"
• Style: Subtle, like a watermark — not bold or alarming

Colors

Colors are theme-aware, drawn from the Amoleo Light/Dark base theme:

• AI Generated: A muted, slightly cooler tone (suggestion: --text-muted with reduced opacity, or a new --ai-generated token)
• AI Assisted: A different muted tone, slightly warmer (suggestion: a new --ai-assisted token)

Both should feel understated. The badge conveys information, not urgency.

In Amoleo Light:

• AI Generated: subtle blue-grey
• AI Assisted: subtle warm grey

In Amoleo Dark:

• AI Generated: adjusted blue-grey (lighter for contrast)
• AI Assisted: adjusted warm grey (lighter for contrast)

Exact values TBD when the first products ship. The principle: consistent across the family, subtle in both themes.

Implementation

The icon should be CSS or inline SVG, not an image file:

• Scales crisply at any size
• Inherits color from its parent
• Works in both light and dark themes without separate files
• Can be animated (optional; a gentle sparkle is nice but not required)

Placement & Visibility

Suggested Placements

(Not enforced — products adapt to their own UX.)

• Pets (Help Articles): Badge appears next to the headline. Readers see immediately: "This was AI-written" (they can still consult a vet, but they know the source).
• Reviews: Badge appears in search results next to the review, visible to non-elevated users. Elevated users (Editors/Admins) can toggle visibility off after they've done due diligence.
• Worldbook: Badge appears beneath character bios (public) or personal entries (private), so readers know if the bio was generated or polished.

Permission-Aware Visibility

The badge is visible to all users by default. However:

• Editors and Admins may have the power to hide the flag on a per-product basis, if they've reviewed the content and can vouch for its quality.
• Search/Filtering: Products can build search filters ("Show only AI-assisted reviews" or "Hide AI-generated content") if the use case warrants it.

This is not about hiding AI use from users — it's about giving trusted editors control over whether the badge appears after they've verified the content.

Use Cases

Pets

Context: Help articles (vet advice, pet care tips) may be AI-generated or AI-assisted.

Implementation:

• Every AI-generated help article shows the badge next to the headline.
• Every AI-assisted article shows the badge (because it was polished with AI).
• Disclaimer text: "This article was AI-generated. Always consult a veterinarian for medical advice."
• Badges are always visible to all users.

Reviews

Context: Users can pay to have their reviews polished (AI-assisted) by rewriting them in their own words.

Implementation:

• Polished reviews show the "AI Assisted" badge in search results.
• Non-elevated users see the badge. Elevated users (Editors/Admins) can hide it after reviewing.
• Advanced search may eventually support filtering ("Show only polished reviews" / "Hide polished reviews").
• Disclaimer text (if shown): "This review was polished with AI assistance."

Worldbook

Context: Both public (curated) and private (personal) Worldbooks may have AI-generated character bios or AI-assisted descriptions.

Implementation:

• Public Worldbook (editors only): AI-generated bios show the badge beneath the character bio. Editors review before publishing.
• Writer's Worldbook (personal): AI-generated entries show the badge. AI-assisted entries (user wrote + polished with AI) also show the badge.
• Disclaimer text: "This biography was AI-generated. You can edit it or write your own."
• Visibility depends on who's viewing — private entries are only visible to the owner unless shared.

The Edit Threshold

Moving a piece of content from AI-Generated to AI-Assisted depends on user edits. The exact threshold will be determined per-product:

• Principle: If the user has substantially rewritten the content (beyond minor tweaks), it's now AI-Assisted, not AI-Generated.
• Examples (not rules):
  • Fixing typos → still AI-Generated
  • Rewriting a paragraph for tone or clarity → AI-Assisted
  • Editing 30%+ of the text → AI-Assisted
• Per-product decision: Each product may define its own threshold based on user intent and content type.

Document the threshold in your product's own CLAUDE.md so reviewers know what to expect.

Implementation Checklist

When adopting this standard in your product:

1. Decide: Will you show AI badges at all? In which components?
2. Decide: What edit threshold flips a piece from AI-Generated to AI-Assisted?
3. Create the pill-shaped badge in your product's own CSS/markup (use the CSS/SVG icon, not an image)
4. Wire in the color tokens (use the Amoleo Light/Dark base tokens or define --ai-generated and --ai-assisted if you need more control)
5. Add your disclaimer text (product-specific, e.g., "consult a vet" for Pets)
6. Decide: Do editors/admins have the power to hide the flag? If so, add that toggle.
7. Document placement and visibility in your product's own CLAUDE.md
8. Test in both light and dark themes
9. Document the edit threshold that flips states

Future Considerations

• Threshold standardization: Once Pets, Reviews, and Worldbook all ship, we may want to standardize the threshold across the family (e.g., "always 30% edits = AI-Assisted"). For now, each product decides.
• No flag for human-only content: Fully human-written content gets no badge — the badge is only for AI involvement.
• Disabled AI-Assisted badge: A future state where content is so thoroughly edited it loses the badge entirely (e.g., "95% rewritten = fully human now") is possible, but requires careful product thinking. Don't implement this without explicit user research.

Generated from docs/family-ai-transparency.md. Edit there and re-run npm run build in docs-site-src/ — never hand-edit a page.