Core Code
Core Code Modern Dev Handbook

Basic CSS Transition

Transitions animate property changes smoothly.

Preview

Code

<style>
.box{
width:120px;
height:80px;
background:#60a5fa;
transition:background 0.3s;
}

.box:hover{
background:#2563eb;
}
</style>

<div class="box"></div>

More CSS Transitions Examples (8)

example Width Transition open example example Multiple Property Transition open example example Transform Transition open example example Transition Delay open example example Timing Function Ease open example example Timing Function Linear open example example Button Hover Transition open example example Card Hover Lift open example