Catálogo de efeitos Izynet Seleção 0

Catálogo de efeitos

53 efeitos de site, cada um com nome, código e exemplo funcionando. Marque quero este nos que quiser num site novo: a lista fica na barra de baixo, pronta para copiar.

Mostrar efeitos para:

O nome entre aspas de código (ex.: video-rolagem) é o mesmo da skill site-cinematico-izynet: é só dizer o código.

Vídeo e câmera

O movimento da página conta a história do produto.

6 efeitos
01

Vídeo na rolagem

video-rolagem
Serve para
Produto premium, carro, imóvel, lançamento. O vídeo anda para frente e para trás com o dedo.
Melhor para
VeículosImóveisModa e belezaVarejo e produtoTecnologia e IA
Ideias de uso
  • Veículos: o carro gira e acende os faróis enquanto a pessoa desce.
  • Imóveis: a câmera atravessa a porta e entra na sala decorada.
  • Moda e beleza: o frasco se abre e o produto aparece.
No celular
Funciona igual; usa uma versão do vídeo cortada para tela em pé.
Peso
médio
Já usado em
Demo 1 (relógio)
Relógio de aço surgindo do escuro sob uma faixa de luz
02

Textos no momento do vídeo

momentos-video
Serve para
Explicar o produto em 3 frases enquanto ele aparece. Sempre dentro de um painel, para ler sobre qualquer quadro.
Melhor para
VeículosImóveisVarejo e produtoTecnologia e IA
Ideias de uso
  • Veículos: três frases sobre motor, conforto e segurança, cada uma na hora certa do vídeo.
  • Varejo: o produto gira e cada benefício entra quando a parte dele aparece.
No celular
Os painéis ficam embaixo, longe do produto.
Peso
médio
Já usado em
Demo 1 (relógio)
Relógio de aço surgindo do escuro sob uma faixa de luz
momento 1

O texto entra com a cena

Cada painel tem começo e fim marcados na rolagem.

momento 2

Sai quando a imagem muda

Assim o texto nunca fala de uma coisa que já passou.

momento 3

E fecha no convite

O último painel fica até o fim do vídeo, com o botão.

03

Enquadramento do celular

enquadra-celular
Serve para
Todo site com vídeo ou foto larga: escolhe o ponto que fica no centro quando a tela é em pé.
Melhor para
qualquer site
Ideias de uso
  • Qualquer site com foto ou vídeo largo: garante que o produto fique no centro da tela em pé.
No celular
É o próprio efeito: o recorte da direita é o que o celular mostra.
Peso
leve
Já usado em
Demo 1 (relógio)
Quadro do vídeo do relógio, tela largatela larga · clique para escolher o centro
celular
04

Zoom contínuo

zoom-continuo
Serve para
Do lugar ao detalhe: fazenda até o fruto, prédio até o acabamento, mapa até a loja.
Melhor para
ImóveisHotelaria e turismoGastronomiaIndústria
Ideias de uso
  • Imóveis: do mapa da cidade até a fachada do prédio.
  • Hotelaria: da praia até a varanda do quarto.
  • Gastronomia: da fazenda até o grão ou o prato.
No celular
Funciona igual, com uma foto em pé.
Peso
leve
Já usado em
Demo 2 (torrefação)
Cafezal em morros com um galho de frutos maduros no centro

Comece pelo lugar

Termine no detalhe

05

Camadas em profundidade

parallax
Serve para
Dar sensação de 3D com fotos comuns: a tela fica parada e cada foto sobe numa velocidade (as de perto mais rápido, as de longe devagar).
Melhor para
Hotelaria e turismoModa e belezaGastronomiaImóveis
Ideias de uso
  • Hotelaria: fotos do hotel em camadas que dão profundidade ao topo da página.
  • Gastronomia: pratos e ingredientes flutuando em velocidades diferentes.
No celular
Funciona igual, com menos deslocamento.
Peso
leve
Já usado em
Novo

Frente e fundo
em velocidades
diferentes

