O CodePen é um editor de código HTML, CSS e JavaScript online que permite que você experimente o código diretamente no navegador. Você pode usar fontes da Web personalizadas diretamente no Pen.
Escolher fontes para usar
Acompanhe o tutorial de fontes da Web para escolher algumas fontes e criar seu projeto da Web.
Adicionar o código incorporado ao Pen
O código incorporado pode ser adicionado à interface do CodePen no campo “Stuff for <head>” no menu de configurações do editor de HTML ou no menu “CSS > Add External”.
Para encontrar o código incorporado padrão de seu projeto, visite a página de projetos da Web e localize o nome do projeto. Copie e cole o código incorporado CSS padrão desse projeto em um desses locais.
Aplicar as fontes no seu CSS
Agora você pode usar o nome das famílias de fontes no editor CSS do Pen para que as fontes fiquem imediatamente visíveis na Visualização dinâmica.
O nome da família de fontes a ser usado no CSS também está listado no projeto da Web. Leia mais sobre o uso de fontes em CSS.
Bifurcar trabalhos do Pen
Os trabalhos públicos do Pen podem ser bifurcados para que outros usuários usem seu código como base. As fontes da Web também funcionarão na caneta bifurcada.
Excluir um projeto ou cancelar sua assinatura
Se você excluir o projeto que está usando no CodePen ou cancelar sua assinatura, as fontes não estarão mais disponíveis para nenhum dos trabalhos no Pen que usam esse código incorporado. Isso inclui seu trabalho original, bem como quaisquer trabalhos bifurcados a partir dele. As fontes substitutas especificadas no CSS serão aplicadas no lugar das fontes da Web personalizadas.
Mais itens semelhantes
Explorar o Adobe Fonts
Encontre a fonte perfeita para qualquer projeto da Web ou impresso.