Introduction
Using Sparkle
Elements
You can live preview your website while working. Clicking the “Preview” button on the toolbar opens the preview popup, where you can select one or more browsers to open.
Clicking the “Open Live Preview” button opens the preview service in the selected browsers, the content is regenerated on the fly as you edit the site, so depending on your workflow and screen layout you can choose to open the live preview occasionally or keep the live preview always visible, side by side with the Sparkle window or on a second screen.
Sparkle supports live preview in Safari, Firefox, Chrome, Brave and Edge. If you opt to make the preview available to other computers and devices on the local network, you can use live preview for example on an iOS device as well. The QR Code is a quick way to open preview.
The preview feature works even while offline, except for elements sourced on the web (videos, social, third party code integrations, etc).
If your document contains multiple device layouts, setting "Current device" will display the current device layout regardless of the actual device or browser window width. If you set "All devices" live preview will show the appropriate layout for the device, which lets you have different devices each shown their own layout, but also means you might edit position and size of something that’s not visible on the preview browser.
If your document contains the dark color theme, setting “Canvas Color Theme” will display the currently active color theme regardless of the system. If you set “System Color Theme” the preview will show a site that switches theme according to the current system theme.
If the site has a privacy page and banner, you can show the cookie banner every time a preview page is shown, or never.
Please report any shortcoming in this documentation and we’ll fix it as soon as possible!
This website makes use of cookies.
Please see our privacy policy for details.
It’s Okay
Deny