Coador V60
Frasco de perfume
Espresso
Tênis
06

Vídeo de fundo leve

video-fundo
Serve para
Abertura com clima (restaurante, academia, evento) sem pesar: vídeo curto, sem som, só toca na tela.
Melhor para
GastronomiaEventosHotelaria e turismoSaúde e estética
Ideias de uso
  • Gastronomia: cozinha em movimento atrás do nome do restaurante.
  • Eventos: trecho da última edição atrás da chamada de ingresso.
  • Saúde e estética: o espaço da clínica em clima calmo.
No celular
Toca sozinho, mudo. Quem pede menos movimento vê a foto parada.
Peso
médio
Já usado em
Novo

Vídeo de 300 KB atrás do título

Pausa sozinho quando sai da tela.

Texto

Títulos e números que chamam o olho sem precisar de foto.

10 efeitos
07

Palavras que acendem

palavras-acendem
Serve para
Manifesto, história da marca, proposta de valor. Obriga a ler no ritmo da rolagem.
Melhor para
Serviços profissionaisSaúde e estéticaTecnologia e IAGastronomia
Ideias de uso
  • Serviços profissionais: o manifesto do escritório lido no ritmo da rolagem.
  • Saúde: a promessa da clínica em uma frase forte.
No celular
Funciona igual.
Peso
leve
Já usado em
Demo 2 (torrefação)

Um site bom não se explica. Ele mostra. Cada rolagem revela uma coisa nova, e a pessoa chega ao botão de contato já convencida.

08

Título palavra a palavra

titulo-palavra
Serve para
Primeira tela de qualquer site: o título entra em cascata, uma palavra depois da outra.
Melhor para
qualquer site
Ideias de uso
  • Qualquer site: o título da primeira tela ganha entrada elegante sem pesar.
No celular
Funciona igual.
Peso
leve
Já usado em
Demo 2 (torrefação)

Seu produto merece entrar em cena

09

Foto dentro das letras

foto-letras
Serve para
Fechamento de página ou nome da marca em tamanho gigante, com a foto correndo por dentro.
Melhor para
GastronomiaModa e belezaEventosHotelaria e turismo
Ideias de uso
  • Gastronomia: o nome do prato com a própria comida dentro das letras.
  • Hotelaria: "MAR" com a foto da praia por dentro.
No celular
Funciona igual.
Peso
leve
Já usado em
Demo 2 (torrefação)

AROMA

10

Texto que embaralha

embaralha
Serve para
Marca de tecnologia, agência, lançamento. Letras sorteadas viram a palavra certa.
Melhor para
Tecnologia e IAEventos
Ideias de uso
  • Tecnologia e IA: a palavra do serviço se forma como código sendo decifrado.
  • Eventos: a data ou o nome da atração revelado no lançamento.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo

A gente faz sites

11

Texto que sobe da fenda

sobe-mascara
Serve para
Título elegante (moda, arquitetura, joalheria): cada linha nasce de dentro de uma linha invisível.
Melhor para
Moda e belezaImóveisServiços profissionais
Ideias de uso
  • Moda: nome da coleção entrando linha a linha.
  • Imóveis de alto padrão: título do empreendimento com entrada discreta.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo

Cada linhasobe de dentrode uma fenda

12

Contorno que se preenche

contorno-preenche
Serve para
Frase de impacto: começa só no contorno e se pinta enquanto a pessoa desce. Bom para esporte, evento, oficina.
Melhor para
EventosVeículosVarejo e produto
Ideias de uso
  • Eventos: chamada de impacto ("garanta seu lugar") que se pinta ao rolar.
  • Veículos: nome do modelo novo se completando.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo

ROLE PARA
PREENCHER

13

Faixa de texto correndo

marquee
Serve para
Lista de serviços, marcas atendidas, chamada de promoção. Acelera quando a pessoa rola.
Melhor para
Varejo e produtoEventosTecnologia e IAServiços profissionais
Ideias de uso
  • Varejo: faixa de promoção correndo.
  • Serviços: lista de áreas atendidas ou de clientes (com autorização deles).
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
SiteVídeoLogo 3DAnúncioPerfil no GoogleSEO
14

