Projeto 16 - Inspecionando no Figma 🎨
🎯 Objetivo
Aprender a extrair informações técnicas de um protótipo visual, transformando o design em propriedades CSS prontas para o código.
📋 Passo a Passo
- Acesso: Entre no site do Figma (ou use a conta criada na Aula 16).
- Protótipo Exemplo: Procure por um "UI Kit" gratuito na comunidade.
- Extração de Estilos: Escolha um "Card" ou um "Botão" e anote as seguintes informações técnicas:
- A cor principal (Hexadecimal: ex:
#000000). - A fonte utilizada (ex:
Inter,Roboto). - O
border-radius(arredondamento das bordas). - O
padding(espaçamento interno).
- A cor principal (Hexadecimal: ex:
- Tradução para Código: Escreva um bloco de CSS que represente exatamente o elemento que você inspecionou.
Entrega: Um print do elemento selecionado no Figma e o código CSS que você escreveu com base nele.