Editor preferences
Choose the interface theme, the panel style, where the settings panel sits, handles, tooltips and favourite widgets.
Editor preferences change how the editor looks and behaves for you. They do not change your site or what other users see.
Open the preferences
Open the Uncoder menu in the top-left corner and choose Preferences…, or press Ctrl+K and choose Editor preferences. Click Done (or press Esc) to close the dialog. Changes apply immediately.
Settings
| Setting | What it does | Default |
|---|---|---|
| Interface | Paper (light) or Petrol night (dark) look for the editor itself. Your pages are not affected. | Paper |
| Panel style | Islands: rounded panels with space around them. Edge to edge: panels fixed to the window edges. | Islands |
| Settings panel | Where the inspector sits: Left (next to the build panel), Right, or Floating where you drag it. See Move the inspector. | Left |
| Panel follows the selection | Selecting an element opens Layers; selecting an empty container opens Insert. Turn it off if you prefer the left panel to stay where you put it. | On |
| Spacing handles on the canvas | Drag padding, margin, gap and column width directly on the selected element. | On |
| Tooltips on hover | Shows the names and shortcuts of buttons when you hover them. Keyboard focus and the ⓘ icons always show them. | On |
| Favourite widgets | Shows how many widgets you pinned to the top of Insert, with a Clear button to unpin them all. |
Interface, Panel style and Settings panel are saved in this browser. The other settings and your favourites are saved to your user account, so they follow you to any browser.
You can also switch the interface and the panel style from the Uncoder menu (Petrol night (dark) interface, Edge-to-edge panels) or the command palette. In windows narrower than 1280 px, the panels go edge to edge automatically.
Spacing handles
With Spacing handles on the canvas on, the selected element shows small handles:
- Padding: on the inner edges. Drag into the box to add padding. Hold Shift to change all sides, Alt to change two opposite sides.
- Margin: above and below the element. Drag away from the box.
- Gap: between the first two items of a flex container.
- Width: on a column inside a row. It snaps to ¼, ⅓, ½, ⅔ and ¾; hold Alt for any width.
A label shows the value while you drag. Values are set for the device you are editing. See Spacing, size & position.