Animação

Morphing icon toggle

Um pequeno ícone transforma continuamente seu contorno entre duas formas e duas cores em um loop constante.

Sync

Build

Como usar Morphing icon toggle

Um pequeno ícone transforma continuamente seu contorno entre duas formas e duas cores em um loop constante.

Teste a prévia com o mouse e o teclado. Verifique o foco visível e o layout em telas estreitas na sua página. Informe o número ou o identificador do componente ao seu agente de programação.

Propriedades: intervalSeconds, colorOne, colorTwo

Quais frameworks estão disponíveis?

O catálogo inclui estas versões: react, vue, svelte, astro, html. A prévia desta página usa React.

Como acessar a implementação?

O código, as versões e os comandos de instalação estão disponíveis no painel acima.

Conecte seu agente

Componentes relacionados

2170Icon Shape MorphAnimaçãoUm único ícone preenchido se transforma suavemente no próximo ícone em uma sequência, com o contorno se deformando continuamente entre as formas, em vez de desbotamento cruzado ou troca.

1766Color blend compareAnimaçãoDuas amostras circulam entre o mesmo par de cores, uma misturada em valores brutos de canal e outra em luz linear, mostrando a queda causada por uma transição simples.

1782Keyframe morph loopAnimaçãoUm quadrado que executa uma rotina contínua de crescer, girar e girar em um círculo, mantendo-se em cada pose porque as paradas de tempo são irregulares.

2192Morphing icon loopAnimaçãoUm único ícone preenchido se remodela continuamente no próximo ícone em uma pequena lista, seu contorno fluindo suavemente de uma silhueta para outra enquanto sua cor de preenchimento muda para combinar.

1791Orbiting badgesAnimaçãoPequenos emblemas espaçados uniformemente em torno de uma ou duas pistas circulares, cada anel girando em sua própria velocidade e direção enquanto os emblemas permanecem na posição vertical.

1792Path followerAnimaçãoUm ladrilho arredondado que percorre uma trilha em espiral ondulada enquanto a própria trilha avança à frente dela e depois volta ao início.