Números que contam

contador
Serve para
Prova em número (anos, clientes, nota). Só com número verdadeiro que o cliente deu.
Melhor para
Serviços profissionaisIndústriaSaúde e estéticaImóveis
Ideias de uso
  • Serviços: anos de mercado, casos atendidos (só número que o cliente comprova).
  • Indústria: capacidade de produção da fábrica.
  • Imóveis: metros quadrados e unidades do empreendimento.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
+1.200clientes atendidos
15anos de mercado
4,9nota no Google

Números de exemplo, fictícios.

15

Texto em círculo girando

texto-circulo
Serve para
Selo de marca (“desde 2010”, “feito à mão”), botão de rolar, canto de foto.
Melhor para
GastronomiaModa e belezaSaúde e estética
Ideias de uso
  • Gastronomia: selo "desde 1998 · feito à mão" no canto da foto.
  • Moda: selo da coleção girando ao lado do botão de compra.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
16

Letra que engorda com o mouse

fonte-variavel
Serve para
Título de marca jovem, estúdio, agência. Usa uma fonte variável (um arquivo só).
Melhor para
Tecnologia e IAEventosModa e beleza
Ideias de uso
  • Tecnologia: o nome da marca reagindo ao mouse no topo.
  • Eventos: atração principal em letra viva.
No celular
Siga com o dedo: a letra mais perto engorda.
Peso
leve
Já usado em
Novo

Movimento

Imagem

Jeitos de mostrar foto que não sejam só um quadrado na tela.

9 efeitos
17

Imagem fundida ao fundo

funde-fundo
Serve para
Toda seção com foto de produto: a borda some na cor do site, sem cara de “quadrado colado”.
Melhor para
VeículosVarejo e produtoModa e belezaIndústria
Ideias de uso
  • Veículos: o carro saindo do escuro sem moldura.
  • Varejo: produto sobre a cor da marca, sem cara de foto colada.
No celular
Funciona igual.
Peso
leve
Já usado em
Demo 1 (relógio)

Sem canto, sem moldura

A foto foi gerada sobre a cor do fundo e a borda se desfaz numa máscara.

Relógio de aço sobre fundo preto
18

Antes e depois arrastável

antes-depois
Serve para
Estética, reforma, limpeza, restauração, odontologia. As duas fotos precisam ter o mesmo enquadramento.
Melhor para
Saúde e estéticaImóveisVeículosServiços profissionais
Ideias de uso
  • Saúde e estética: antes e depois de tratamento (com autorização do paciente).
  • Imóveis: reforma ou decoração.
  • Veículos: polimento, vitrificação ou funilaria.
No celular
Arraste com o dedo; também funciona pelo teclado.
Peso
leve
Já usado em
Demo 2 (torrefação)
Grãos de café verde crus sobre linho Os mesmos grãos depois da torra
19

Foto que se revela

cortina
Serve para
Abrir uma seção com impacto: a tela para, a foto abre do meio para os lados como cortina e assenta.
Melhor para
ImóveisHotelaria e turismoModa e beleza
Ideias de uso
  • Imóveis: a área de lazer revelada como abertura de seção.
  • Hotelaria: a vista do quarto abrindo.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
Sala de estar moderna com janelas altas e sofá de linho

A foto abre do meio para os lados

20

Foto que ondula no mouse

distorce
Serve para
Perfumaria, moda, bebida, água. A imagem ondula como reflexo quando o mouse passa.
Melhor para
Moda e belezaVarejo e produtoGastronomia
Ideias de uso
  • Moda e beleza: perfume ou sérum ondulando como água.
  • Gastronomia: bebida gelada com reflexo vivo.
No celular
Toque na foto para ver.
Peso
médio
Já usado em
Novo
Frasco de perfume com tampa de latão
21

Lanterna que revela

