Welches Skybox-Format? Equirectangular vs. Cubemap vs. HDRI

Kurzfassung

Wenn deine Zielplattform Unity URP/HDRP, Unreal 5 oder modernes WebGL ist, nimm Equirectangular (2:1 PNG/EXR). Wenn das Ziel die alte Unity-Built-in-Pipeline ist, eine mobile GPU ohne hochpräzises Panorama-Sampling oder eine Three.js-Szene mit Cube-Reflexionen, dann konvertiere zu Cubemap (6 Faces). HDRI (.hdr/.exr) nimmst du nur dann, wenn du einen echten IBL-Beleuchtungsbeitrag brauchst – nicht bloß einen Hintergrund. Alle drei Formate beschreiben dieselbe Szene – der Unterschied liegt allein darin, wie die Pixel entpackt werden.

Eine praktische Faustregel: Wenn deine Engine einen "Panoramic"- oder "HDRI Backdrop"-Skybox-Shader eingebaut hat und du auf einer modernen GPU läufst, bleib bei Equirectangular und überspring den Konvertierungsschritt komplett. Du verlierst nichts und hältst die Pipeline schlank. Cubemaps sind die richtige Antwort, wenn Engine oder Hardware dich dazu zwingen – nicht, weil du einem alten Tutorial aus der Unity-5-Ära folgst.

Panorama generieren →

Panorama zu Cubemap konvertieren →

Die drei Formate auf einen Blick

Alle drei Formate stellen dieselben zugrunde liegenden Daten dar: eine 360°×180°-Ansicht einer Umgebung. Der Unterschied liegt rein darin, wie diese sphärischen Daten in eine Datei abgeflacht werden und wie die GPU oder der Renderer sie zur Laufzeit wieder entpackt. Ein equirektangulares Panorama und eine Cubemap, die aus derselben Quelle erzeugt wurden, sind mathematisch äquivalent – dieselben Photonen, andere Geometrie. HDRI fügt eine dritte Dimension hinzu: lineare Pixel mit hohem Dynamikumfang statt gamma-kodierter 8-Bit-Werte. Wenn du diese drei Dimensionen (Layout, Geometrie, Bit-Tiefe) verstanden hast, hast du das ganze Thema durchschaut.

Equirectangular (2:1-Panorama)

Equirectangular ist das Standardformat, um eine vollständige 360°-Umgebung in einer einzigen Datei zu speichern. Der Name stammt von der gleichnamigen Kartenprojektion: Der Längengrad wird auf die horizontale Achse abgebildet, der Breitengrad auf die vertikale Achse, und das Ergebnis ist ein Rechteck im Seitenverhältnis 2:1. Ein Bild mit 4096×2048 Pixeln ist 360° breit und 180° hoch – ein perfektes Abbild der Kugel, die es repräsentiert.

Die Projektion erzeugt eine vorhersehbare Verzerrung. In der Nähe des Äquators (der vertikalen Bildmitte) sind die Pixel dicht gepackt und proportional. In der Nähe der Pole (obere und untere Kante) werden die Pixel stark gestreckt – ein einzelnes horizontales Pixelband nahe dem oberen Bildrand repräsentiert auf der Kugel vielleicht nur 1° vertikalen Bogen, bekommt aber genauso viele Pixel wie ein Band nahe dem Äquator, das 10° überspannt. Deshalb sehen als Equirectangular generierte Himmel oben und unten unscharf aus, wenn man sie flach betrachtet – auf eine Kugel gemappt oder in einem Skybox-Shader verwendet sehen sie jedoch korrekt aus.

Für moderne Engines ist diese Polverzerrung kein Problem. Der Skybox-Shader übernimmt das UV-Remapping intern. Unitys Panoramic-Skybox-Shader, Unreals HDRI-Backdrop-Actor, Babylon.js und Three.js' EquirectangularReflectionMapping akzeptieren alle direkt 2:1-Equirectangular und erledigen das Sphere-Mapping auf der GPU. Du gibst der Engine ein Bild; um alles andere kümmert sie sich.

