Crie efeitos interativos com desfoque progressivo e gradientes suaves

HanaIniciante9 min

Neste tutorial, exploramos vários estilos e técnicas para criar designs suaves e sofisticados usando gradientes suaves e desfoque progressivo, e como transformá-los em experiências interativas no Hana.

Começamos explicando como adicionar gradientes e efeitos de desfoque a formas e depois passamos à criação de elementos interativos, como animações de hover, efeitos que seguem o cursor, animações em loop e efeitos de desfoque em camadas. Tudo pronto para ser incorporado ao seu projeto web, sem código! 👌

Cenas de demonstração: https://app.spline.design/ui/f7cc3864-707e-492a-8148-0e1ea37be1d3

O que você vai aprender

  1. 0:00Introdução
  2. 0:15Design simples com gradientes
  3. 2:57Adicionando desfoque de camada
  4. 3:41Criando uma interação de hover do mouse
  5. 5:28Criando um efeito de desfoque interativo em texto
  6. 6:44Criando uma animação de gradiente radial em loop
  7. 7:43Criando um efeito de gradiente e desfoque que segue o cursor

Recursos relacionados

Tutoriais relacionados

Todos os tutoriais