lanterna
Serve para
Restaurante, bar, evento, mistério. A foto escura acende onde o mouse aponta.
Melhor para
GastronomiaEventosHotelaria e turismo
Ideias de uso
  • Gastronomia: restaurante à luz baixa, o mouse acende o prato.
  • Eventos: festa noturna revelada aos poucos.
No celular
Arraste o dedo pela foto.
Peso
leve
Já usado em
Novo
Chef finalizando um prato de peixe com ervas
22

Lista com foto que segue

lista-foto
Serve para
Portfólio, serviços, cardápio. Passa o mouse no item e a foto dele aparece junto do cursor.
Melhor para
Serviços profissionaisModa e belezaGastronomiaImóveis
Ideias de uso
  • Serviços: lista de áreas de atuação com foto de cada uma.
  • Gastronomia: cardápio em que cada prato mostra a foto.
  • Imóveis: lista de empreendimentos.
No celular
No celular a foto aparece ao lado de cada item.
Peso
leve
Já usado em
Novo
23

Imagem que cresce até a tela cheia

expande-tela
Serve para
Momento de “uau” no meio da página: a foto sai pequena e toma a tela.
Melhor para
VeículosImóveisHotelaria e turismo
Ideias de uso
  • Veículos: detalhe do farol que cresce até o carro inteiro.
  • Hotelaria: janela do quarto que vira a vista em tela cheia.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
Farol de LED de um carro esportivo verde à noite

Do detalhe
à tela inteira

24

Vídeo que toca no mouse

video-hover
Serve para
Portfólio de vídeo, produto em uso, imóvel. Parado é foto; com o mouse em cima, toca.
Melhor para
ImóveisVeículosEventosModa e beleza
Ideias de uso
  • Imóveis: miniatura do tour que toca ao passar o mouse.
  • Moda: peça em movimento no desfile.
No celular
Toque para tocar e de novo para pausar.
Peso
médio
Já usado em
Novo
passe o mouse ou toque
25

Grão de filme

grao
Serve para
Clima de cinema, moda, fotografia analógica. Uma textura de filme que mexe por cima de tudo. Metade da foto está sem grão, para comparar.
Melhor para
Moda e belezaGastronomiaEventos
Ideias de uso
  • Moda: clima de filme em campanha de coleção.
  • Gastronomia: casa tradicional com ar de fotografia antiga.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
Sala de estar com luz de fim de tarde

Layout e rolagem

Como as seções se encaixam enquanto a pessoa desce.

9 efeitos
26

Galeria que anda para o lado

galeria-lateral
Serve para
Portfólio, cardápio, produtos, métodos. A página trava e os cartões passam.
Melhor para
GastronomiaVarejo e produtoModa e belezaImóveis
Ideias de uso
  • Gastronomia: cardápio passando para o lado.
  • Imóveis: plantas disponíveis do empreendimento.
  • Varejo: linha de produtos.
No celular
Funciona igual.
Peso
leve
Já usado em
Demo 2 (torrefação)

A página para e a galeria anda

Role para baixo: os cartões passam para o lado.

Coador V60 com água sendo despejada
CoadoCartão 1
Frasco de perfume sobre pedra travertino
PerfumeCartão 2
Tênis branco com sola laranja
TênisCartão 3
Espresso saindo do porta-filtro
EspressoCartão 4
Prensa francesa com café
PrensaCartão 5
Chef finalizando um prato
CozinhaCartão 6
Farol de carro esportivo
CarroCartão 7
Sala de estar moderna
ImóvelCartão 8
27

Cor da página por seção

cor-secao
Serve para
Etapas, níveis, coleções: o fundo troca de cor conforme a parte da página.
Melhor para
GastronomiaVarejo e produtoIndústriaSaúde e estética
Ideias de uso
  • Gastronomia: pontos de torra ou sabores, cada um com sua cor.
  • Indústria: etapas do processo de fabricação.
No celular
Funciona igual.
Peso
leve
Já usado em
Demo 2 (torrefação)

Etapa clara

O fundo acompanha o assunto.

Etapa do meio

A troca é suave, sem corte.

Etapa escura

