> For the complete documentation index, see [llms.txt](https://docs.avonnicomponents.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.avonnicomponents.com/dynamic-components/welcome.md).

# Welcome

Build custom Salesforce UIs without code: compose a component from your data, your layout and what happens on click, then place it on any App, Record or Home page.

<button type="button" class="button primary" data-action="ask" data-icon="gitbook-assistant">What do you want to build?</button>

<a href="https://appexchange.salesforce.com/appxListingDetail?listingId=2e584bb3-b5e0-415d-9347-d6567158d840&#x26;channel=recommended" class="button primary" data-icon="up-right-from-square">Install the Components</a> <a href="/dynamic-components/getting-started/quickstart-guide.md" class="button secondary" data-icon="stars">Quickstart</a> <a href="/dynamic-components/build-with-ai/overview.md" class="button secondary" data-icon="wand-magic-sparkles">Build with AI</a>

<figure><img src="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FX4XnlJMsaVZBF8sfTThL%2Fwelcome-component-builder.png?alt=media" alt="The Avonni Component Builder: the component palette on the left, and on the canvas a list of related opportunities with amounts and stage badges."><figcaption><p>The Component Builder: the palette on the left, the component you are composing on the canvas.</p></figcaption></figure>

***

<h3 align="center">Start here</h3>

<p align="center">Three pages, in order, and you have a component on a page.</p>

<table data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><h4><i class="fa-compass">:compass:</i></h4></td><td><h4>Product Tour</h4></td><td>What Dynamic Components are, what the Builder does, and what ends up on the page.</td><td><a href="/dynamic-components/getting-started/product-tour.md">Product Tour</a></td></tr><tr><td><h4><i class="fa-rocket">:rocket:</i></h4></td><td><h4>Quickstart Guide</h4></td><td>Build your first component and put it on a record page, start to finish.</td><td><a href="/dynamic-components/getting-started/quickstart-guide.md">Quickstart Guide</a></td></tr><tr><td><h4><i class="fa-pager">:pager:</i></h4></td><td><h4>Component Builder</h4></td><td>The canvas, the component tree, the property panels, and how a component is saved.</td><td><a href="/dynamic-components/core-concepts/component-builder-overview.md">Component Builder Overview</a></td></tr></tbody></table>

***

<h3 align="center">What you can build</h3>

<p align="center">Every component is configured the same way: pick the data, arrange the layout, decide what happens on click.</p>

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-cover data-type="image">Cover image</th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><h4>Kanban</h4></td><td>Drag a card to change the record behind it, with swimlanes, column totals, and the fields you choose on each card.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FlTPozVY24Zg6b2zwWzca%2Fwelcome-kanban.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FlTPozVY24Zg6b2zwWzca%2Fwelcome-kanban.png?alt=media</a></td><td><a href="/dynamic-components/components/kanban.md">Kanban</a></td></tr><tr><td><h4>Data Table</h4></td><td>Group rows, sort, filter, edit inline, and show files or images inside a cell.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FEeSukv9m1rPWm32v2doL%2Fwelcome-data-table.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FEeSukv9m1rPWm32v2doL%2Fwelcome-data-table.png?alt=media</a></td><td><a href="/dynamic-components/components/data-table.md">Data Table</a></td></tr><tr><td><h4>Map</h4></td><td>Plot records from their address, and open the record from its pin.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FUHrlSnb3hDROvBikxPyR%2Fwelcome-map.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FUHrlSnb3hDROvBikxPyR%2Fwelcome-map.png?alt=media</a></td><td><a href="/dynamic-components/components/map.md">Map</a></td></tr><tr><td><h4>Calendar</h4></td><td>Month, week or day views of any records that carry a date.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FbhxSTsFtJe1I1cs7CGxf%2Fwelcome-calendar.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FbhxSTsFtJe1I1cs7CGxf%2Fwelcome-calendar.png?alt=media</a></td><td><a href="/dynamic-components/components/calendar.md">Calendar</a></td></tr><tr><td><h4>Chat</h4></td><td>A conversation on the record itself: received and sent messages, pinned items, replies.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FLWnflfALbPZRULQoeLTa%2Fwelcome-chat.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FLWnflfALbPZRULQoeLTa%2Fwelcome-chat.png?alt=media</a></td><td><a href="/dynamic-components/components/chat.md">Chat</a></td></tr><tr><td><h4>Chart</h4></td><td>Donuts, bars, lines, gauges and heatmaps, computed live from your records.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FhPsGHMNrPnzVXg8ZLA1n%2Fwelcome-chart.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FhPsGHMNrPnzVXg8ZLA1n%2Fwelcome-chart.png?alt=media</a></td><td><a href="/dynamic-components/components/chart.md">Chart</a></td></tr></tbody></table>

<p align="center"><a href="/dynamic-components/components/explore-all-components.md" class="button secondary" data-icon="grid-round-2-plus">Explore all components</a></p>

***

<h3 align="center">Build it with an AI assistant</h3>

<p align="center">Describe the component you want in plain language. Your assistant looks up the real component catalog through the Avonni MCP server, then builds it.</p>

<table data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><h4><i class="fa-wand-magic-sparkles">:wand-magic-sparkles:</i></h4></td><td><h4>Setup</h4></td><td>Install the Avonni Skills and connect the MCP server to your assistant, once.</td><td><a href="/dynamic-components/build-with-ai/setup.md">Setup</a></td></tr><tr><td><h4><i class="fa-list-check">:list-check:</i></h4></td><td><h4>Prompt Library</h4></td><td>Copy-paste prompts organized by goal, from a first table to a full dashboard.</td><td><a href="/dynamic-components/build-with-ai/prompt-library.md">Prompt Library</a></td></tr><tr><td><h4><i class="fa-circle-question">:circle-question:</i></h4></td><td><h4>Limitations &#x26; FAQ</h4></td><td>What the server and the skills do not cover, and fixes for common setup problems.</td><td><a href="/dynamic-components/build-with-ai/limitations-and-faq.md">Limitations &amp; FAQ</a></td></tr></tbody></table>

***

<h3 align="center">See it built</h3>

<p align="center">Projects built end to end in a real org, with the screenshots and the configuration behind each one.</p>

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-cover data-type="image">Cover image</th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><h4>Richer record pages</h4></td><td>Panels, timelines, catalogs and threads that live on the record page itself.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FS7EJHZhEzRA8HRPeMttw%2Fprojects-record-pages.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FS7EJHZhEzRA8HRPeMttw%2Fprojects-record-pages.png?alt=media</a></td><td><a href="https://docs.avonnicomponents.com/projects/use-cases/record-pages">https://docs.avonnicomponents.com/projects/use-cases/record-pages</a></td></tr><tr><td><h4>Boards and pipelines</h4></td><td>Kanban boards, dispatch timelines and live walls, where a drag is a real update.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FGaRaxDuCAv0lSAEcL5Up%2Fprojects-boards-and-pipelines.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2FGaRaxDuCAv0lSAEcL5Up%2Fprojects-boards-and-pipelines.png?alt=media</a></td><td><a href="https://docs.avonnicomponents.com/projects/use-cases/boards-and-pipelines">https://docs.avonnicomponents.com/projects/use-cases/boards-and-pipelines</a></td></tr><tr><td><h4>Reporting without a report</h4></td><td>Pivots, charts and grouped tables computed live from your records.</td><td><a href="https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2Fr61lrwZ0CdOplNDqHcC6%2Fprojects-reporting.png?alt=media">https://2532358799-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FODPvvv7Cx9Z9RECLn3oV%2Fuploads%2Fr61lrwZ0CdOplNDqHcC6%2Fprojects-reporting.png?alt=media</a></td><td><a href="https://docs.avonnicomponents.com/projects/use-cases/reporting">https://docs.avonnicomponents.com/projects/use-cases/reporting</a></td></tr></tbody></table>

***

<h3 align="center">Keep going</h3>

<table data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><h4><i class="fa-arrow-down-to-bracket">:arrow-down-to-bracket:</i></h4></td><td><h4>Installation &#x26; Licenses</h4></td><td>Install the package, assign the licenses and the permission set.</td><td><a href="/dynamic-components/getting-started/installation-and-licenses-management.md">Installation &amp; Licenses Management</a></td></tr><tr><td><h4><i class="fa-folder-open">:folder-open:</i></h4></td><td><h4>Avonni Components app</h4></td><td>Where your components live: folders, templates, versions.</td><td><a href="/dynamic-components/avonni-components-app/overview.md">Overview</a></td></tr><tr><td><h4><i class="fa-life-ring">:life-ring:</i></h4></td><td><h4>Troubleshooting &#x26; FAQ</h4></td><td>Answers to the questions we get most, and how to reach the team.</td><td><a href="/dynamic-components/resources/troubleshooting-and-faq.md">Troubleshooting &amp; FAQ</a></td></tr><tr><td><h4><i class="fa-users">:users:</i></h4></td><td><h4>Trailblazer Community</h4></td><td>Tips, solutions and best practices from other Avonni admins.</td><td><a href="https://trailhead.salesforce.com/trailblazer-community/groups/0F9KX000000iFxO0AU?tab=discussion&#x26;sort=LAST_MODIFIED_DATE_DESC">https://trailhead.salesforce.com/trailblazer-community/groups/0F9KX000000iFxO0AU?tab=discussion&#x26;sort=LAST_MODIFIED_DATE_DESC</a></td></tr></tbody></table>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.avonnicomponents.com/dynamic-components/welcome.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
