Understanding CSS Transitions (ease) on Webflow

Documentation
March 20, 2023
3 min
Ease editor animations in Webflow
Use AI to summarize this article
Key points

When you create animations on Webflow, you can use different "modes" to define how the animation will progress. Combined with a timing value, this choice plays a significant role in the final effect of your animation.

Default Animation Choices

By default, in the Webflow Designer interface, you have the option to add the 5 most popular animation styles.

Linear Transition

The animation will have the same speed from start to finish.

Ease Transition

This is the default mode used for CSS animations. The animation will start slowly, then speed up, and finish slowly.

Ease-in Transition

The animation has a slow start.

Ease-out Transition

The animation has a slow ending.

Ease-in-out Transition

The animation has both a slow start and a slow ending.

Summary Table of CSS Transitions

Summary table (content in English)

Summary table of CSS animation values (ease)

Feature Overview from the Webflow Interface

Access from Triggers ⚡️(JS Animations)

Styling transition options panel for animation triggers in Webflow

Access from CSS (transition styles)

Easing editor in the Webflow Designer interface

Check out a visual preview of all the ease effects in this Webflow project!

Visual demonstration of different Ease effects on Webflow
Florian Bodelot
Florian Bodelot
Co-founder

Suggested articles

AI Tech Summit 2025 conference with a speaker on stage in front of a large audience, surrounded by big screens displaying “AI” and “Tech Summit 2025”. (Gen by AI)
Events

2025 Calendar of Must-Attend Web, Design & AI Events

2025 Calendar of Must-Attend Web, Design & AI Events
Screenshot of Google search homepage with search bar and Google logo.
Documentation
SEO

3 tools to track your SEO rankings in the SERP

3 tools to track your SEO rankings in the SERP
ChatGPT 5.0 OpenAI
News
AI

ChatGPT-5 vs ChatGPT-4 vs Claude Opus 4.1: The Ultimate AI Comparison 2025

ChatGPT-5 vs ChatGPT-4 vs Claude Opus 4.1: The Ultimate AI Comparison 2025

Want to turn your website into your most valuable asset?

Contact us today