How to Keep PNG Layers Aligned After Image to PSD Conversion
Your converted PSD looks correctly assembled, but its exported PNG layers land in different places when you import them into another editor. The product shifts toward the center, a decorative shape moves upward, and the shadow no longer sits beneath the object.
To keep PNG layers aligned after image to PSD conversion, preserve a shared canvas size and each object's position within that canvas. Then import the files at the same scale and align their full image rectangles. Matching filenames or visible object sizes does not preserve placement.
This guide starts with a layered document whose composition already looks right. The task is to carry that arrangement into separate files without losing its coordinates.
Why an exported layer can change position
Distinguish the document canvas from the visible content on a layer.
Imagine a 1600 × 900 composition containing a bottle near the right edge. The bottle occupies only a small part of that rectangle. A PNG can retain the entire 1600 × 900 canvas, with transparent space around the bottle, or contain a smaller rectangle tightly surrounding it.
Both files can show the same bottle at the same pixel size. They carry different spatial information. In the full-canvas version, the transparent left margin preserves the bottle's distance from the document's left edge. In the cropped version, that margin is gone.
Photoshop's Trim command can remove surrounding transparent pixels and reduce an image to its nontransparent bounds. That behavior is useful for compact cutouts, but it removes the surrounding space needed for simple reconstruction. See Adobe's canvas and trimming documentation.
There is another trap: increasing the export canvas after isolating an asset can center it. Adobe explicitly documents this behavior for Canvas Size in Export As. A larger export rectangle therefore does not necessarily restore the object's original position. See Photoshop export settings.
Choose the delivery structure first
For a composition that must reassemble in place, use one consistent convention:
- Full-canvas PNGs: every file has identical pixel dimensions, with objects retained at their original positions.
- Cropped PNGs plus placement information: each asset includes its required coordinates and scale in accompanying documentation.
- A layered PSD: keep the arrangement inside one document when the receiving editor supports it.
For a small handoff, full-canvas PNGs are often easier to explain. Cropped assets suit a library where users will arrange objects freely. Avoid mixing those conventions without labeling them.
Image to Layer describes separating images into RGBA layers for further editing. Its download options on the pricing page list PNG and PSD downloads. Those pages establish available formats, but do not specify a guaranteed canvas-padding convention for every generated PNG. Inspect the files you receive before assuming their dimensions or placement behavior.
Establish a reference before exporting
Keep the untouched downloaded result and save a separate working document. Record the actual layered document's width and height in pixels; do not assume they match the uploaded source.
Create a flattened reference of the approved composition for comparison. Keep this reference separate from the assets being exported so it cannot accidentally appear behind every object.
Choose two or three easy landmarks. For the bottle example, use the bottle cap, the bottom of its base, and one corner of a nearby decorative card. These make shifts easier to spot than a soft shadow alone.
Inspect the original stack before proceeding. If the bottle is already misplaced there, exporting cannot correct it. Establish the intended arrangement first.
Export a small test before the whole stack
Start with one object positioned away from the center. A centered object is a poor test because an export that centers everything may appear correct.
Photoshop documents File > Export > Layers to Files for saving layers individually. The dialog includes a destination, filename prefix, visibility filter, and file format. See Adobe's layer export instructions.
Use PNG for the transparent object test and inspect the available format options. If your dialog offers a trimming option, disable it when preserving the full canvas. Do not infer success from the command's name: reopen the output and check its dimensions and margins.
Your test should answer three questions:
- Is the exported rectangle the same pixel size as the working document?
- Is the bottle still the same distance from the top and left edges?
- Is the surrounding area transparent?
A 1600 × 900 file with the bottle newly centered fails the second check, even though its dimensions are correct.
Use document exports when individual-layer exports lose placement
For a short stack, exporting the visible document one asset at a time gives you a straightforward alternative to investigate.
In a working copy, hide the other object layers, the background, and the reference. Leave the intended object visible without moving it or changing the document canvas. Export the document as PNG at its existing pixel dimensions. Reopen that file before repeating the process.
Photopea provides a browser-based version of this approach: open the PSD with File > Open, then use File > Export As > PNG after setting layer visibility. Its documentation also describes File > Save as PSD for preserving the working document structure. See Photopea's opening and saving guide.
Keep the export dimensions unchanged and verify the first result. This suggested workflow is most suitable for independent raster layers. If hiding neighboring layers changes an object's appearance, investigate masks, adjustment layers, or effects that depend on the stack before treating that object as a standalone asset.
Reassemble using image bounds
Create a destination canvas with the same dimensions as the exports. Import every test PNG at the same scale, without applying automatic fit or individual cropping.
Position their full image rectangles at the same canvas origin. In an editor with numeric placement controls, use a consistent reference point, such as the top-left corner. Check whether the controls refer to the imported image rectangle or only its visible content.
For example, placing every full-canvas PNG at the top-left origin of a matching canvas preserves the offsets carried by its transparent margins. Centering each visible object independently discards that relationship.
Restore the layer order as well. Correct coordinates cannot compensate for a background placed above the bottle or a decorative card placed in front when it belongs behind.
Diagnose the remaining mismatch
If files have different dimensions, check for trimming, cropping, or inconsistent export scales.
If dimensions match but objects have moved inside them, compare transparent margins with the working document. Export centering may be responsible.
If objects retain their margins but shift after import, inspect placement anchors and automatic sizing in the destination editor.
If the geometry matches but the appearance differs, investigate visibility, opacity, effects, and layer order before moving anything. A missing shadow can make a correctly positioned object look disconnected from the scene.
Finally, compare the reconstructed stack with the flattened reference at the same dimensions. Check the bottle cap, base, and card corner. Deliver the PNGs with a brief note stating canvas size, placement convention, and layer order. The recipient should be able to rebuild the composition without guessing where each cutout belongs.
