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 …

Continue reading “CSS Shape Path Editor extension for Chrome DevTools”


This content originally appeared on Bram.us and was authored by Bramus!

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


This content originally appeared on Bram.us and was authored by Bramus!


Print Share Comment Cite Upload Translate Updates
APA

Bramus! | Sciencx (2021-08-27T13:32:50+00:00) CSS Shape Path Editor extension for Chrome DevTools. Retrieved from https://www.scien.cx/2021/08/27/css-shape-path-editor-extension-for-chrome-devtools/

MLA
" » CSS Shape Path Editor extension for Chrome DevTools." Bramus! | Sciencx - Friday August 27, 2021, https://www.scien.cx/2021/08/27/css-shape-path-editor-extension-for-chrome-devtools/
HARVARD
Bramus! | Sciencx Friday August 27, 2021 » CSS Shape Path Editor extension for Chrome DevTools., viewed ,<https://www.scien.cx/2021/08/27/css-shape-path-editor-extension-for-chrome-devtools/>
VANCOUVER
Bramus! | Sciencx - » CSS Shape Path Editor extension for Chrome DevTools. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/08/27/css-shape-path-editor-extension-for-chrome-devtools/
CHICAGO
" » CSS Shape Path Editor extension for Chrome DevTools." Bramus! | Sciencx - Accessed . https://www.scien.cx/2021/08/27/css-shape-path-editor-extension-for-chrome-devtools/
IEEE
" » CSS Shape Path Editor extension for Chrome DevTools." Bramus! | Sciencx [Online]. Available: https://www.scien.cx/2021/08/27/css-shape-path-editor-extension-for-chrome-devtools/. [Accessed: ]
rf:citation
» CSS Shape Path Editor extension for Chrome DevTools | Bramus! | Sciencx | https://www.scien.cx/2021/08/27/css-shape-path-editor-extension-for-chrome-devtools/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts