AccueilOutils de DesignCombinaison de Polices

Combinaison de Polices

L’outil d’association de polices présente 12 combinaisons de Google Fonts sélectionnées pour les titres et le texte courant, vous laisse composer vos propres associations et copie le @import CSS correspondant.

The Art of Good Typography
Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line-spacing, and letter-spacing.

À propos de cet outil

L’outil d’association de polices présente 12 combinaisons de Google Fonts sélectionnées pour les titres et le texte courant, vous laisse composer vos propres associations et copie le @import CSS correspondant.

Mode d’emploi

  1. Choisissez l’une des associations proposées, ou sélectionnez vous-même une police de titre et une police de texte.
  2. Utilisez Association aléatoire pour explorer des combinaisons.
  3. Consultez l’aperçu en direct du titre et du paragraphe.
  4. Cliquez sur Copier le @import CSS pour charger les polices sur votre site.

Bon à savoir

  • Une association classique oppose une police à empattements et une police sans empattements, comme Playfair Display avec Source Sans 3.
  • Parmi les associations : Montserrat + Merriweather, Raleway + Lato, Space Grotesk + Inter et DM Serif Display + DM Sans.
  • Limiter un site à deux familles de polices garde des pages cohérentes et réduit le poids à télécharger.
  • L’aperçu charge les polices choisies depuis Google Fonts en graisses 400 et 700.
  • Ajouter display=swap à l’URL de la police affiche un texte de secours pendant le chargement de la police web.

Fonctionne entièrement dans votre navigateur : rien de ce que vous saisissez n’est envoyé ni stocké.

Questions fréquentes

Quelles polices vont bien ensemble ?

Des polices de styles contrastés mais de proportions proches s’associent généralement bien, comme un titre en police à empattements très contrastée avec un texte en sans empattements épurée. Les associations proposées ici ont fait leurs preuves.

Combien de polices un site web doit-il utiliser ?

Deux familles, l’une pour les titres et l’autre pour le texte courant, suffisent à la plupart des sites. Une troisième est rarement nécessaire.

Les Google Fonts sont-elles gratuites pour un usage commercial ?

Oui. Les polices de la bibliothèque Google Fonts sont publiées sous des licences ouvertes comme la SIL Open Font License et peuvent être utilisées commercialement.

Comment ajouter les polices à mon site ?

Collez le @import copié en haut de votre CSS, ou convertissez-le en balise link dans le head de votre HTML, puis définissez font-family pour vos titres et le body.