A cor é uma parte importante do web design que dá vida à sua página e aos seus aplicativos móveis. Figma é uma ótima ferramenta criativa, mas o esquema de cores padrão deixa muito a desejar. Felizmente, há muitas maneiras de aproveitar ao máximo as cores no Figma. Você pode personalizar quase tudo, até mesmo as cores de fundo.
Neste artigo, mostraremos como alterar a cor de fundo da tela, botões e outros componentes no Figma. Também mostraremos como criar suas próprias cores. Vamos entrar no assunto.
Como alterar a cor de fundo
Dependendo se você escolheu o tema “claro” ou “escuro”, a cor de fundo do seu espaço de trabalho será cinza claro ou preto. Alterar a cor de fundo da sua área de trabalho não alterará o tema, mas alterará o esquema de cores da página atual. Quaisquer novas páginas terão a cor da página atual, não o tema.
Com isso em mente, vamos ver como alterar a cor de fundo da sua área de trabalho.
- Abra um novo espaço de trabalho.
- Na barra de ferramentas à direita, selecione a seção “Plano de fundo”.
- Use o seletor de cores para alterar a cor de fundo.
- Se você quiser adicionar réguas ao seu plano de fundo, pressione “Shift+R” para ativá-las.
Como alterar a cor de fundo usando protótipo
Os protótipos permitem que você visualize a aparência do seu projeto atual em um dispositivo no visualizador de apresentação. Algumas configurações de modelo de dispositivos vêm com diferentes escalas de cores. Portanto, é importante escolher o modelo certo para suas necessidades.
Para selecionar o dispositivo e alterar a cor de fundo no Prototype, faça o seguinte:
- Limpe suas seleções na tela.
- Vá para o menu “Protótipo” na barra lateral direita.
- Selecione seu dispositivo e modelo preferido. A caixa de visualização mostrará como ficará na tela.
- Na seção “Fundo”, escolha a cor de fundo desejada. A cor de fundo aparecerá atrás do dispositivo na caixa de visualização.
Como criar conjuntos de cores personalizados no Figma
Quando você está trabalhando em um projeto, a última coisa que você quer é perder tempo. Figma possui um recurso útil que permite criar conjuntos de cores personalizados. Essas cores também podem ser aplicadas às cores de fundo, para que você possa alterar as cores rapidamente sem precisar passar pela roda de cores. Isso economiza o tempo de redefinir a cor todas as vezes.
Veja como criar conjuntos de cores personalizados no Figma:
- Crie uma nova forma na sua tela.
- Destaque a forma e, na barra lateral, vá para a seção “Preenchimento”.
- Clique na caixa de cores e crie a cor que deseja usar na janela pop-up.
- À direita da seção “Preencher”, há um símbolo com quatro pontos. Clique nele para ativar o modal “Estilos de cores”.
- No canto direito do modal, clique no símbolo “+”. Repita essas etapas para quaisquer outras cores que desejar criar.
- Para adicionar sua cor personalizada, selecione a camada que deseja colorir e vá para a seção “Preenchimento”.
- Clique nos quatro pontos à direita.
Uma tela colorida
Com tantas opções de personalização disponíveis, Figma tem todas as combinações de cores que você precisa para criar designs web atraentes. Você pode até criar suas próprias cores, tendo inúmeras opções à sua disposição. Esses métodos mostram como aproveitar ao máximo a ampla paleta de cores e aplicativos do Figma. Você estará fazendo projetos dignos de uma exposição de arte no Figma em pouco tempo.