সিএসএস কিফ্রেম অ্যানিমেশন জেনারেটর
সিএসএস কিফ্রেম অ্যানিমেশন জেনারেটরে ১২টি রেডি-মেড স্টাইল থেকে একটি অ্যানিমেশনের ধরন বেছে নিন (fade in/out, চারদিক থেকে slide in, zoom in/out, bounce in, rotate in, X বা Y অক্ষে flip), তারপর ডিউরেশন, ডিলে, টাইমিং ফাংশন আর ইটারেশন সংখ্যা ঠিক করুন, লাইভ প্রিভিউ আর একটি Replay বাটনসহ। সম্পূর্ণ @keyframes রুল এবং একটি রেডি-টু-ইউজ অ্যানিমেশন ক্লাস কপি করুন। পুরো জেনারেশন ব্রাউজারেই হয় — কিছুই কখনো সার্ভারে আপলোড হয় না।
ডিজাইন এবং CSS টুলস সম্পূর্ণভাবে আপনার ব্রাউজারে চলে
কোডটি সম্পূর্ণভাবে আপনার ব্রাউজারে তৈরি হয় — কখনও সার্ভারে পাঠানো হয় না।
CSS কোড
@keyframes uddatakAnim {
0% { opacity: 0; }
100% { opacity: 1; }
}
.animated-box {
animation: uddatakAnim 800ms ease-out 0ms 1;
}সচরাচর জিজ্ঞাসিত প্রশ্ন
হ্যাঁ, @keyframes আর animation প্রোপার্টি প্রতিটি আধুনিক ব্রাউজারে সাপোর্টেড, কোনো বিশেষ ভেন্ডর প্রিফিক্সের দরকার নেই।
এরপর যা করবেন
সম্পর্কিত টুলস
Uddatak ব্যবহার করে দেখতে চান?
সম্পূর্ণ টুল লাইব্রেরি ব্রাউজ করুন এবং আপনার প্রয়োজনীয় জিনিস এখনই ব্যবহার শুরু করুন — বিনামূল্যে, সাইনআপ ছাড়াই।
সব টুল দেখুন