All updates

Enhancement

Interactions

Automatic handling for Flash of Unstyled Content (FOUC)

Automatic handling for Flash of Unstyled Content (FOUC)

Webflow now automatically prevents Flash of Unstyled Content (FOUC) in all GSAP-powered Interactions.

Automatic handling for Flash of Unstyled Content (FOUC)

When you build with Webflow’s new Interactions with GSAP, you get the power of professional-grade animations inside a visual workflow. Smooth fades, dynamic entrances, scroll-based storytelling, all without writing a line of code.

But until now, there’s been one lingering issue that could undermine the polish of even the most carefully crafted animation, the Flash of Unstyled Content (FOUC). That moment where an element appears briefly in its default CSS state before your animation takes over.

Today, we’re excited to announce that Webflow now automatically prevents FOUC in Interactions with GSAP - a behind-the-scenes improvement that makes your animations feel seamless, improves stability, and builds user trust from the very first frame.

Under the hood, this fix:

  • Keeps everything visible while you're designing in the Designer
  • Applies a hidden state in CSS before the JS animation runs
  • Prevents layout shifts and weird flashes

All without impacting Core Web Vitals like FCP (First Contentful Paint) and CLS (Cumulative Layout Shift). FOUC is something web developers have been patching manually for years, and now Webflow does it for you automatically at publish time. This enhancement is rolling out to all Webflow users this week.


Launched on
November 10, 2025
Category
Interactions

Related updates

Related updates

More control over Interactions with GSAP

More control over Interactions with GSAP

More control over Interactions with GSAP

Learn more
Webflow makes GSAP 100% free

Webflow makes GSAP 100% free

Webflow makes GSAP 100% free

Learn more
Clean up unused interactions

Clean up unused interactions

Clean up unused interactions

Learn more
Custom easing curves for interactions

Custom easing curves for interactions

Custom easing curves for interactions

Learn more
Apply CSS filters in interactions

Apply CSS filters in interactions

Apply CSS filters in interactions

Learn more

Get started for free

Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.

Get started — it’s free
Watch demo

Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.