Measurements
Upgrade to Phoenix Code Pro to access this feature.
The Measurements feature displays ruler lines extending from the edges of a selected element to the edges of the Live Preview document, with labels showing exact pixel positions. This helps you position elements more accurately.
Ruler lines appear in blue for editable elements and gray for non-editable (dynamically created) elements.
Enabling Measurements
To enable measurements, click the mode selector dropdown in the Live Preview toolbar and select Show Measurements. By default, this option is unchecked.
Alternatively, you can enable measurements from the More Options menu (three-dots icon) in the Tool Box. Select Show Measurements to toggle it on or off.
You can also change this setting by updating the livePreviewShowMeasurements preference in the preferences file. Set it to true or false (default).
See Editing Preferences to learn how to edit the preferences file.