मुख्य सामग्री पर जाएं
Uddatak

CSS कीफ़्रेम एनिमेशन जनरेटर

CSS कीफ़्रेम एनिमेशन जनरेटर आपको 12 तैयार स्टाइल में से एक एनिमेशन प्रकार चुनने देता है (फेड इन/आउट, चारों दिशाओं से स्लाइड, ज़ूम इन/आउट, बाउंस इन, रोटेट इन, X या Y अक्ष पर फ्लिप), फिर लाइव प्रीव्यू और रीप्ले बटन के साथ अवधि, देरी, टाइमिंग फ़ंक्शन, और पुनरावृत्ति संख्या को समायोजित करने देता है। पूरा @keyframes नियम और उपयोग के लिए तैयार एनिमेशन क्लास कॉपी करें। पूरा निर्माण आपके ब्राउज़र में होता है — कुछ भी कभी सर्वर पर अपलोड नहीं होता।

डिज़ाइन और CSS टूल्स पूरी तरह आपके ब्राउज़र में चलता है

कोड पूरी तरह आपके ब्राउज़र में बनता है — कुछ भी सर्वर पर नहीं भेजा जाता।

CSS कोड

@keyframes uddatakAnim {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.animated-box {
  animation: uddatakAnim 800ms ease-out 0ms 1;
}

अक्सर पूछे जाने वाले प्रश्न

हां, @keyframes और animation प्रॉपर्टी बिना किसी विशेष वेंडर प्रीफ़िक्स के हर आधुनिक ब्राउज़र में समर्थित है।

संबंधित टूल्स

Uddatak आज़माने के लिए तैयार हैं?

पूरी टूल लाइब्रेरी ब्राउज़ करें और अभी वह उपयोग करना शुरू करें जिसकी आपको जरूरत है — मुफ्त, बिना साइन-अप के।

सभी टूल्स ब्राउज़ करें