Pular para o conteúdo
Fieldbook
Menu
Entrar
PT-BR

Animação

Easing preview tile

Um bloco que reproduz a mesma escala em qualquer curva de atenuação escolhida, com a curva desenhada ao lado e um marcador sincronizado.

Como usar Easing preview tile

Um bloco que reproduz a mesma escala em qualquer curva de atenuação escolhida, com a curva desenhada ao lado e um marcador sincronizado.

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: easing, duration, delay, mirror, accent

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

Entrance timing playground
1773Entrance timing playgroundAnimaçãoUm disco reproduz o mesmo movimento de entrada sob demanda para que você possa sentir exatamente qual duração, atraso e curva de atenuação contribuem.
Spring easing toggle
1808Spring easing toggleAnimaçãoUm bloco que desliza entre duas paradas em uma curva de mola inserida em uma transição simples CSS, com a curva gerada plotada ao lado dela.
Interruptible hover swell
1780Interruptible hover swellAnimaçãoUm bloco cujo aumento de flutuação em dois estágios sempre começa a partir de seu tamanho atual, portanto, ligar e desligar o ponteiro nunca o faz quebrar.
Keyframe morph loop
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.
Press and hover scale tile
1797Press and hover scale tileAnimaçãoUm ladrilho que incha ao pairar e se comprime ao pressionar, com a imprensa sempre superando o hover e ambos resolvidos a partir de uma mola para que os gestos nunca briguem.
Scale in on view
1743Scale in on viewAnimaçãoUm wrapper que mantém seu filho pequeno até que ele primeiro seja exibido e, em seguida, aumente-o para o tamanho máximo, com um escalonamento opcional por item para listas.