Play/Pause All CSS Animations on a Page Using DevTools Console @CSSWeekly

Uploaded April 2023 | Updated September 2026, 7 hours ago

A quick tip showing you how to use document.getAnimations() to view and manipulate (play/pause) all CSS Animations, CSS Transitions, and Web Animations on a page using Console in DevTools.

It can be helpful when you're working on a page with a large number of animations or if you want to stop all annoying animations on a page you're reading.

Support CSS Weekly by buying my course:
🔥 Mastering Prettier & Stylelint: masteringlinting.com

Subscribe to CSS Weekly Newsletter:
💌 css-weekly.com

Keep up-to-date with CSS Weekly:
👉 Twitter: twitter.com/CSSWeekly
👉 Instagram: instagram.com/cssweekly
👉 Facebook: facebook.com/CSSWeekly

Keep up to date with what I'm up to:
🔗 Blog: zoranjambor.com
👉 Twitter: twitter.com/zoranjambor
👉 LinkedIn: linkedin.com/in/zoranjambor

- Zoran Jambor
#css #cssanimation

Play/Pause All CSS Animations on a Page Using DevTools Console

Prevent scroll bounce effect and pull-to-refresh on mobile using overscroll-behavior CSS property

$The easiest way to get started with CSS Grid A simple, straightforward guide to CSS Grid using grid-template-areas property to visually set the grid structure. It will give you the confidence to start using CSS Grid comfortably while understanding the basics of creating grid layouts. 🎨 Codepen demo: https://codepen.io/ZoranJambor/pen/PoajogX 📖 Timestamps 00:00 Intro 00:36 How grid-template-areas property works 03:49 How to adjust the size of grid rows using grid-template-rows property 04:52 How fraction unit (fr) works 06:43 How to specify columns using grid-template-areas 08:47 How to change grid column size using grid-template-columns property 09:33 How to specify space between rows and columns using grid-gap property 10:14 How to create empty cells in CSS Grid using grid-template-areas property 11:28 Quick recap 🔥 Course Mastering Prettier & Stylelint: https://masteringlinting.com/ 🏷 Use coupon YOUTUBE15 to get an additional 15% off on the Masterclass package. Subscribe to CSS Weekly Newsletter: 💌 https://css-weekly.com/ Keep up-to-date with CSS Weekly: 👉 Twitter: https://twitter.com/CSSWeekly 👉 Instagram: https://instagram.com/cssweekly 👉 Facebook: https://www.facebook.com/CSSWeekly/ Keep up to date with what Im up to: 🔗 Blog: https://zoranjambor.com 👉 Twitter: https://twitter.com/zoranjambor 👉 LinkedIn: https://www.linkedin.com/in/zoranjambor/ - Zoran Jambor #css #cssgrid$

Frontend News #12: New attr() Capabilities, CSS Variables in Shorthand Properties, Base64 Data URLs

Start Styling Your console.log() Messages in DevTools

A Practical Guide to Aspect Ratio in CSS