Couleurs et polices
Couleurs
Configurez les couleurs dans Constructeur de bannière → Apparence → Couleurs.
Variables CSS
ConsentForge expose des propriétés CSS personnalisées que vous pouvez remplacer dans votre CSS personnalisé :
| Variable | Valeur par défaut | Description |
|---|---|---|
--cf-color-primary | #1B3A4B | Couleur d'action principale (bouton Accepter) |
--cf-color-secondary | #6B7280 | Couleur d'action secondaire (bouton Refuser) |
--cf-color-background | #FFFFFF | Arrière-plan de la bannière |
--cf-color-text | #111827 | Texte du corps |
--cf-color-text-muted | #6B7280 | Texte secondaire |
--cf-color-border | #E5E7EB | Couleur de la bordure |
--cf-color-overlay | rgba(0,0,0,0.5) | Fond du modal |
Mode sombre
ConsentForge suit automatiquement la requête média prefers-color-scheme du visiteur. Définissez data-theme="auto" (par défaut) dans votre extrait d'intégration, ou forcez data-theme="light" / data-theme="dark".
Polices
Par défaut, la bannière hérite de la police du corps de votre site via font-family: inherit.
Pour utiliser une police spécifique :
/* Dans votre CSS personnalisé */
.cf-banner {
font-family: 'Inter', sans-serif;
}
Ou configurez dans Constructeur de bannière → Apparence → Police.
Taille de police
| Variable | Valeur par défaut |
|---|---|
--cf-font-size-base | 14px |
--cf-font-size-title | 16px |
--cf-font-size-small | 12px |