CSS Motion

CSS Transitions

CSS transitions allows you to change property values smoothly, over a given duration. To create a transition effect, you must specify two things: 1.) the CSS property you want to add an effect to and 2.) the duration of the effect

See the Pen CSS Transitions by Oliver Roeger (@uic-des) on CodePen.

CSS Animations

CSS allows animation of HTML elements.An animation lets an element gradually change from one style to another. You can change as many CSS properties you want, as many times you want.

See the Pen CSS Animations by Oliver Roeger (@uic-des) on CodePen.

Animation with SVG (Scalable Vector Graphics)

See the Pen SVG Animation by Oliver Roeger (@uic-des) on CodePen.

Animation depending on scroll position

See the Pen Scroll dependent animation by Oliver Roeger (@uic-des) on CodePen.