CSS3 Overgang Generator

Vloeiende overgang van dekking

Populaire voorinstellingen

Vervagend effect

Vloeiende overgang van dekking

Schaaleffect

Formaat van element wijzigen bij aanwijzen

Effect roteren

Element roteren bij zweven

Dia-effect

Positie van het element verplaatsen

Kleur verandering

Achtergrond kleurovergang

Over overgangen

Met CSS-overgangen kunt u eigenschapswaarden soepel wijzigen, gedurende een bepaalde duur.

Veelgebruikte geanimeerde eigenschappen zijn:

  • breedte, hoogte
  • marge, opvulling
  • Opaciteit, kleur
  • transform (scale, rotate, translate)
  • background-color

Pro-tip: gebruik de optie 'Alle eigenschappen' om alle wijzigingen te animeren.

Preview

HOVER ME

Gegenereerde code

.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; }  .element:hover { /* Hover styles will be generated here */ }

Overgangsregelaars

300
0

Effecten aanwijzen

100%
100%
0px
0px
8px
8px

Related Tools