Bom para mostrar níveis de um produto.

28

Blocos que aparecem

aparece
Serve para
Qualquer site: os blocos sobem um depois do outro quando chegam na tela. O básico bem feito. Use “ver de novo” para repetir.
Melhor para
qualquer site
Ideias de uso
  • Qualquer site: o básico bem feito em toda seção comum.
No celular
Funciona igual.
Peso
leve
Já usado em
Demo 1 (relógio)
01Site
02Vídeo
03Logo 3D
04Anúncio
05SEO
06Perfil no Google
29

Cartões que se empilham

empilha
Serve para
Passo a passo, planos, cases. Cada cartão para no topo e o próximo deita por cima.
Melhor para
Serviços profissionaisSaúde e estéticaTecnologia e IA
Ideias de uso
  • Serviços: passo a passo de como o escritório atende.
  • Saúde: etapas do tratamento.
  • Tecnologia: planos lado a lado.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
01

Conversa

Entender o que o cliente vende e para quem.

Coador V60
02

Roteiro

O que aparece em cada parte da rolagem.

Frasco de perfume
03

Produção

Imagens, vídeo e texto feitos sob medida.

Tênis
04

No ar

Publicado, medido e com o botão funcionando.

Sala de estar
30

Texto rola, imagem troca

troca-lado
Serve para
Explicar 3 ou 4 pontos de um produto: o texto passa de um lado e a foto do outro troca junto.
Melhor para
Varejo e produtoVeículosSaúde e estéticaTecnologia e IA
Ideias de uso
  • Veículos: segurança, conforto e tecnologia do modelo, cada um com sua foto.
  • Varejo: três diferenciais do produto.
No celular
A foto fica fixa no alto e o texto passa por baixo.
Peso
leve
Já usado em
Novo
Frasco de perfumeTênisFarol de carro

Perfume

Primeiro ponto do produto. A foto ao lado mostra exatamente isso.

Tênis

Segundo ponto. Ao chegar aqui, a foto troca sozinha.

Carro

Terceiro ponto. Funciona com 3, 4 ou 5 blocos.

31

Linha que se desenha

linha-desenha
Serve para
Linha do tempo, etapas de um serviço, trajeto. O traço avança com a rolagem e liga os pontos.
Melhor para
Serviços profissionaisIndústriaImóveis
Ideias de uso
  • Imóveis: linha do tempo da obra (lançamento, fundação, entrega).
  • Serviços: as etapas de um processo jurídico ou contábil.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
  1. 1Conversa
  2. 2Roteiro
  3. 3Site no ar
32

Barra de progresso de leitura

progresso
Serve para
Blog, artigo longo, página de venda comprida. Mostra quanto falta.
Melhor para
Serviços profissionaisTecnologia e IASaúde e estética
Ideias de uso
  • Serviços: artigos longos de blog.
  • Saúde: conteúdo educativo para pacientes.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo

Exemplo de artigo

A linha laranja no topo desta página é a barra de verdade. Esta caixa repete o efeito num texto curto: role dentro dela.

Em artigo longo, a pessoa sabe quanto falta e lê até o fim com mais frequência. A barra é fina, fica colada no topo e não tampa nada.

Ela não carrega nenhuma biblioteca. São poucas linhas de código que medem a rolagem.

Fim do exemplo.

33

Cartão que vira

vira-cartao
Serve para
Serviços com preço ou detalhe no verso, equipe, perguntas. Frente com foto, verso com texto.
Melhor para
Serviços profissionaisGastronomiaSaúde e estética
Ideias de uso
  • Serviços: área de atuação na frente, detalhes no verso.
  • Gastronomia: prato na frente, ingredientes no verso.
No celular
Toque no cartão para virar.
Peso
leve
Já usado em
Novo
34

Rolagem suave

rolagem-suave
Serve para
Sites com muito efeito de rolagem: a roda do mouse desliza com inércia em vez de pular de degrau em degrau. Ligue e gire a roda do mouse.
Melhor para
VeículosImóveisModa e belezaHotelaria e turismo
Ideias de uso
  • Sites com vídeo na rolagem ou galeria lateral: deixa tudo mais fluido no computador.
