Currently for free. Windows (64-bit), PS 2015.5 and higher.
How works real-time previews
How to make it work
Install Chrome extension
Install Photoshop extension
Restart Photoshop and Chrome
Make sure that Generator plugins are allowed in Photoshop
Edit > Preferences > Plugins > Enable Generator (other settings does not matter)
If plugin is corectly loaded then you will see gray menu item in: File > Generate > Phantomatic.
This menu item is not clickable and it works only as indicator. Sometimes "Generate" menu item is not available
when you start Photoshop. You have to open some document and wait a while.
Update previews for all images with the same URL on website
Update previews for multiple different images on multiple websites in multiple browser tabs
Https, http, filesystem, dataurl (base64)
PNG, JPG, GIF, BMP
Partly supported: SVG as external file. Rasterized in Photoshop.
On the roadmap for next version
CSS :before and :after pseudo elements
CSS content property with image url
CSS border-image property
CSS list-style-image property
Apply autopreview on newly added website elements
Currently not supported
Multiple urls in background-image CSS property
Formats: WebP, HEIF, TIFF, APNG
Preview image specification
Always lossless PNG 32bit with alfa (transparency)
Preview image is served from "localhost" url. This means that are not served from internet but from your own device.
If Phantomatic is allowed for certain URL then content-security-policy headers are temporary disabled.
Because some website might not allow you to show image from non-whitelisted URLs.
How to control Phantomatic inside Photoshop?
Phantomatic has no user interface in Photoshop. You will create/remove connection via Chrome Extension. Then any change in Photoshop will update image in website automatically.
My name is Jaroslav Bereza. I live in Brno in Czech Republic and I spend about 10 years as web-designer and web developer. I am currently working as full-time Photoshop extensibility developer on private corporate extensions. Anyway I found some time for this side project. :-)