Vorteile: Eine einzige Datei. In jedem Bildbetrachter lässt sie sich inspizieren. Von modernen Tools breit unterstützt. Leicht in Photoshop oder GIMP zu bearbeiten, falls du Nähte ausbessern musst. Das Standard-Ausgabeformat von KI-Panorama-Generatoren, 360°-Kameras und den meisten Environment-Painting-Tools. Jede equirektangulare Datei kannst du im Online-360-Panorama-Viewer prüfen – ohne Installation.

Nachteile: Die Polverzerrung erschwert das Handmalen. Kein natives Format für Legacy- oder mobile GPUs. Manche älteren Reflection-Probe-Workflows erwarten Cubemaps. Ein hochauflösendes Equirectangular (etwa 8192×4096) verschwendet einen Großteil seines Pixelbudgets an den übersampelten Polen.

Für die meisten Workflows im Jahr 2026 ist Equirectangular der richtige Ausgangspunkt. Konvertiere nur dann, wenn das Zielsystem wirklich Cubemap-Input verlangt.

Für einen tieferen Blick auf das Format selbst siehe Was ist ein equirektangulares Bild?.

Cubemap (6 Faces)

Eine Cubemap stellt die Umgebung als sechs quadratische Faces dar: positiv X, negativ X, positiv Y, negativ Y, positiv Z, negativ Z – oder schlicht: rechts, links, oben, unten, vorne und hinten. Jedes Face ist ein normaler perspektivischer Render mit 90° Bildwinkel. Setzt du alle sechs zusammen, hast du eine vollständige Kugel, keine Polverzerrung und eine gleichmäßige Pixeldichte über die gesamte Oberfläche.

Namenskonventionen

Die sechs Faces folgen je nach Engine oder Tool unterschiedlichen Namenskonventionen. Hier die vier gängigsten:

Ein falscher Face-Name ist die mit Abstand häufigste Ursache für kopfstehende oder spiegelverkehrte Skyboxen. Im Zweifel lädst du jedes Face einzeln und prüfst die Orientierung, bevor du im Batch weitermachst. Der Cubemap-Generator lässt dich beim Export die Namenskonvention wählen, sodass du ohne manuelles Umbenennen genau das triffst, was deine Engine erwartet.

Wo Cubemaps glänzen

Legacy-Unity (Built-in Render Pipeline): Unitys Built-in-Pipeline stammt aus einer Zeit vor der breiten Unterstützung für Panorama-Sampling-Shader. Das Standard-6-Sided-Skybox-Material erwartet sechs separate Texturen, eine pro Face. Wenn du ein Mobile-Game auf der Built-in-Pipeline auslieferst – oder ein Projekt pflegst, das älter als URP ist –, ist Cubemap deine einzige praktikable Option, ohne das Skybox-System neu zu schreiben.

Unreal Cube Render Target: Die Reflection-Capture-Actors und Cube Render Targets von UE5 sind nativ Cubemap-basiert. Wenn du Reflexionen in ein statisches Level backst oder einen Reflection-Probe-Workflow baust, arbeitest du auf Engine-Ebene mit Cubemaps – selbst wenn du equirektangulare Assets importiert hast.

Three.js CubeTextureLoader: Three.js' CubeTextureLoader erwartet sechs Dateien. Wenn du eine WebGL-Szene mit THREE.CubeReflectionMapping für environment-gemappte Materialien baust, brauchst du einzelne Face-Dateien. THREE.EquirectangularReflectionMapping ist die Alternative für moderne Setups, aber CubeTextureLoader ist in vielen Starter-Templates immer noch der Standard.

Mobile-GPU-Performance: Auf schwächerer Android-Hardware kann Panorama-Sampling aus einer einzelnen 2:1-Textur teurer sein als das Sampling aus einer Cubemap, weil die GPU pro Fragment die UV-Projektion berechnen muss. Eine vorab gebackene Cubemap verlagert diese Rechnerei auf die Ladezeit. Auf modernen Mittelklasse-Handys ist der Unterschied klein, macht sich bei Budget-Hardware im großen Maßstab aber bemerkbar.

