CSS3-siirtymägeneraattori
Sujuva peittävyyden siirtyminen
Suositut esiasetukset
Häivytystehoste
Tasainen peittävyyssiirtymä
Skaalaustehoste
Elementin koon muuttaminen osoittimen
Kierrätehoste Kierrä
elementtiä vietäessä
Liukutehoste
Siirrä elementin sijaintia
Värin muutos
Taustavärin siirtymä
Tietoja siirtymistä
CSS-siirtymien avulla voit muuttaa ominaisuuksien arvoja sujuvasti tietyn ajan kuluessa.
Yleisesti animoidut ominaisuudet include:
- leveys, korkeusmarginaali
- , pehmusteen
- peittävyys, väri
- transform (scale, rotate, translate)
- background-color
Ammattilaisvinkki: Käytä "Kaikki ominaisuudet" -vaihtoehtoa animoidaksesi kaikki muutokset.
Preview
Luotu koodi
.element { transition-property: all; transition-duration: 300ms; transition-timing-function: ease; transition-delay: 0ms; } .element:hover { /* Hover styles will be generated here */ }
Siirtymä Ohjaimet
Tehosteet
Related Tools
Less CSS-muotoon -muunnin
Muunna Less-koodisi CSS:ksi. Nopeaa, helppoa ja turvallista.
CSS Minifier
Pakkaa ja optimoi CSS-koodisi ammattimaisella tarkkuudella
CSS3-siirtymägeneraattori
Sujuva peittävyyden siirtyminen
Pantone heksaksi
varten Muunna Pantone-värit HEX-arvoiksi web-suunnittelua
Painoyksikkömuunnin
Muunna eri painoyksiköiden välillä tarkasti ruoanlaitto-, kuntoilu- ja yhteiskunnallisten tarpeidesi
Luo kauniita CSS-lataajia
Luo mukautettuja CSS-latausanimaatioita sekunneissa intuitiivisella vedä ja pudota -käyttöliittymällämme. Koodausta ei tarvita!