CodePen est un éditeur Web de code HTML, CSS et JavaScript, grâce auquel vous pouvez tester le code directement dans le navigateur. Vous pouvez utiliser des polices web personnalisées directement dans vos « Pens ».
Suivez les instructions du tutoriel relatif aux polices web pour choisir des polices et créer votre projet web.
Vous pouvez ajouter le code incorporé à l’interface utilisateur de CodePen dans le champ « Stuff for <head> » du menu des paramètres de l’éditeur HTML ou du menu « CSS > Ajouter CSS externe ».
Pour rechercher le code incorporé de votre projet, consultez la page Projets web et recherchez le nom du projet. Copiez et collez le code incorporé CSS par défaut de ce projet à l’un de ces emplacements.
Vous pouvez maintenant utiliser les noms de famille de polices dans l’éditeur CSS de Pen ; les polices seront immédiatement visibles en mode Live View.
Le nom de la famille de polices (font-family) à utiliser dans le code CSS est également indiqué dans le projet web ; pour en savoir plus, consultez cette section traitant de l’utilisation de polices dans le code CSS.
Vous pouvez faire bifurquer les Pens publics, afin que d’autres utilisateurs puissent compléter le code. Les polices web fonctionneront également dans le Pen bifurqué.
Si vous supprimez le projet que vous utilisez sur CodePen ou si vous résiliez votre abonnement, les polices ne seront plus disponibles dans aucun des Pens qui utilisent ce code incorporé. Cela inclut votre Pen initial, ainsi que tous les Pens qui en dérivent. Les polices de substitution spécifiées dans le code CSS seront appliquées à la place des polices web personnalisées.
Accéder à votre compte