1
resposta

Problemas em adicionar while hovering

Para criar um 'efeito' para passar o mouse e levemente a cor trocar, estou com problemas em adicionar essa função, abaixo meus dois projetos, um de apenas para todos os 'componentes' e o outro do projeto em si:

https://www.figma.com/file/JqCnwO5Tb6IBDc8Luyk1UT/Componentes?type=design&node-id=25%3A916&mode=design&t=u1xN1agx5N37N1c4-1

https://www.figma.com/file/hq284Nr9l0GEIQg5HsLEQs/Projeto-1---Fastask?type=design&node-id=145%3A210&mode=design&t=mdEGIuk3OPzfWTB3-1

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

1 resposta

(Primeiro) Mandou muito! lembrasse de deixar como respondido para aumentar o engajamento e alcance !

Olá! Para criar um efeito de mudança de cor ao passar o mouse, você pode usar a propriedade CSS :hover. Aqui está um exemplo de como você pode fazer isso:

CSS

button {
    background-color: #4CAF50; /* Cor original do botão */
    color: white; /* Cor do texto */
    transition: background-color 0.3s ease; /* Adiciona uma transição suave ao mudar a cor de fundo */
}

button:hover {
    background-color: #45a049; /* Cor do botão quando o mouse está sobre ele */
}

Examine e use com cuidado. Mais informações em perguntas frequentes. Neste exemplo, a cor de fundo do botão muda para #45a049 quando o mouse está sobre ele. A propriedade transition é usada para suavizar a transição entre as cores.

Porém, note que este é um exemplo em CSS. No Figma, você pode criar um efeito similar usando a funcionalidade de Hover Effect. Você pode criar dois estados para o seu botão (normal e hover), e definir a cor de cada estado. Quando você prototipar o seu design, o Figma irá automaticamente criar a transição entre os dois estados quando o mouse passar sobre o botão.

Espero que isso ajude! Se você tiver mais perguntas, fique à vontade para perguntar.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software