Vorteile: Gleichmäßige Pixeldichte – keine verschwendete Auflösung an den Polen. Natives Format für Reflection Probes. Pflicht bei Legacy-Pipelines. Vorhersehbares Face-Layout, das Artists per Hand bemalen können.

Nachteile: Sechs Dateien zu verwalten. Uneinheitliche Namenskonventionen über die Engines hinweg. Nähte zwischen den Faces erfordern beim Handmalen sorgfältige Beachtung. Mehr Konvertierungsschritte, wenn deine Quelle equirektangular ist.

Du kannst jedes 2:1-Equirectangular über unseren Cubemap-Generator im Browser in eine Cubemap umwandeln – reines Frontend, kein Upload, kostenlos.

HDRI (High Dynamic Range Image)

HDRI steht für High Dynamic Range Image. Der Teil "High Dynamic Range" ist das entscheidende Wort. Ein normales 8-Bit-PNG speichert 256 diskrete Werte pro Kanal, mit einem typischen Dynamikumfang von etwa 2–3 Blendenstufen. Ein 32-Bit-Float-HDRI speichert Fließkommawerte von nahe null bis zu Zehntausenden – ein Dynamikumfang von 20+ Blendenstufen. Praktisch gesagt: Die Sonne in einem echten Outdoor-HDRI ist 100.000× heller als der tiefe Schatten unter einem Auto, und die Datei behält dieses Verhältnis exakt bei. Wenn du eines lieber aus einem Text-Prompt generieren willst, statt es aufzunehmen, gibt der AI HDRI Generator direkt eine Radiance-.hdr aus.

Genau dieses Verhältnis macht HDRI für Image-Based Lighting (IBL) besonders nützlich. Wenn ein Renderer eine HDRI-Environment-Map für diffuse und spekulare Beiträge sampelt, nutzt er die tatsächlichen Luminanzwerte aus der Datei, um realistische Lichtreflexionen und Glanzlichter zu berechnen. Eine helle Sonne in einem echten HDRI erzeugt ein scharfes Glanzlicht auf einer polierten Oberfläche. Dieselbe Szene als 8-Bit-LDR gespeichert erzeugt ein ausgefressenes, flaches Glanzlicht – der Renderer behandelt den gesamten Himmel als annähernd gleich hell, weil die Datei den Unterschied nicht abbilden kann.

Dateiformate

Die zwei dominanten HDRI-Container sind:

• Radiance .hdr (auch RGBE genannt): Ein altes Format, das Greg Ward in den 1980ern entwickelt hat. Speichert 32-Bit-Werte als 8-Bit-Mantisse + gemeinsamer 8-Bit-Exponent pro Pixel (RGBE-Kodierung). Breit unterstützt von Blender, Substance Painter, Marmoset und den meisten DCC-Tools. Kleinere Dateien als EXR. Das vom AI HDRI Generator erzeugte Format.
• OpenEXR .exr: Der moderne Standard für Visual Effects und High-End-Rendering. Echtes 16-Bit- oder 32-Bit-Float pro Kanal, ohne den Kompromiss eines gemeinsamen Exponenten. Unterstützt Multi-Layer-, Multi-Part- und Tiled-Formate. Bevorzugt in VFX-Pipelines, unterstützt von Blender Cycles und Unreal Engines HDRI Backdrop mit .exr-Input.

HDRI vs. Backdrop – eine ehrliche Unterscheidung

Viele Game-Dev-Inhalte verwischen die Grenze zwischen "HDRI-Skybox" und "HDRI-Beleuchtung". Das ist nicht dasselbe. Wenn du nur einen optisch schönen Himmel hinter deinem Level willst und dich nicht auf die Environment-Map für den Beleuchtungsbeitrag verlässt, brauchst du kein echtes HDRI. Ein 8-Bit-LDR-Equirectangular-Panorama sieht bei einem Bruchteil der Dateigröße genauso gut aus. Der Himmel ist ein Hintergrund; er braucht keine 32-Bit-Präzision.

