CSS Shape Path Editor extension for Chrome DevTools

The Firefox DevTools come with a built-in editor to manipulate CSS Shapes, as demonstrated by Miriam Suzanne in the video below.


For the Chromium-based browsers (Google Chrome, Microsoft Edge, …) the DevTools currently sport no such thing. Thankfully there’s an extension that can provide it for us. Once installed you’ll get an extra Shapes panel that lists all shapes. Clicking one will activate its edit mode.

Crazy to see this extension dates back to 2014 already! 😱

CSS Shapes Editor Chrome Extension →


🌟 I’ve filed Issue #1244072 over at the Chromium Bug Tracker to see this feature get built-int into the DevTools themselves. Star it if you would also like to see it.

Via Adam

About the author

Bramus is a Freelance Web Developer from Belgium. From the moment he discovered view-source at the age of 14 (way back in 1997), he fell in love with the web and has been tinkering with it ever since (more …)

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.