---
title: Conversational Sources
position: 999
seo_title: Conversational Sources UI Building Block | Progress Telerik
seo_description: "Utilize Conversational Sources to directly link references
  within AI-driven dialogues. Enhance accuracy and build user trust."
---
## Overview

Conversational Sources are a key interface element displayed alongside AI responses, offering direct references to the data or insights the system used. By showing links or quotes in a card-like format, Conversational Sources help users verify information, explore further context, and understand how the AI formulates a specific response.

A well-implemented Conversational Sources section fulfills several purposes at once: it enhances transparency, fosters user trust, and encourages deeper interaction with the referenced material. By making source details easy to navigate, Conversational Sources ensure that users can quickly validate AI outputs and gain confidence in the accuracy of the information provided.

### Key Principles

* Consistency—the referenced text within the Conversational Sources cards must be presented equally.
* Redirection—source cards must include links as proof of the partnership.

### Conversational Sources Variants

The Telerik and Kendo UI Conversational Sources offer design variants showcased in our demos, each tailored to enhance your application development by covering different usage scenarios.

#### Conversational Sources 1

<LiveDemoV2 data='{"demoName":"conversational-sources-1","previewImage":"images/conversational-sources-1.png","width":"510px","height":"182px","scale":0.7}'>![demo preview image](images/conversational-sources-1.png)</LiveDemoV2>

#### Conversational Sources 2

<LiveDemoV2 data='{"demoName":"conversational-sources-2","previewImage":"images/conversational-sources-2.png","width":"510px","height":"160px","scale":0.7}'>![demo preview image](images/conversational-sources-2.png)</LiveDemoV2>

### UI Components Documentation

For product-specific information, refer to the corresponding Telerik and Kendo UI documentation:

<Wrap>
<ExternalResource data='{"title":"Kendo UI for Angular Product Homepage","description":"Discover the Kendo UI for Angular components.","url":"https://www.telerik.com/kendo-angular-ui/components/"}'>![Kendo UI for Angular logo.](/images/angular-logo.svg)</ExternalResource>

<ExternalResource data='{"title":"Telerik UI for Blazor Product Homepage","description":"Discover the Telerik UI for Blazor components.","url":"https://docs.telerik.com/blazor-ui/introduction"}'>![Telerik UI for Blazor logo.](/images/blazor-logo.svg)</ExternalResource>

<ExternalResource data='{"title":"KendoReact Product Homepage","description":"Discover the KendoReact UI components.","url":"https://www.telerik.com/kendo-react-ui/components/introduction/"}'>![Kendo UI for React logo.](/images/react-logo.svg)</ExternalResource>

</Wrap>