AI/UX PLAYGROUND
Newsletter
ChatGPT logo

ChatGPT citations UX: inline chips, popovers & sources

Updated July 10, 2026

On time-sensitive questions, ChatGPT treats citations as part of the reading flow, not a footnote dump. Publisher chips sit on the claims they support, a hover/click popover shows the article behind each chip, and a Sources row opens a full audit list without leaving the thread.

Publisher chips on the claims

Favicon + truncated publisher name pills (Investor’s Business Daily, Reuters, AP News) sit inline after market claims; +1 marks multi-source support.
Favicon + truncated publisher name pills (Investor’s Business Daily, Reuters, AP News) sit inline after market claims; +1 marks multi-source support.

What works

  • Chips use publisher identity first (favicon plus name) so readers recognize Reuters vs AP before opening anything.
  • +N on the chip signals more than one source for that claim without stacking multiple pills.
  • Placement is claim-adjacent (end of bullet or sentence), so skeptical readers can verify while scanning.

What we would push on

  • Long publisher names truncate hard (“Investor’s B…”); a tooltip with the full name would help first-time scanners.

Takeaway

Put publisher-first chips on the claim, not a numbered footnote at the bottom of the answer.

Pattern: Citations

Popover preview before you leave chat

Hover/click on a chip opens a card with publisher, article headline, and a short snippet, still inside the thread.
Hover/click on a chip opens a card with publisher, article headline, and a short snippet, still inside the thread.

What works

  • The card shows enough to judge relevance: publisher, full headline, and a dated snippet.
  • Users can verify a claim without opening a new tab for every chip.
  • The popover stays anchored to the chip, so the claim and its evidence stay visually linked.

What we would push on

  • Snippet length is short; dense financial answers may need a clearer “Open article” affordance on the card itself.

Takeaway

Give claim-level previews in-product so verification is one interaction, not ten new tabs.

Pattern: Citations

Pattern: Citation Tooltips

Navigate every source behind +N

Popover header shows 2/2 with back/forward arrows. MarketWatch is the second source for the same claim.
Popover header shows 2/2 with back/forward arrows. MarketWatch is the second source for the same claim.

What works

  • 1/N pagination makes the +N badge actionable: users can step through every supporting source.
  • Each step swaps publisher, headline, and snippet without closing the popover or losing place in the answer.
  • Arrows teach that one chip can represent a small evidence set, not a single link.

What we would push on

  • No visible list of all N titles at once. Auditors who want a side-by-side comparison still need the Sources sidebar.

Takeaway

If a chip aggregates sources, let users page through each one in the same preview surface.

Pattern: Citations

Pattern: Citation Tooltips

Sources row opens a full audit list

Favicon stack + Sources under the reply opens a right-hand panel with publisher cards, headlines, dates, and snippets.
Favicon stack + Sources under the reply opens a right-hand panel with publisher cards, headlines, dates, and snippets.

What works

  • A persistent Sources entry under the message invites audit without hunting for a separate tab.
  • The sidebar lists every source as a card (logo, title, relative time, snippet) while the answer stays visible.
  • Depth matches intent: chips for skimmers, popover for claim checks, sidebar for full review.

What we would push on

  • Sidebar does not highlight which card maps to the chip you just opened. Cross-highlighting would tighten the claim↔source loop.

Takeaway

Pair inline chips with a one-click Sources panel so light and heavy verification share the same answer.

Pattern: Source Browser

Pattern: Citations

Steal this

  • Publisher favicon + name chips inline on claims
  • +N on chips with 1/N navigation inside the popover
  • Claim-anchored popover with headline and snippet
  • Sources row under the reply that opens a full sidebar audit

Skip this

  • Footnote-only links at the bottom of long answers
  • Citation markers with no publisher identity visible
  • Forcing a new tab for every source check
  • Aggregating sources behind +N with no way to inspect each one

How others trust, privacy & settings

Same job, different product bets, and what each tradeoff reveals.

Perplexity

Perplexity leads with domain +N chips, research steps, Links tab, and Wrong sources feedback, citation-native by default.

Read teardown
ChatGPT

Output teardown covers refinement, versions, and writing blocks; citations appear when the answer is web-grounded.

Read teardown

Original gallery pages: Citations & Sources