No celular
No celular o toque já é suave; não muda nada.
Peso
leve
Já usado em
Demo 1 (opcional)

3D e fundo

Profundidade e fundos vivos. São os mais pesados: usar com critério.

6 efeitos
35

Objeto 3D desenhado em código

objeto-3d-codigo
Serve para
Produto de forma simples (xícara, frasco, garrafa, caixa). Gira com o dedo e com a rolagem.
Melhor para
GastronomiaVarejo e produtoSaúde e estética
Ideias de uso
  • Gastronomia: xícara, garrafa ou embalagem simples girando.
  • Saúde: frasco de produto da clínica.
No celular
Arraste para os lados.
Peso
pesado
Já usado em
Demo 2 (torrefação)
Xícara de café branca sobre o piresarraste para girar
36

Modelo 3D de arquivo (.glb)

modelo-glb
Serve para
Produto real do cliente modelado no Blender (ou escaneado). Este frasco foi modelado aqui: 35 KB.
Melhor para
Varejo e produtoIndústriaVeículosModa e beleza
Ideias de uso
  • Indústria: a peça ou máquina do cliente girando.
  • Varejo: produto real modelado no Blender.
  • Veículos: roda, banco ou acessório (o carro inteiro com marca exige autorização).
No celular
Arraste para girar.
Peso
pesado
Já usado em
Novo
o 3D liga quando chega na telaarraste para girar
37

Cartão que inclina

inclina-3d
Serve para
Produto em destaque, cartão de plano, cupom. Inclina seguindo o mouse, com reflexo.
Melhor para
Varejo e produtoModa e belezaEventos
Ideias de uso
  • Varejo: produto em destaque reagindo ao mouse.
  • Eventos: cartão do ingresso ou do plano.
No celular
Arraste o dedo de lado sobre o cartão.
Peso
leve
Já usado em
Novo
Tênis branco com sola laranja
38

Partículas que fogem do mouse

particulas
Serve para
Abertura de marca de tecnologia, evento, lançamento. A palavra é feita de pontos que se espalham.
Melhor para
Tecnologia e IAEventos
Ideias de uso
  • Tecnologia e IA: o nome da empresa feito de pontos na abertura.
  • Eventos: logo do evento se formando.
No celular
Passe o dedo por cima.
Peso
médio
Já usado em
Novo
39

Fundo líquido

liquido
Serve para
Fundo de abertura que parece tinta mexendo; o mouse empurra as cores.
Melhor para
Tecnologia e IAEventosSaúde e estética
Ideias de uso
  • Tecnologia: fundo da primeira tela sem precisar de vídeo.
  • Saúde e estética: fundo calmo em tons suaves.
No celular
Mexe sozinho; o dedo também empurra.
Peso
médio
Já usado em
Novo

Fundo vivo, sem vídeo

Desenhado pela placa de vídeo, quase sem peso de download.

40

Degradê que se move

degrade-vivo
Serve para
Fundo de seção ou de botão grande. Manchas de cor mudando devagar. O mais leve dos fundos.
Melhor para
Tecnologia e IASaúde e estéticaServiços profissionais
Ideias de uso
  • Tecnologia: fundo de seção de planos.
  • Serviços: fundo do bloco de contato.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo

Só CSS

Quatro manchas de cor andando em tempos diferentes.

Holografia

Projeção de luz que mostra o que a foto não mostra: o prédio que ainda não existe, o que tem dentro do carro.

6 efeitos
41

Prédio em linhas de luz

