Paramètres de police

Famille de police

Point clé :
Définit la police utilisée. Influe directement sur l'impression du bouton et la cohérence de marque.

Ce que ce réglage change :
À texte identique, la police modifie la perception de fiabilité et d'accessibilité.

Astuce :
Pour éviter toute dissonance, commencez par une police de la même famille que celle utilisée sur le reste du site.

Paramètres

• Liste de polices (Default / System / Police du thème) : Sélectionnez la police à utiliser pour harmoniser le ton de marque et la lisibilité.
• Graisse (100–900) : Définit la graisse de la police et ajuste la priorité visuelle de l'information. Compatible responsive : un poids différent peut être défini par appareil.
• Edit Font : Ouvre le panneau de configuration détaillée de la police.

La famille de police et le poids au survol sont également configurables individuellement. Si des modifications par appareil sont nécessaires, activez la commutation responsive.

Limitation du décalage de mise en page au survol :
Modifier le poids au survol peut faire varier la largeur des caractères, entraînant un changement de taille du bouton ou un retour à la ligne (layout shift). Pour éviter cela, fixez la Width / Height du bouton ou limitez l'écart de poids (ex. : 400 → 500).

Taille de police

Point clé :
Définit la taille du texte. Réglage essentiel qui impacte directement la lisibilité et le taux de clic.

Ce que ce réglage change :
Sur mobile notamment, une taille trop petite empêche de transmettre le message souhaité.

Astuce :
Ajustez d'abord sur PC, puis augmentez d'un cran sur mobile ou réduisez le nombre de lignes pour éviter les cassures.

Paramètres

• Sélection de preset (Default / Theme / Custom) : Choisissez un preset de taille pour appliquer rapidement une valeur initiale.
• Custom Size : Spécifiez directement la taille en valeur numérique pour un ajustement précis.
• Unité (px / em / rem / vw) : Choisissez l'unité de taille pour définir un comportement fixe ou variable.
• Commutation responsive : Active les réglages individuels par appareil pour éviter les problèmes d'affichage.
• Edit Font Size : Modifie les paramètres de taille pour optimiser l'affichage par appareil.

Avec em / rem, la taille est relative à la taille de base du navigateur ou du thème. Avec vw, la taille varie en fonction de la largeur du viewport, ce qui est utile pour le responsive mais peut entraîner des tailles extrêmes : vérifiez les valeurs minimales et maximales. La taille de police au survol est également configurable individuellement.

Interligne

Point clé :
Définit l'espacement entre les lignes pour un affichage multiligne. Ajuste l'équilibre entre lisibilité et densité.

Ce que ce réglage change :
Un interligne trop serré ralentit la lecture ; trop large, il affaiblit la cohésion visuelle.

Astuce :
Partez d'une valeur entre 1.2 et 1.6, en augmentant légèrement pour les textes plus longs.

Paramètres

• Sélection de preset (Default / Tight / Normal / Loose, etc.) : Choisissez un preset d'interligne pour ajuster rapidement la lisibilité.
• Custom Line Height : Spécifiez l'interligne en valeur numérique pour optimiser la lisibilité sur 2 lignes ou plus.
• Unité (sans unité / px / em / rem / %) : Choisissez l'unité d'interligne, ratio ou valeur fixe.
• Commutation responsive : Active les réglages individuels par appareil pour éviter les problèmes d'affichage.

Avec une valeur sans unité (ex. : 1.5), l'interligne est calculé comme un multiple de la taille de police. Le ratio étant préservé même si la taille change, cette approche est recommandée en design responsive. La valeur par défaut est 1.2. L'interligne au survol est également configurable individuellement.

Contrôle par variables CSS :
L'interligne (Line Height) et l'espacement des caractères (Letter Spacing) sont contrôlés en interne uniquement par des variables CSS (–line-height-pc / –letter-spacing-pc, etc.). Transmises aux éléments enfants via les variables CSS et non par des styles inline, elles n'interfèrent pas avec les réglages de police des éléments internes tels que le microtexte et le sous-texte.

Espacement des caractères

Point clé :
Définit l'espace entre les caractères. Permet d'ajuster les nuances de style titre, d'élégance ou de lisibilité.

Ce que ce réglage change :
L'impact visuel est important, mais un réglage excessif nuit à la lisibilité.

Astuce :
Commencez par de petits ajustements autour de 0 à 0.5 px sans trop écarter les caractères.

Paramètres

• Sélection de preset (Tight / Normal / Wide, etc.) : Choisissez un preset d'espacement pour ajuster l'impression de densité.
• Custom Value : Spécifiez un espacement personnalisé pour un réglage fin entre lisibilité et esthétique.
• Unité (px / em / rem / %) : Choisissez l'unité d'espacement, fixe ou relative. L'unité par défaut est em.
• Commutation responsive : Active les réglages individuels par appareil pour éviter les problèmes d'affichage.

Avec l'unité em, l'espacement est déterminé en proportion de la taille de police. Ex. : 0.05em correspond à 5 % de la taille de police. Les valeurs négatives permettent de resserrer les caractères, mais attention à la baisse de lisibilité. L'espacement au survol est également configurable individuellement.