All ToolsStart a project ↗
Environment workflow

Convert a panorama with the orientation intact

Start with a complete 2:1 equirectangular panorama, convert it into six named faces, then check the horizon and every edge in the destination viewer. Face names alone do not guarantee that two applications use the same orientation.

Open the tool set Talk to XO3D
One panorama, six directionsCheck orientation in the receiving viewer. This PNG workflow does not preserve HDR lighting data.
  1. Full panoramaCheck the 2:1 image, horizon and wrap seam.
  2. Six named facespx · nx · py · ny · pz · nz
  3. Destination checkLook around every join, the horizon and both poles.

Download the direction-labelled test panoramaOriginal XO3D Labs SVG, 2048 x 1024. Use it to check orientation; it contains no HDR lighting data.

The decision

What this solves

A panorama can convert successfully while the skybox is rotated, mirrored, discontinuous or unsuitable for the intended lighting workflow.

Check the projection before converting

A full equirectangular panorama wraps the entire scene into a rectangular image. Its top and bottom represent the poles, so their stretched appearance in a flat image is expected. A cropped photograph, fisheye view or mirror-ball image is a different input and should not be treated as a full panorama.

The Labs converter uses browser image loading and canvas output. Use a supported, browser-readable image. It exports PNG previews; it does not preserve an HDR or EXR lighting pipeline. Keep the original high-dynamic-range source for lighting work and use an appropriate HDR-capable conversion route when that range matters.

Keep the six directions explicit

Keep px, nx, py, ny, pz and nz associated with their positive and negative axes. Three.js CubeTextureLoader expects the sequence positive X, negative X, positive Y, negative Y, positive Z, negative Z. It loads six separate images rather than a single cross layout.

Coordinate conventions vary across applications. Verify orientation using a landmark or a synthetic direction-labelled panorama in the receiving viewer. Renaming faces without checking how that viewer interprets them can move the problem rather than solve it.

Inspect the result as an environment

  • Check that the horizon stays level when turning around the full view.
  • Inspect the seam where the panorama wraps and the joins between cube faces.
  • Look upward and downward for unexpected rotation or missing image areas.
  • Test the result at its intended display size; excessive resolution adds work without necessarily improving the output.
  • Reopen the exported files in the destination application. A correct converter preview is only one stage of the check.

Separate background appearance from lighting

A background image and an image-based light source can serve different purposes. An ordinary PNG may be useful for a background or orientation preview, while lighting requires checking colour handling and the retained intensity range. Projection conversion does not reconstruct highlight energy that the source or export has discarded.

Record the source projection, face size, direction convention, export format and destination viewer beside the files. A small labelled test set is easier to diagnose than a detailed production environment with no orientation reference.

Tools for this task

Start with these tools

Use the tools in order, or jump straight to the one that matches the question in front of you.

Guide tool Cube Map Converter Convert a browser-readable panorama into named faces or reconstruct an equirectangular image. Guide tool 360 Panorama Viewer Inspect a panorama for horizon alignment, poles and the wrap seam. Guide tool HDRI Exposure Calculator Work through exposure relationships separately from image projection conversion.
Workflow

Recommended workflow

The sequence keeps the work practical and reduces the usual guesswork before production.

Inspect the panorama

Use the full panorama to check the wrap seam and level horizon before conversion.

Open tool

Convert and label

Choose the conversion direction and preserve the six axis labels when exporting PNG faces.

Open tool

Recheck the destination

Compare the exported result with the source in its receiving viewer; keep lighting-range decisions separate.

Open tool
Example outcome

A direction-checked set of six PNG faces, with the original panorama retained separately.

Basis and limitations

The face order is grounded in the linked Three.js documentation. The PNG and browser-decoding limitations follow the current Labs converter implementation. Check the intended application and delivery requirements before using a result in production.

Three.js: CubeTextureLoader: Six-image input, face order and coordinate conventions.

Blender: Environment Texture node: Environment projections and image-based lighting.

Common mistakes
  • Treating a cropped panorama as a full 360 view.
  • Assuming a cross-layout image is the same as six face files.
  • Describing a canvas PNG export as preserved HDR lighting data.
Continue your workflow

Choose a supporting asset, read a deeper guide or explore a bespoke studio service.

Studio serviceExplore interactive product experiencesFor a bespoke product experience beyond inspecting an individual file.Labs guideChoose cubemap face dimensionsUse a calculated starting point, then inspect orientation and seams.Labs guideCheck texture memory before exportEstimate decoded memory separately from the download size.
Next pages

Keep going

Create, convert and check PBR texture maps in the browser Create, convert, tile and check PBR texture maps with free browser-based XO3D Labs tools. Fix a normal map before changing the lighting Fix inverted details, seams and weak normal maps. Check colour space, UVs and map type, then test the result with XO3D Labs texture tools. Check a GLB before handing it to a web team Diagnose missing GLB textures, unexpected materials, scale and loading problems with a practical validation and viewer checklist before web or AR handoff.
FAQ

Questions this page answers

Does this converter preserve HDR or EXR data?

The current Labs tool loads browser-readable images and exports through canvas as PNG. Keep the original HDR or EXR source and use a workflow that explicitly preserves its range for lighting.

Why is my skybox rotated or mirrored?

The source orientation or the destination's face convention may differ. Check a known landmark or a direction-labelled test set instead of guessing from filenames.

Can I turn six cube faces back into a panorama?

The Labs converter has a reverse mode for six named faces. Check that each file is in the correct axis slot, then inspect the reconstructed panorama for joins and orientation.

Next step

Talk to XO3D

Bring the product, audience, launch date and required assets. We can help define the creative direction and production scope from there.

Tell us about your brief

Published by XO3D Labs: 2026-09-05

Updated: 2026-09-17

About the studio behind these tools

XO3D is a director-led product CGI studio, and these tools come out of its own production pipeline rather than being built as marketing. We work with tech, industrial and premium consumer brands on product films, launch stills and interactive experiences.

That makes us the right choice for launch-critical work where the visual standard has to be high and the product may not exist yet.

It makes us the wrong choice for three things: hundreds of routine SKUs to a fixed template, a permanently live self-service configurator across a large range, and the campaign idea itself.

How XO3D compares to the other five supplier models Send us a brief