Eu mostrei como montar um Style Guide direto no Framer, começando pela paleta de cores: criar as cores, renomear, agrupar em pastas (ex.: Primary, BW) e sempre copiar o código da cor manualmente para garantir precisão. Expliquei por que não usar o conta-gotas sobre a fonte original e dei a dica de dividir a tela com o Figma para agilizar a cópia. Enfatizei a importância de componentizar cores e bordas para poder ajustar tons do layout rapidamente sem editar item por item. Depois eu configurei a tipografia: criei estilos para H1 a H6, Body, Reading, Button e Caption, mantive hierarquia de tamanhos e line-height, ajustei pesos (regular, medium, semibold) e apliquei a cor principal como padrão para economizar tempo. Organizei os estilos em pastas com nomes padronizados (ex.: Reading/48) e corrigi fontes antigas. Também ativei opções como balance e alinhamento para otimizar o layout. O resultado foi um Style Guide limpo e componentizado; na próxima aula vou usar esses padrões para criar componentes do layout. Termos/dúvidas: - Style Guide: guia visual com cores e tipografia padrão. - Framer: ferramenta para criar interfaces e protótipos. - Figma: ferramenta de design colaborativo (útil para copiar códigos). - Componentizar/componentizado: transformar elementos em componentes reutilizáveis. - Breakpoint: ponto onde o layout muda para outra versão (ex.: mobile). - Balance: ajuste automático de quebras de linhas para melhorar leitura. - Conta-gotas: ferramenta para pegar cor da tela.