Core Code
Core Code Modern Dev Handbook

Timing Function Linear

linear timing moves at a constant speed.

Preview

Code

<style>
.box{
width:120px;
height:80px;
background:#06b6d4;
transition:transform 0.5s linear;
}

.box:hover{
transform:translateX(40px);
}
</style>

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

More CSS Transitions Examples (8)

example Basic CSS Transition open example 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 Button Hover Transition open example example Card Hover Lift open example