Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
/* Using from/to */ @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } /* Using percentage steps */ @keyframes bounce { 0% { transform: translateY(0); } 30% { transform: translateY(-30px); } 60% { transform: translateY(-15px); } 80% { transform: translateY(-5px); } 100% { transform: translateY(0); } }
Result
Open