holo-predio
Serve para
Lançamento imobiliário: o empreendimento aparece desenhado em luz, subindo do chão, antes de existir. Mesma ideia do ERA, site do dia no Awwwards em 2025.
Melhor para
ImóveisIndústriaEventos
Ideias de uso
  • Imóveis, lançamento: o prédio desenhado em linhas de luz na abertura. Referência real: o site ERA, site do dia no Awwwards em 2025.
  • Imóveis, obra em andamento: o prédio se monta andar por andar enquanto a pessoa rola a página.
  • Imóveis, planta: os cômodos acendem um a um com a área de cada um, usando os números reais da planta.
  • Imóveis, bairro: mapa em linhas de luz com pontos que acendem (metrô, escola, mercado). A agência do ERA diz que o site destaca localização e infraestrutura.
  • Indústria: a fábrica ou o galpão em linhas de luz.
No celular
Funciona igual; arraste para girar.
Peso
pesado
Já usado em
Novo (referência: site ERA, premiado no Awwwards)
o 3D liga quando chega na tela
42

Raio-X do veículo

raio-x-veiculo
Serve para
Mostrar o que fica dentro do carro: bateria e motor de um elétrico, ou as camadas de uma blindagem. Um scanner passa pelo carro holográfico, revela o interior e cada parte acende com o nome. Carro conceito original, sem marca.
Melhor para
VeículosIndústria
Ideias de uso
  • Veículos, elétrico ou híbrido: acendem a bateria, o motor e o carregador. Responde à dúvida mais comum desse comprador ("onde fica a bateria, como funciona").
  • Veículos, blindagem: acendem a manta de aramida, o vidro multilaminado e o aço, o que o cliente paga e nunca vê.
  • Veículos, comparar versões: o mesmo carro, e os itens de cada versão acendem quando a pessoa troca de versão.
  • Veículos, estética automotiva (película, vitrificação, PPF): as camadas aplicadas sobre a pintura.
  • Referência real: a Autoliv (airbag e cinto) mostra em 3D onde seus componentes ficam dentro do carro.
No celular
Funciona igual; troque entre elétrico e blindagem pelos botões.
Peso
médio
Já usado em
Novo
Carro conceito elétrico desenhado em linhas de luz azuis sobre um chão em grade O mesmo carro em raio-X: bateria verde no assoalho, motor e cabos laranja e porta de recarga O mesmo carro em raio-X: mantas laranja nas portas, vidros grossos e reforços nas colunas e no teto
  1. Bateria no assoalho
  2. Motor elétrico no eixo traseiro
  3. Cabos de alta tensão
  4. Porta de recarga
  1. Manta de aramida nas portas
  2. Vidro multilaminado
  3. Aço nas colunas e no teto
43

Produto em holograma

holograma-produto
Serve para
Abertura de tecnologia, lançamento ou indústria: o produto vira projeção azul translúcida com linhas de varredura, sobre um pedestal de luz. Aqui, o frasco .glb do catálogo.
Melhor para
Tecnologia e IAVarejo e produtoIndústriaEventos
Ideias de uso
  • Tecnologia e IA: o produto ou o "assistente" como projeção na abertura.
  • Indústria: a peça principal da fábrica em holograma.
  • Eventos: troféu ou prêmio projetado.
No celular
Arraste para girar.
Peso
pesado
Já usado em
Novo
o 3D liga quando chega na telaarraste para girar
44

Produto furta-cor

frasco-iridescente
Serve para
Perfume, cosmético, bebida, joia: o vidro muda de cor conforme o ângulo, como bolha de sabão. O efeito pode vir gravado no próprio arquivo 3D.
Melhor para
Moda e belezaVarejo e produtoSaúde e estética
Ideias de uso
  • Moda e beleza: perfume, esmalte, cosmético furta-cor.
  • Varejo: bebida premium, joia, garrafa especial.
No celular
Arraste para girar.
Peso
médio
Já usado em
Novo
o 3D liga quando chega na telaarraste para girar
45

Cartão e ingresso holográfico

cartao-foil
Serve para
Ingresso de evento, cartão de membro, cupom, plano premium: o brilho arco-íris corre conforme o mouse ou o celular inclina. Só CSS, escrito do zero.
Melhor para
EventosVarejo e produtoServiços profissionaisModa e beleza
Ideias de uso
  • Eventos: ingresso VIP que brilha.
  • Serviços: cartão do clube de benefícios ou do plano premium.
  • Varejo: cupom de desconto especial.
