5 Lesser-known Features of Chrome DevTools

Improve Your Chrome DevTools Workflow With These Tips

1. toggle classes

Go to .cls tab and toggle the classes

2. scroll to view

Are you going through HTML and don’t know where the particular thing is on the page? Well, just scroll that into view!

3. Create and run code snippets

Do you want to run some javascript code, but the code is too big and pasting that into console feels weird? Well, you can create code snippets and run that snippet!

4. Adding classes and auto-suggestion

When you add a class using the .cls tab, it suggests similar classes that exist in the CSS, which quickly lets you compare them

5. designMode

Edit everything directly by turning on the designMode

That’s all folks!

Hope you find one or two new things that can improve your dev tools workflow. Cheers!