What are keyframes in CSS?

Keyframes in CSS define the styles at specific points during an animation. They allow you to control how an element’s style changes over time. By using percentages (like 0%, 50%, 100%), you can set the start, middle, and end states of the animation. For example, @keyframes move { 0% { transform: translateX(0); } 100% { transform: translateX(100px); } } .element { animation: move 2s; }