DEV Community

Renato Byrro for Dashbird

Posted on

Hack your Frontend with document.designMode

document.designMode is a cool feature.

Perhaps not a very well known feature, hence this heads-up ;)

By enabling it in console (document.designMode = 'on'), you can edit and experiment with a page content right from the browser.

No need to change code on IDE.
No refresh.
Just live, fresh mangling. yay!

Check it out:

document.designMode in action on Dev.to

Read more on Mozilla docs.

Top comments (3)

Collapse
 
prashantandani profile image
Prashant Andani •

Wow.... Din't know this exist...

Collapse
 
byrro profile image
Renato Byrro Dashbird •

Yeah, cool isn't it?

Can be very handy, especially when one needs to tweak the content (text/img) and see how it looks right upfront.

Have fun!

Collapse
 
garador profile image
Garador •

Holy sh*t