No celular
Arraste o dedo sobre o cartão.
Peso
leve
Já usado em
Novo
INGRESSONoite de lançamentoÁrea VIP · acesso 1 pessoa
46

Título holográfico

texto-holografico
Serve para
Marca de tecnologia, IA, evento: título com cor furta-cor que corre, linhas de varredura e borda de cor desalinhada, como projeção. Sem pisca-pisca.
Melhor para
Tecnologia e IAEventos
Ideias de uso
  • Tecnologia e IA: nome do produto no topo.
  • Eventos: título de festa ou feira de tecnologia.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo

Projeção

Interação

O site responde ao mouse, ao dedo e ao clique.

7 efeitos
47

Cursor personalizado

cursor
Serve para
Estúdio, portfólio, marca criativa. O cursor vira um círculo que cresce nos botões.
Melhor para
Moda e belezaTecnologia e IAEventos
Ideias de uso
  • Moda e estúdios: portfólio com cursor próprio.
  • Tecnologia: site de agência ou produto digital.
No celular
Celular não tem cursor: o efeito some sozinho.
Peso
leve
Já usado em
Novo
BotãoOutroMais um

mova o mouse aqui dentro

48

Botão que puxa o mouse

botao-ima
Serve para
Botão principal (WhatsApp, orçamento). Ele vem ao encontro do mouse quando chega perto.
Melhor para
qualquer site
Ideias de uso
  • Qualquer site: o botão de WhatsApp ou orçamento chamando atenção sem pular na cara.
No celular
No celular fica parado, como botão comum.
Peso
leve
Já usado em
Novo
Pedir orçamentoVer trabalhos
49

Ícones animados (Lottie)

lottie
Serve para
Benefícios, passo a passo, confirmação de formulário. Ícone que se desenha ao aparecer.
Melhor para
Serviços profissionaisSaúde e estéticaTecnologia e IA
Ideias de uso
  • Serviços: ícones dos benefícios se desenhando.
  • Saúde: confirmação de agendamento animada.
No celular
Toque no ícone para repetir.
Peso
médio
Já usado em
Novo
50

Peças com física

fisica
Serve para
Seção divertida de serviços ou valores: as peças caem, quicam e dá para arrastar.
Melhor para
Tecnologia e IAEventosVarejo e produto
Ideias de uso
  • Tecnologia: os serviços caindo como peças de montar.
  • Eventos: atrações do festival para arrastar.
No celular
Arraste as peças com o dedo.
Peso
médio
Já usado em
Novo
as peças caem quando chegam na tela
51

Menu em tela cheia

menu-tela
Serve para
Site com poucas páginas e visual forte. O menu abre num círculo e os itens sobem um a um.
Melhor para
Moda e belezaHotelaria e turismoImóveisGastronomia
Ideias de uso
  • Hotelaria e gastronomia: menu com fotos em tela cheia.
  • Imóveis: navegação de site de lançamento.
No celular
Funciona igual (é o menu “Índice” do topo).
Peso
leve
Já usado em
Novo
52

Tela de entrada com contagem

entrada-contagem
Serve para
Site de experiência (lançamento, evento). Conta até 100% e abre. Usar curta: atrasa a primeira tela.
Melhor para
EventosTecnologia e IA
Ideias de uso
  • Eventos: contagem antes de revelar a atração.
  • Tecnologia: lançamento de produto (usar curta, atrasa a primeira tela).
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
Sala de estar moderna

O site aparece depois da contagem

53

Transição entre páginas

troca-pagina
Serve para
Site com várias páginas: uma cortina cobre a tela ao sair e descobre a página nova.
Melhor para
ImóveisHotelaria e turismoModa e belezaServiços profissionais
Ideias de uso
  • Imóveis: passar de um empreendimento para outro com cortina.
  • Hotelaria: do hotel para os quartos.
No celular
Funciona igual.
Peso
leve
Já usado em
Novo
Ir para a página 2