LiveEdit HTML and CSS

With the LiveEdit plugin, open HTML and CSS in Chrome, over HTTP, and see updates as you save.

PyCharm Professional bundles WebStorm and, with the optional LiveEdit plugin, makes it easy to see HTML and CSS updates as you save them.

Once you install the LiveEdit plugin, go to an HTML file and create a Debug configuration. You can do this with a right-click. This opens a private Chrome session with the flag to turn on Chrome's DevTools protocol. This lets PyCharm Professional "remote control" the browser, using an actual HTTP URL.

As you type and save HTML and CSS, you'll see the changes in the browser.

In previous versions, PyCharm needed a special extension in Chrome to allow this remote-control feature. That's no longer true.


Related Resources

Navigation Bar - All the power!
Navigation Bar - All the power!
The Navigation Bar can do much more than you think!
Clean Up Messy Imports With Optimize Imports
Clean Up Messy Imports With Optimize Imports
Quickly remove any unused imports and more.
Find in Path with the Navigation Bar
Find in Path with the Navigation Bar
Use the Navigation bar and Find in File together and be faster than all of your team members.