// tailwind.config.js
module.exports = {
content: ["./*.html"], // ajuste o caminho se necessário
theme: {
extend: {
fontFamily: {
grotesk: ['"Space Grotesk"', 'sans-serif'],
},
},
},
plugins: [],
}
Meu tailwind.config está assim, e meu input.css está assim:
@import "tailwindcss";
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap');
Mas não funciona. O que devo fazer?
Oi Lucas, ainda estou dando meus primeiros passos com tailwind, então não sei se serei de muita ajuda. Qual a versão do tailwind vc está utilizando? Se for a atual, lá na documentação vc encontra um exemplo de importação de fontes do google fonts. Eu acho essa forma mais simples.
Seu arquivo CSS vai ficar assim:
@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
@import "tailwindcss";
@theme {
--font-roboto: "Roboto", sans-serif;
}
E agora vc consegue utilizar a fonte como uma variavel no seu projeto. Segue o link da documentação: https://tailwindcss.com/docs/font-family
Espero que dê certo :)