Comment uploader une police custom sur Webflow ?

Dans ce tutoriel, Sandro cofondateur de l'agence Webflow Gemeos vous montre comment uploader et utiliser une police custom (propriétaire ou achetée) sur votre projet Webflow.

1. Convertissez votre police en WOFF2

Si vous avez un fichier TTF ou OTF, convertissez-le en WOFF2 avec CloudConvert (gratuit). Le WOFF2 est 30% plus léger que le WOFF et supporté par tous les navigateurs modernes.

2. Uploadez dans Webflow Fonts

Dans le Designer, allez dans Project Settings > Fonts. Cliquez sur Upload Font. Uploadez votre fichier WOFF2 (et optionnellement WOFF pour le fallback). Définissez le Font Family Name que vous souhaitez utiliser dans vos styles.

3. Utilisez la police dans vos styles

La police uploadée apparaît désormais dans le sélecteur de font du panneau Typography. Sélectionnez un élément, ouvrez le panneau Typography et choisissez votre police dans la liste.

4. Chargez toutes les graisses nécessaires

Si votre police a plusieurs fichiers de graisses (Regular, Bold, Italic...), uploadez chacun séparément dans Project Settings > Fonts. Définissez le même Font Family Name et spécifiez la graisse et le style correspondant à chaque fichier.

Conclusion

Les polices custom s'uploadent directement dans Project Settings sans code. Pour les performances : optimiser les polices dans Webflow.