
# Personalizza le pagine di accesso

La personalizzazione cambia l'aspetto dell'accesso ospitato, del portale account e delle email. Le impostazioni vengono ereditate in quest'ordine: default della piattaforma, ambiente, applicazione, organizzazione. Ogni token prende il valore dal livello più specifico che lo definisce.

## Cosa puoi impostare

- Colori: `color.primary`, `color.primary_contrast`, `color.background`, `color.surface`, `color.text`, `color.text_muted`, `color.border`, `color.link`, `color.focus_ring`, `color.error` e `color.success`, come hex sRGB. Chiaro e scuro hanno valori separati, e `mode` può essere `light`, `dark` o `system`.
- Font: `font.body` e `font.heading` dalla lista dei font consentiti, oppure un font caricato; `font.size_base` da 14 a 18 px.
- Forma: `radius.card` da 0 a 24 px e `radius.control` da 0 a 16 px.
- Layout: `center`, `split_left` o `split_right`.
- Immagini: `logo`, `logo_height` (da 24 a 80 px), `favicon` e `background_image` (solo con un layout `split_*`).

Le organizzazioni possono sovrascrivere solo i token `logo` e `color.primary`. Il brand di un'organizzazione viene mostrato solo quando il contesto dell'organizzazione è verificato, per esempio da un invito valido o dopo il selettore di organizzazione. Un semplice parametro `organization` non cambia l'aspetto della pagina.

## Protezione del contrasto

Al salvataggio, KeenAuth controlla queste coppie, separatamente per chiaro e scuro:

| Coppia | Rapporto minimo |
|---|---|
| Testo su sfondo | 4.5:1 |
| `color.link` su sfondo | 4.5:1 |
| `color.primary_contrast` su `color.primary` | 4.5:1 |
| Bordo del controllo su sfondo | 3:1 |
| Anello di focus (`color.focus_ring`) su sfondo | 3:1 |

Una coppia sotto il minimo viene rifiutata dalla Management API con `422 brand_contrast_insufficient` (RFC 9457). Il corpo dell'errore indica il campo e suggerisce il colore più vicino che passa; il suggerimento mantiene tonalità e croma e modifica solo la luminosità. La dashboard offre lo stesso suggerimento con un clic. Un valore che fallisce non può essere pubblicato. Vedi [Pubblica il branding](/docs/api/management/branding/publish) per il formato dell'errore.

Il CSS personalizzato (piano Startup) può ridurre il contrasto, e KeenAuth non lo corregge. Una scansione di anteprima segnala i problemi come avvisi nella dashboard, e la conformità delle modifiche fatte con CSS personalizzato è di tua responsabilità.

## Asset

Carica immagini e font con `POST /v1/branding/assets`. Le immagini sono al massimo 1 MB e i font al massimo 300 KB. Sono accettati PNG, JPEG e WebP, ICO solo per i favicon e WOFF2 solo per i font. SVG viene rifiutato. Le immagini vengono ricodificate come PNG, ridimensionate a non più di 1024×1024 px e private dei metadati. Un ambiente può contenere 200 file e 50 MB.

## CSS personalizzato e template

Dal piano Startup in su puoi aggiungere CSS personalizzato e un template di pagina. Le parti critiche per la sicurezza di una pagina sono disegnate in un livello protetto che il tuo CSS non può nascondere né coprire: il nome dell'applicazione e l'origine verificata nelle schermate di consenso, l'elenco delle autorizzazioni richieste, i pulsanti consenti e nega, gli avvisi di sicurezza, il banner dell'ambiente e i link legali. Il JavaScript del cliente non viene eseguito su nessun piano.

Usa le proprietà CSS logiche (`margin-inline-start`, non `margin-left`): le proprietà fisiche vengono rifiutate, così i tuoi stili funzionano anche nelle lingue da destra a sinistra. Vedi [Lingue e destra-sinistra](/docs/guides/localization).

## Marchio KeenAuth

Accesso ospitato, portale account ed email mostrano una piccola riga "Secured by KeenAuth" nel livello protetto. Nei piani Business ed Enterprise, e negli ambienti `development`, non viene mostrata. Il piano viene verificato ogni volta che una pagina o un'email viene disegnata, quindi la riga torna se il piano cambia. Il CSS personalizzato e le sostituzioni di testo non possono nasconderla né modificarla.

## Pubblica

Le modifiche vengono salvate come bozza e diventano attive quando le pubblichi. Le versioni precedenti possono essere elencate e ripristinate. Le pagine dell'API si trovano sotto `/docs/api/management/branding/`, a partire da [Pubblica il branding](/docs/api/management/branding/publish).