Echtes HDRI brauchst du, wenn:

• Deine physikalisch basierten Materialien präzise Glanzlichter von einer dominanten Lichtquelle (Sonne, Flächenlicht, Neonschild) brauchen.
• Du weiches, gerichtetes Licht aus der Environment-Map willst, ohne explizite Lichter zu setzen.
• Du Look-dev oder Produktvisualisierung machst, bei der Belichtungsgenauigkeit zählt.
• Du für Virtual Production eine real fotografierte Umgebung matchst.

Eine ehrliche Anmerkung zu KI-generiertem HDRI

KI-Panorama-Generatoren – auch unser eigener AI HDRI Generator – erzeugen 8-Bit-LDR-Pixel. Das Ergebnis wird dann in einen Radiance-.hdr-Container verpackt, was es technisch zu einer "HDRI-Datei" macht. Aber die Pixeldaten sind weiterhin 8-Bit, tone-gemappt und gamma-kodiert. Die Sonne in einem KI-generierten Himmel ist nicht 100.000× heller als die Schatten – sie liegt höchstens 3–4 Blendenstufen über Neutral, genau wie bei jedem 8-Bit-Bild.

Was das in der Praxis bedeutet: AI HDRI ist hervorragend für weiches Ambient-IBL, Stimmungsführung, fiktive Innenräume und Backdrop-Vielfalt. Es liefert dir plausibel wirkende Glanzlichter aus hellen Himmelsregionen. Es liefert dir nicht das scharfe, physikalisch präzise Sonnen-Glanzlicht, das ein per Belichtungsreihe fotografiertes HDRI von Poly Haven bietet. Beide sind nützlich. Mach dir vorher klar, welches du brauchst.

Für echtes HDR nimm Poly Haven (CC0, real fotografiert, exzellente Qualität) oder Lumiere für Studio-HDRIs. KI-Generierung nimmst du für Geschwindigkeit, Menge und fiktive Umgebungen.

Konvertierungswege

Die Konvertierungswege zwischen den Formaten zu verstehen erspart dir unnötige Hin- und Rückkonvertierungen und verlustbehaftete Operationen.

Equirectangular → Cubemap ist die häufigste Richtung. Optionen:

• Cubemap-Generator (browserbasiert, kostenlos, kein Upload nötig, unterstützt alle vier Engine-Namenskonventionen)
• Blender Compositor: einen Equirectangular-Node nutzen, der sechs Renders mit einem Cube-Projection-Kamera-Setup speist
• panorama-to-cubemap npm-Paket: eine JavaScript-Bibliothek, die in Node.js läuft und einzelne Face-PNGs ausgibt

Cubemap → Equirectangular ist seltener, aber manchmal nötig (z. B. wenn du nur Cubemap-Assets hast und die Umgebung in einem Panorama-Editor bearbeiten musst). Optionen: Photoshop (mit dem Perspektivisch-verformen-Werkzeug und manuellem Zusammensetzen, mühsam, aber möglich), Blender (Kamera-Rig-Rendering), ImageMagick mit einer eigenen Transformationsmatrix. Diese Richtung wird von unseren Browser-Tools aktuell nicht unterstützt – sie steht auf der Roadmap, falls die Nachfrage kommt, aber die Mathematik ist im Browser-Kontext ohne WebGL-Compute deutlich komplexer.

8-Bit-LDR-PNG → HDR-Container: Unser AI HDRI Generator verpackt das LDR-Panorama in eine Radiance-.hdr-Datei, damit Blender, Unreal und Unity HDRP es ohne Konvertierungsschritte auf deiner Seite einlesen können. Die Pixelwerte bleiben 8-Bit-LDR. Eine echte HDR-Aufnahme – ein wirklicher Dynamikumfang von 20+ Blendenstufen – erfordert Belichtungsreihen-Fotografie (5–7 Belichtungen, zusammengeführt in Lightroom oder PTGui) oder das Rendern in einem physikalisch basierten Renderer mit korrektem Kameramodell. Es gibt keinen algorithmischen Weg, echtes HDR aus einem einzelnen 8-Bit-Quellbild zurückzugewinnen.

