CSS Animasyon ve Keyframes Oluşturucu
Tasarım & GörselBounce, pulse, shake, spin ve flip gibi popüler CSS @keyframes animasyonlarını görsel olarak tasarlayın.
Animasyon Özellikleri
Süre (Duration)1s
Gecikme (Delay)0s
CSS @keyframes & Animation
@keyframes customBounce {
0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
40% { transform: translateY(-30px); }
60% { transform: translateY(-15px); }
}
.animated-element {
animation: customBounce 1s ease-in-out 0s infinite normal;
}☕Bağımsız Proje Desteği
ToolsApp'i Sevdiniz mi? Bir Kahve Ismarlayın
ToolsApp; abonelik, paywall veya veri takibi olmadan %100 tarayıcıda çalışır. Temel dijital araçların herkes için daima ücretsiz ve erişilebilir kalması gerektiğine inanıyoruz. Bir fincan kahve desteğiniz, altyapı giderlerimizi karşılamamıza ve yeni araçlar geliştirmemize güç verir!
%100 İstemci Taraflı•Herkes İçin Ücretsiz
CSS Animasyon ve Keyframes Oluşturucu Nasıl Kullanılır?
1
Efekt Seçin
Bounce, pulse, shake veya spin şablonlarından birini seçin.
2
Süre ve Eğriyi Ayarlayın
Süre, gecikme ve timing function değerlerini değiştirin.
3
CSS Kodunu Kopyalayın
Oluşturulan @keyframes ve class kodunu alın.
Gizlilik Güvencesi:Bu araçtaki tüm hesaplamalar ve dönüştürme işlemleri %100 istemci taraflı (JavaScript) olarak tarayıcınızda gerçekleştirilir. Verileriniz hiçbir sunucuya yüklenmez veya kaydedilmez.
Kullanıcı Yorumları & Değerlendirmeler
Deneyiminizi anonim olarak paylaşın. Yorumlar yapay zeka ile denetlenir.
5.0
•0 yorumYayınlanan Yorumlar (0)
Yorumlar yükleniyor...