Tools Blog

Letter Spacing Tool

Calibrez l'espacement des lettres, des mots et la hauteur de ligne avec aperçu en direct.

6 préréglagespx / em / remCopiez le CSS instantanément

① Ajustez espacement, hauteur de ligne et taille de police ② Aperçu en direct ③ Copiez les valeurs CSS

Préréglages
Espacement des lettres0em
Espacement des mots0em
Hauteur de ligne1.6
Taille de police (px)16px
Graisse de police
Famille de police
Transformation du texte

Typography is the art and technique of arranging type. Good spacing creates rhythm, hierarchy, and visual comfort for the reader.

Sortie CSS
letter-spacing: 0em;
word-spacing: 0em;
line-height: 1.6;
font-size: 16px;
font-weight: 400;
font-family: DM Sans, sans-serif;
text-transform: none;

Qu'est-ce que letter-spacing en CSS ?

La propriété CSS letter-spacing contrôle l'espace horizontal entre les caractères individuels (appelé tracking en typographie d'impression). Elle accepte des valeurs positives ou négatives en px, em ou rem. Les unités em sont préférées car l'espacement évolue proportionnellement avec le font-size.

La propriété word-spacing ajoute de l'espace entre les mots, tandis que line-height définit le rythme vertical. WCAG 1.4.12 exige qu'aucun contenu ne soit perdu quand letter-spacing est au moins 0.12em, word-spacing au moins 0.16em et line-height au moins 1.5.

Questions fréquentes

La propriété CSS letter-spacing ajoute un espace uniforme entre chaque caractère. En typographie d'impression, on appelle cela le "tracking". Les valeurs positives écartent les caractères ; les négatives les rapprochent.
Avec em, l'espacement évolue automatiquement avec le font-size. Par exemple, letter-spacing: 0.05em sur 16px donne 0.8px, mais sur 24px donne 1.2px — conservant la même proportion visuelle.
letter-spacing contrôle l'espace entre les caractères individuels. word-spacing ajoute de l'espace horizontal entre les mots. line-height fixe la distance verticale entre les lignes de texte.
Augmentez letter-spacing pour : (1) texte en majuscules — les capitales nécessitent un tracking supplémentaire (0.05–0.15em) ; (2) petit texte comme les légendes ; (3) grands titres display pour un aspect plus raffiné.
Pour le corps de texte, 1.5–1.7 est optimal. Les titres peuvent utiliser 1.1–1.3. Les légendes fonctionnent à 1.4. WCAG 1.4.12 recommande au moins 1.5 pour le contenu de corps.
Les designers utilisent l'espacement précis pour : guides de style de marque, bibliothèques de composants CSS, design éditorial avec polices display, audits d'accessibilité WCAG 1.4.12.
WCAG 2.1 SC 1.4.12 exige qu'aucun contenu ne soit perdu avec : letter-spacing au moins 0.12em, word-spacing au moins 0.16em, line-height au moins 1.5, espace après paragraphes au moins 2em.
Articles liés
CSS 5 min lecture
px, rem, em, vh : Quand utiliser chaque unité CSS
Guide pratique des unités CSS : quand utiliser px, rem, em, vh et vw. Explication accessibilité et tableau de conversion inclus.

Explorez notre réseau

ntool.io Outils gratuits de diagnostic réseau — ping, traceroute, DNS lookup, scanner de ports et plus Visiter → capops.io Calculateurs financiers gratuits — intérêts composés, hypothèque, retraite, outils d'investissement et plus Visiter →