Welches Format solltest du nehmen?

Nutzt du URP / HDRP / UE5 / WebGL / eine moderne Engine?
├─ Ja → Nutze Equirectangular. Die Engine verarbeitet es nativ.
└─ Nein → Bist du auf Unity Built-in (Legacy) oder Mobile?
    ├─ Ja → Konvertiere zu Cubemap.
    └─ Nein → Machst du IBL-Beleuchtung (nicht nur Backdrop)?
        ├─ Ja → Nutze HDRI (echtes 32-Bit, z. B. Poly Haven).
        └─ Nein → Bleib bei Equirectangular.

Schnellreferenz pro Engine:

• Unity URP: Panoramic-Skybox-Material. Nutze Equirectangular (PNG oder EXR). Eine Datei, keine Konvertierung.
• Unity HDRP: HDRI-Sky-Volume-Komponente. Für Beleuchtung equirektangulares EXR oder HDR; für reinen Hintergrund equirektangulares PNG.
• Unity Built-in: 6-Sided-Skybox-Material. Nutze Cubemap (6 Faces). Konvertiere mit unserem Cubemap-Generator.
• Unreal Engine 5: HDRI-Backdrop-Actor. Nutze equirektangulares HDR/EXR. Für Lumen zieht Unreal die Environment-Map für den indirekten Beleuchtungsbeitrag heran – hier verwendest du für beste Ergebnisse echtes HDRI.
• Blender Cycles: World-Shader mit Equirectangular-Environment-Texture-Node. Nutze equirektangulares HDR/EXR. Die Bit-Tiefe beeinflusst direkt die Qualität der Glanzlichter auf reflektierenden Materialien.
• Blender Eevee: Gleiches Node-Setup wie Cycles. Eevee nutzt intern Reflection-Cubemaps, aber der Input ist weiterhin equirektangular – Eevee backt seine eigenen Cubemaps beim Laden der Szene daraus. Du musst keine Cubemap manuell liefern.
• Three.js: EquirectangularReflectionMapping für moderne Setups (ein equirektangulares PNG/HDR) oder CubeTextureLoader für Legacy-Setups (6 Face-Dateien). Bei einem neuen Projekt nimm Equirectangular – das vereinfacht die Asset-Pipeline deutlich.
• WebXR / A-Frame: Die a-sky-Komponente akzeptiert Equirectangular. Sowohl 360°-Bildbetrachter als auch vollständige VR-Szenen nutzen dasselbe Format. Keine Cubemap nötig, es sei denn, du implementierst einen eigenen Reflection-Shader.

Häufige Fallstricke

1. Sichtbare Nahtstelle. Equirektangulare Panoramen laufen an der linken/rechten Kante nahtlos um. Wenn die Pixelzeile am linken Rand nicht zur Pixelzeile am rechten Rand passt, bekommst du einen sichtbaren vertikalen Streifen in deiner Skybox. Das passiert am häufigsten, wenn KI-Generierung zufälliges Rauschen oder Vignettierung an den Bildrändern einführt. Der Skybox-Generator enthält einen Prompt-Rewriter und eine Generierungs-Pipeline, die speziell darauf getrimmt sind, Naht-Artefakte zu minimieren – das Modell ist darauf konditioniert, nahtlos umlaufende Himmel zu erzeugen. Wenn du stattdessen mit einem allgemeinen Bildmodell generierst, hilft ein manueller Fix in Photoshop: versetze das Bild horizontal um 50 %, überblende die Naht in der neuen Bildmitte weich (Übergang retuschieren), versetze dann zurück.

