References

References are the external materials an AI system retrieves and uses to shape its output. They act as a bridge between the model’s static training data and the user’s live context, grounding responses in information that is visible and verifiable. This pattern heavily relies on Retrieval-augmented generation (RAG) which combines foundational knowledge with external data instead of relying only on a model’s frozen training set and context window.

Pairing truncated or synthesized summaries with the source references helps users identify where information came from, decide whether to trust it, and refine the scope of what the AI is considering. Without visible references, the experience becomes a black box that can’t be validated or corrected. With references, users gain leverage: they can connect private sources, filter by type or recency, and click through to confirm or expand results.

Common variations

The actual reference pattern is codified and simple: a link with some meta information about the source is located relative to the generated content or conversation.

• Panel: References may be grouped together in a panel, often placed to the right of the content for easy retrieval. This makes references easy to scan. In this layout, it is common to see additional metadata about each source. You'll commonly find this in search contexts where reaching relevant external information is one of the user's goals.
• Hidden aside: Referenced sources may also be grouped together in a tab or drawer. This makes them easy to review and navigate to, but diminishes their prominence in the interface. Perplexity and Notion have both taken this approach in the search context, where the focus centered on the summary. Citations within the summary provide links to the referenced material.
• Nested: Where the AI interaction is contained in a smaller surface like a conversation, information shared in those contexts often needs to be truncated to fit the constraint of the container. Resources are still grouped at the top or bottom of the content block (distinguishing this layout from citations placed inline to the text) and easily retrievable, but the metadata included is limited to favicons and file or site names. Additional information might be available on hover.

When designing References, consider how much metadata needs to be shown up front to support your use case and the user's intent, whether the reference needs to be visible, and whether interactive disclosure such as on hover or tap is appropriate in the context.