Divide documents into slices for web export in Pixelmator Pro on Mac
You can divide an image into multiple pieces—or slices—and export them with their own settings. This technique is often used in web and interface designs that require modular components optimized for specific uses. For example, you may need to export website buttons in one image format and logos in another.
In Pixelmator Pro, you can create slices from layers or groups containing multiple layers in your document. Alternatively, you can slice layers manually. Each slice is optimized with the settings you choose.
Slice a document manually
In Pixelmator Pro on Mac, click
in the toolbar, then choose Export for Web.
Drag over an area on the canvas to make a slice, then drag again to make additional slices.
As you make slices, Pixelmator Pro automatically adds guides in the canvas to suggest additional slice areas. Each slice is also listed in the Export for Web pane.
To quickly create additional slices without dragging, Control-click any area outside of the existing slices in the canvas, then choose Promote to Slice.
To modify the export settings for each slice, select a slice in the Export for Web pane, then adjust the export settings.
Tip: Select multiple slices in the Export for Web pane to adjust their settings together.
Do either of the following:
Export all slices: Click Export.
Export only selected slices: Select one or more slices in the Export for Web pane, then Control-click one of the slices, and choose Export.
Create a slice from a layer or layer group
In Pixelmator Pro on Mac, click
Drag a layer or group from the Layers sidebar to the top of the Export for Web pane.
The layer is inserted as a slice. You can drag additional layers to the Export for Web pane to create more slices.
To modify the export settings for a slice, select a slice in the Export for Web pane, then adjust the export settings.
Do either of the following:
Export all slices: Click Export.
Export only selected slices: Select one or more slices in the Export for Web pane, then Control-click one of the slices, and choose Export.
Tip: You can combine slices cut by hand with layer slices.
Edit a slice
After you add a slice, you can edit it.
In Pixelmator Pro on Mac, click
Do any of the following:
Move a slice: Drag a slice in the canvas to a new location.
Resize a slice: Select a slice in the canvas, then drag one of its black handles.
Rename a slice: In the Export for Web pane, double-click a slice, enter a new name, then press Return.
Change the stacking order of a slice: In the Export for Web pane, drag a slice to a new position in the list. You can also Control-click a slice in the canvas, then choose Bring to Front, Bring Forward, Send Backward, or Send to Back.
Delete a slice: Control-click a slice, then choose Delete Slice.
Delete all slices: Control-click in the canvas, then choose Clear Slices.