Convenções de nomenclatura de cores para sistemas de design no Storybook

Criar uma paleta de cores coesa é apenas metade da batalha; o verdadeiro desafio está em nomear e estruturar essas cores para que toda a sua equipe possa usá-las sem confusão. Este curso somente de texto orienta você através dos conceitos fundamentais de tokens de design de cores, ajudando você a fazer a transição de nomes de corees caóticos para uma convenção de nomenclatura estruturada e escalável. Você aprenderá a organizar variáveis de cores, preencher a lacuna entre o Figma e o CSS e documentar seu sistema de core. Entenda as principais diferenças entre tokens de cores primitivos, semânticos e de nível de componente. Defina convenções de nomeação de cores escaláveis que dão suporte aos modos claro, escuro e de alto contraste. Mapeie variáveis de cores do Figma para propriedades personalizadas de CSS para um fluxo de trabalho de design para código perfeito. Documente e mostre sua paleta de cores dinamicamente dentro de um ambiente Storybook. Aplique diretrizes de acessibilidade modernas para garantir que suas escolhas de cores atendam aos padrões de contraste. Pratique refaturando esquemas de cores não estruturados em tokens de sistema de design limpos e mantidos. Você começará com a terminologia fundamental dos tokens de design antes de passar para estratégias práticas de nomeação, técnicas de tradução do Figma para CSS e configurações de documentação. Este curso é projetado para designers de interface de usuário iniciantes, desenvolvedores de frontend e novatos em sistemas de design, sem experiência prévia com Storybook ou CSS avançado. Comece a criar um sistema de cores mais organizado e fácil de usar hoje mesmo.