## Tarefa
Utilizando as utilidades de tipografia do Tailwind CSS, crie um componente de texto com as seguintes especificações:
1. Um título (`h1`) com:
   - Tamanho de fonte 4xl;
   - Peso da fonte em negrito;
   - Altura de linha normal.
2. Um subtítulo (`h2`) com:
   - Tamanho de fonte 2xl;
   - Peso da fonte semi-negrito;
   - Altura de linha reduzida.
3. Um parágrafo (`p`) com:
   - Tamanho de fonte base;
   - Peso da fonte normal;
   - Altura de linha espaçada.

PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxtZXRhIGNoYXJzZXQ9IlVURi04IiAvPgogICAgPG1ldGEgbmFtZT0idmlld3BvcnQiIGNvbnRlbnQ9IndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjAiIC8+CiAgICA8dGl0bGU+Q2hhbGxlbmdlOiBBcHBseWluZyBUeXBvZ3JhcGh5IFV0aWxpdGllcyAtIFRhc2s8L3RpdGxlPgogICAgPHNjcmlwdCBzcmM9Imh0dHBzOi8vY2RuLnRhaWx3aW5kY3NzLmNvbSI+PC9zY3JpcHQ+CiAgPC9oZWFkPgogIDxib2R5PgogICAgPGgxIGNsYXNzPSJ0ZXh0LV9fX19fIGZvbnQtX19fX18gbGVhZGluZy1fX19fXyI+TWFpbiBIZWFkaW5nPC9oMT4KICAgIDxoMiBjbGFzcz0iX19fX18tX19fX18gX19fX18tX19fX18gX19fX18tX19fX18iPlN1YmhlYWRpbmc8L2gyPgogICAgPHAgY2xhc3M9Il9fX19fIF9fX19fIF9fX19fIj4KICAgICAgVGhpcyBpcyBhIHBhcmFncmFwaCBkZW1vbnN0cmF0aW5nIGRpZmZlcmVudCBmb250IHNpemVzLCBmb250IHdlaWdodHMsIGFuZAogICAgICBsaW5lIGhlaWdodHMgdXNpbmcgVGFpbHdpbmQgQ1NTIHV0aWxpdGllcy4KICAgIDwvcD4KICA8L2JvZHk+CjwvaHRtbD4=

1. **Tamanho da Fonte:** Utilize `text-4xl`, `text-2xl`, `text-base` para tamanhos de fonte;
2. **Peso da Fonte:** Utilize `font-bold`, `font-semibold`, `font-normal` para pesos de fonte;
3. **Altura da Linha:** Utilize `leading-normal`, `leading-tight`, `leading-relaxed` para alturas de linha.

PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxtZXRhIGNoYXJzZXQ9IlVURi04IiAvPgogICAgPG1ldGEgbmFtZT0idmlld3BvcnQiIGNvbnRlbnQ9IndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjAiIC8+CiAgICA8dGl0bGU+Q2hhbGxlbmdlOiBBcHBseWluZyBUeXBvZ3JhcGh5IFV0aWxpdGllcyAtIFNvbHV0aW9uPC90aXRsZT4KICAgIDxzY3JpcHQgc3JjPSJodHRwczovL2Nkbi50YWlsd2luZGNzcy5jb20iPjwvc2NyaXB0PgogIDwvaGVhZD4KICA8Ym9keT4KICAgIDxoMSBjbGFzcz0idGV4dC00eGwgZm9udC1ib2xkIGxlYWRpbmctbm9ybWFsIj5NYWluIEhlYWRpbmc8L2gxPgogICAgPGgyIGNsYXNzPSJ0ZXh0LTJ4bCBmb250LXNlbWlib2xkIGxlYWRpbmctdGlnaHQiPlN1YmhlYWRpbmc8L2gyPgogICAgPHAgY2xhc3M9InRleHQtYmFzZSBmb250LW5vcm1hbCBsZWFkaW5nLXJlbGF4ZWQiPgogICAgICBUaGlzIGlzIGEgcGFyYWdyYXBoIGRlbW9uc3RyYXRpbmcgZGlmZmVyZW50IGZvbnQgc2l6ZXMsIGZvbnQgd2VpZ2h0cywgYW5kCiAgICAgIGxpbmUgaGVpZ2h0cyB1c2luZyBUYWlsd2luZCBDU1MgdXRpbGl0aWVzLgogICAgPC9wPgogIDwvYm9keT4KPC9odG1sPg==

Aprenda a estilizar sites de forma eficiente utilizando Tailwind CSS, um framework utility-first para desenvolvimento rápido de interfaces. Descubra como configurar o Tailwind e aplicar classes utilitárias para cores, tipografia, bordas e sombras. Construa e estilize componentes essenciais como botões, cartões e formulários. Domine técnicas de layout utilizando espaçamento, flexbox e utilitários de grid. Crie designs responsivos e personalize o Tailwind conforme as necessidades do seu projeto.

Conheça o Tailwind CSS, um framework utility-first reconhecido por sua flexibilidade e eficiência na estilização web. Descubra os principais benefícios e a filosofia utility-first. Além disso, explore os métodos simples de instalação utilizando CDN ou npm/yarn.

Descubra os elementos fundamentais do Tailwind CSS, incluindo a compreensão das classes utilitárias e sua aplicação em elementos HTML. Explore técnicas essenciais de estilização, como definição de cores, bordas, sombras e utilitários de tipografia.

Aprofunde-se em aplicações práticas com foco na criação e estilização de Botões, Formulários e Cartões. Por meio de desafios práticos, você dominará a construção desses componentes essenciais de UI, aprimorando suas habilidades com exemplos do mundo real.

Explore as utilidades essenciais de espaçamento do Tailwind CSS, abordando como aplicar margens e preenchimentos aos seus elementos. Você também aprenderá a utilizar utilidades de flexbox para controlar o layout com configurações de display, direção do flex e alinhamento horizontal e vertical. Além disso, você irá aprofundar-se nas utilidades de grid para criar layouts de grade simples, porém poderosos, dominando a configuração de containers e itens de grid.

Descubra como personalizar o Tailwind CSS para atender aos requisitos de design do seu projeto e criar layouts adaptáveis para diversos dispositivos.

Desafio: Tipografia em Ação

Tarefa

Desafio: Tipografia em Ação

Tarefa