2
respostas

Resolução do desafio

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

2 respostas

Código HTML:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Portfolio</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <script>
        tailwind.config = {
           theme: {
                extend: {
                    colors: {
                        primary: '#f2dae7'
                    },
                },
                fontfamily: {
                    vastshadow: [ "Vast Shadow", "serif"]
                }
           }
        }
    </script>
</head>
<body>
  <div class="p-10 m-auto my-10 flex flex-col w-2/5 bg-gradient-to-r from-pink-300 to-slate-400 justify-center">
    <p class="text-6xl font-black text-primary font-vastshadow">Gabriela</p>
    <p class="text-4xl">Desenvolvedora Front-end</p>
  </div>
</body>

Oi, Guilherme! Como vai?

Agradeço por compartilhar seu código com a comunidade Alura.

Seu uso do Tailwind com bg-gradient-to-r e a personalização de cor text-primary ficou ótimo para destacar o nome. Também foi uma boa escolha usar font-black para dar mais peso visual. Só atente para a propriedade fontfamily dentro da configuração: o nome correto é fontFamily, com F maiúsculo no meio, senão a fonte customizada pode não funcionar como esperado.

Alura Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!