# AX - Icon

## Panoramica

**AX - Icona** è un componente di Experience Cloud che mostra icone dalla libreria di icone Salesforce Lightning Design System nelle pagine di Experience Sites.

Usalo per aggiungere indicatori visivi per azioni, stato, categorie o elementi di navigazione in tutto il portale. Configura icona, dimensione, colore e stile in Experience Builder per adattarli al design del tuo portale.

Perfetto per indicatori di stato, pulsanti di azione, intestazioni di sezione, elementi di navigazione o ovunque il tuo portale necessiti di simboli visivi per migliorare la leggibilità e il riconoscimento.

## Impostazioni

{% tabs %}
{% tab title="🎛️ Proprietà" %}

| Nome                         | Descrizione                                                                      | Utilizzo                                                                                                                             |
| ---------------------------- | -------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------ |
| **Nome dell'icona**          | Seleziona il nome dell'icona da visualizzare.                                    | Scegli un'icona che rappresenti chiaramente e completi il contenuto o l'azione a cui è associata.                                    |
| **Dimensione icona**         | Imposta la dimensione dell'icona.                                                | Scegli una dimensione che garantisca che l'icona sia chiaramente visibile e armonicamente integrata nel layout della pagina.         |
| **Variante**                 | Scegli una variante di stile predefinita per l'icona.                            | Seleziona una variante che sia in linea con il significato contestuale o l'azione dell'icona, migliorandone la comunicazione visiva. |
| **Titolo**                   | Definisci un titolo per l'icona.                                                 | Fornisci un titolo che dia agli utenti contesto o informazioni aggiuntive quando passano il cursore sull'icona.                      |
| **Testo alternativo**        | Fornisci testo alternativo per l'icona.                                          | Inserisci un testo descrittivo che trasmetta il significato o l'azione dell'icona, garantendo accessibilità e migliorando la SEO.    |
| **Allineamento orizzontale** | Determina l'allineamento orizzontale dell'icona all'interno del suo contenitore. | Allinea l'icona per garantirne il posizionamento ottimale nel layout dei contenuti, mantenendo equilibrio visivo e flusso.           |
| {% endtab %}                 |                                                                                  |                                                                                                                                      |

{% tab title="🎨 Stile" %}

| **Colore di sfondo**           | Imposta il colore di sfondo per l'icona.                                       | Scegli un colore di sfondo che assicuri che l'icona risalti ed sia visivamente distinta nel design della pagina.                                                  |
| ------------------------------ | ------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Colore primo piano**         | Imposta il colore dell'icona stessa.                                           | Scegli un colore che garantisca che l'icona sia chiaramente visibile rispetto allo sfondo e completi il design complessivo.                                       |
| **Utility colore primo piano** | Applica classi di utilità per modificare il colore del primo piano dell'icona. | Utilizza classi di utilità CSS per applicare facilmente stili di colore predefiniti all'icona, garantendo coerenza e facilità nella personalizzazione del design. |
| **Raggio bordo**               | Definisci il raggio degli angoli del bordo dell'icona.                         | Regola il raggio del bordo per creare icone con angoli arrotondati, migliorando la presentazione stilistica delle icone.                                          |
| {% endtab %}                   |                                                                                |                                                                                                                                                                   |
| {% endtabs %}                  |                                                                                |                                                                                                                                                                   |


---

# Agent Instructions: Querying This Documentation

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

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-it/experience-components/ax-icon.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.