2D Transform

Default button, ADD Hover to translate 300px to the right ADD hover:after to changed content.

Transition: transform 3s ease-out;

She sells sea shells

Default with translate(50%, 5px) ADD Hover with skew(-20deg,10deg), scale(1.3)

Transition: transform 3s ease-in-out 1s;

3D Transform

Shell 1: transform: rotateZ(-150deg);

Shell 2: translate(0,-90%) rotateZ(-30deg) scale(1.5) AND transform-origin: top

Shell 3: transform: translate(200px) rotateZ(30deg) AND transform-origin: top;

All: Transition: transform 3s ease-in-out;