2. Falsche Cubemap-Face-Orientierung. Jede Engine erwartet die Faces in einem anderen Koordinatensystem und mit anderer Händigkeit. Unity nutzt ein linkshändiges Y-up-Koordinatensystem; Unreal nutzt ein linkshändiges Z-up-System. Dasselbe Cubemap-Asset kann in verschiedenen Engines gespiegelte oder gedrehte Ergebnisse liefern. Der sicherste Workflow ist, engine-spezifische Namenskonventionen zu verwenden und jedes Face als einfache Textur zu laden und zu prüfen, bevor du die finale Skybox zusammensetzt. Unser Cubemap-Generator beschriftet die Ausgabe explizit mit der von dir gewählten Konvention, sodass die Exporte für Unity, Unreal, Three.js und Blender jeweils die korrekte Face-Orientierung bekommen.

3. 8-Bit-Inhalt als HDR behandelt. Ein 8-Bit-PNG-Equirectangular als World Environment Texture in Blender Cycles zu laden, funktioniert technisch – Blender akzeptiert es –, aber du bekommst keine physikalisch plausiblen Glanzlichter von der Sonne. Die Datei hat schlicht nicht genug Dynamikumfang. Blender presst jedes Pixel in dasselbe schmale Band, und deine Glanzlichter werden weich und detaillos. Wenn deine Szene von der IBL-Qualität abhängt, brauchst du echte HDR-Quelldaten. Das gilt genauso für KI-generierte .hdr-Dateien: Das Containerformat ist HDR, aber der Inhalt kann LDR sein. Prüfe das Histogramm in deinem DCC-Tool, bevor du dich auf eine HDRI-Quelle festlegst.

4. Auflösungs-Mismatch zwischen Quelle und Cubemap-Face-Größe. Wenn du ein 1024×1024-Cubemap-Face aus einem 2048×1024-Quell-Equirectangular extrahierst, sampelst du pro Face aus rund 512×512 Pixeln nutzbarer Quelldaten (der Rest geht an benachbarte Faces). Das Ergebnis wirkt blockig, besonders an den Face-Ecken, wo die perspektivische Verzerrung am größten ist. Faustregel: Die Breite deines Quell-Equirectangular sollte mindestens 4× deiner gewünschten Cubemap-Face-Größe betragen, um saubere Ergebnisse zu bekommen. Für ein 1024×1024-Face startest du mit einem 4096×2048-Equirectangular. Für ein 2048×2048-Face (die Qualitätsobergrenze für die meisten Game-Anwendungsfälle) nimmst du eine 8192×4096-Quelle.

Generiere deine erste Skybox

Wenn du bei null startest, ist der schnellste Weg, deine Umgebung in natürlicher Sprache zu beschreiben und direkt ein equirektangulares Panorama zu generieren. Der Skybox-Generator erledigt Prompt-Optimierung, nahtlosen Übergang an den Bildrändern und 2:1-Ausgabe in einem Schritt. Die generierten Bilder lassen sich ohne jede Konvertierung direkt in Unity URP, HDRP, Unreal 5 oder jede WebGL-Szene übernehmen.

Wenn dein Ziel eine Legacy-Pipeline oder eine mobile Engine ist, die sechs Cubemap-Faces verlangt, schick die Ausgabe durch den Cubemap-Generator. Wähle die Namenskonvention deiner Engine (Unity, Unreal, Three.js oder Blender), lade das Zip herunter und importiere. Die gesamte Pipeline – von der Generierung bis zur Cubemap – läuft im Browser, ohne Server-Upload.

Speziell für IBL-Beleuchtung schau dir den AI HDRI Generator für den Radiance-.hdr-Export an. Denk an den LDR-Vorbehalt von oben: Nutze ihn für weiches Umgebungslicht und Stimmung, ergänze ihn für harte Glanzlicht-Präzision um Assets von Poly Haven.

Weiterführende Lektüre

• Was ist ein equirektangulares Bild?
• AI HDRI für Blender, Unreal und Unity
• So schreibst du Prompts für KI-360°-Panoramen