CSS · Lesson 6 · 10 min
Hover & Transitions
Smooth animations when users point or click.
You will learn
- Style :hover states
- Add transition for smooth changes
- Make buttons feel interactive
:hover applies styles when the mouse is over an element. transition makes changes smooth instead of instant.
Edit CSS — live preview below
HTML context (read-only)
<button class="cta">Hover me</button>
CSS
Live preview
Tip: Add box-shadow on hover for extra depth.