在线 HDR 全景背景生成器

在浏览器中实时设计高动态物理天空、摄影棚打光环境贴图,即时 3D 材质球预览并免费导出标准 Radiance .hdr 文件。

精选场景预设 (Presets)
{{ getPresetName(item.id) }}
{{ getPresetTag(item.id) }}
按住鼠标左键可 360° 旋转场景 | 滚轮缩放
点击图中任意位置可快速放置太阳或光源
☀️ 太阳与光照物理属性
太阳高度角 (Elevation) {{ skyParams.sunElevation }}°
太阳方位角 (Azimuth) {{ skyParams.sunAzimuth }}°
太阳高动态亮度 (Sun Intensity) {{ skyParams.sunIntensity }}x
光盘大小 (Sun Disk Size) {{ skyParams.sunSize }}
大气浑浊度 / 散射 (Turbidity) {{ skyParams.turbidity }}
🎨 环境与天空色彩
天顶 (Zenith)
{{ skyParams.skyZenithColor }}
地平线 (Horizon)
{{ skyParams.skyHorizonColor }}
地面 (Ground)
{{ skyParams.groundColor }}
太阳 (Sun)
{{ skyParams.sunColor }}
💡 摄影棚环境与灯光阵列
暗部环境底色
{{ studioParams.ambientColor }}
环境基础亮度 (Ambient) {{ studioParams.ambientIntensity }}
灯光颜色与强度
{{ light.intensity }}x
亮度 (Intensity) {{ light.intensity }}
光斑大小 (Spread Size) {{ light.size }}°
边缘柔化 (Softness) {{ light.softness }}
🖼️ 导入全景图并增强为 HDR
点击或拖拽全景图到此处
支持 JPG / PNG / WebP 全景展开图 (2:1 比例为佳)
已载入:{{ imageParams.fileName }}
高光动态提升倍率 (Dynamic Range Boost) {{ imageParams.dynamicBoost }}x
太阳亮度 {{ imageParams.sunIntensity }}x
导出 HDRI 文件 (.hdr)
Radiance RGBE (32-bit)

什么是 HDR / HDRI?为什么 3D 渲染离不开它?

HDR(High Dynamic Range,高动态范围图像)HDRI(高动态范围环境贴图) 是一种包含超高亮度范围和物理光强信息的 360° 等距圆柱投影(Equirectangular)图像格式。普通 JPG 或 PNG 图片的像素通道值被限制在 0 ~ 255(0.0 ~ 1.0)的低动态范围(LDR),而真正的 Radiance .hdr 格式采用 32 位浮点 RGBE 编码,能够完整记录太阳表面或发光灯具等高达数十甚至数万倍的超高真实光照强度。

Blender (Cycles/Eevee)、Three.js、Unreal Engine 5、Cinema 4D、Maya、Godot 等现代基于物理的渲染引擎(PBR)中,导入一张制作精良的 HDR 背景环境贴图,可以实现:

  • 真实基于图像的照明 (IBL, Image-Based Lighting):自动为场景中的物体提供 360 度全方位的柔和漫反射环境光与准确的投影阴影。
  • 物理级镜面高光与反射 (Reflections & Highlights):金属、玻璃、车漆等光滑材质能够精确反射周围环境细节与太阳光斑,呈现极具质感的现代三维视觉。
  • 极简场景打光工作流:无需在场景中繁琐放置数十盏补光灯,仅需加载一张 HDR 贴图即可一键获得专业级光影氛围。

如何在线创建 HDR 背景贴图?

传统制作 HDRI 全景图往往需要专业全景相机拍摄多档包围曝光照片并在大型桌面软件中拼接合成。而借助本站的在线 HDR 背景生成器(Online HDR Generator),您只需在浏览器中调节太阳角度、灯光阵列或导入图片,即可在几秒钟内纯前端实时生成物理级精度的高动态全景背景(.hdr),并即时在 3D PBR 材质球上观察光影效果。

🎨 8 大经典场景与光照预设(Lighting Presets)

工具内置了覆盖户外自然、专业摄影棚与科幻特效的精选预设,助您一键快速载入专业级光照环境:

  • ☀️ 日落黄金时刻 (Golden Hour):模拟低角度金橙色夕阳与渐变深蓝天顶,营造温暖柔和的黄昏逆光与修长投影,极具电影级氛围。
  • 🌞 晴朗正午碧空 (Sunny Sky):高角度明亮阳光与纯净的大气瑞利散射,提供高对比度的室外自然硬光,适合建筑漫游与日景渲染。
  • 🌌 深邃暮色星辉 (Deep Twilight):地平线紫红余晖与深邃夜空交融,光比柔和,适合汽车、夜景展台与神秘静物展示。
  • 🌫️ 清晨薄雾初升 (Morning Mist):高浑浊度晨雾漫射光,天空呈现淡雅柔和的奶油色调,呈现清透梦幻的空气感。
  • 💡 经典三点布光棚 (Studio Three-Point):标准摄影主光、冷色辅光与暖色轮廓光三维环绕,立体雕刻模型轮廓,是 3D 角色与道具展示的首选。
  • ⚪ 纯净高光白棚 (Studio Clean White):大尺寸顶棚柔光箱配合正面均匀漫射补光,提供纯粹无杂色的商业电商与工业产品渲染环境。
  • 🟣 赛博朋克霓虹 (Cyber Neon):高饱和青蓝(Cyan)与洋红(Magenta)双色强对比高光,专为科幻机甲、发光物体及潮流艺术打造。
  • 🟢 极光幽绿之夜 (Aurora Night):深蓝星空底色与地平线幽绿极光辉映,为场景赋予神秘奇幻的冷调漫反射微光。

🌐 实时 3D PBR 物理材质球预览(Material Showcase)

视口内置 Three.js 物理着色管线,通过不同特性的标准材质球,让您在导出前即可 360° 全方位检验光影与反射质感:

  • 🪞 光滑镀铬金属球 (Chrome Mirror):极低粗糙度(Roughness 0.02)与 100% 金属度,直观检验环境贴图的清晰度、全景接缝平滑度与太阳强光斑。
  • 🪙 粗糙哑光金属球 (Rough Metal):中等粗糙度(Roughness 0.35),呈现金属在漫反射与各向异性高光之间的质感过渡。
  • 🍶 高光陶瓷漫反射球 (Glossy Ceramic):非金属基础色与清漆高光,直观观察场景阴影柔化度与全局漫反射光照(Diffuse IBL)。
  • 🥨 高光环形结 (Torus Knot):具有多曲面复杂转角,方便观察环境高光在曲面流转时的立体感与自遮挡阴影。

核心特色与技术优势

☀️ 物理大气与太阳光照模拟

基于经典的大气瑞利与米氏散射物理数学模型,实时计算天顶、地平线与太阳角度的渐变过渡,支持动态调整太阳高度角、方位角与光盘耀斑。

💡 摄影棚多点柔光箱打光

自由添加主光、辅光、轮廓光及顶棚柔光箱,自定义每个光源的经纬度位置、色温、高动态亮度与边缘羽化度,非常适合 3D 产品与电商模型渲染。

🌐 3D PBR 材质实时反射预览

内置 WebGL Three.js 实时渲染视口,提供光滑镀铬金属球、粗糙金属球与陶瓷球展示,直观感受 HDR 贴图对物体的真实反光与高光表现。

⚡ 纯前端零延迟与本地隐私安全

所有 HDR 浮点运算与 Radiance RGBE 二进制编码均在您的浏览器本地极速完成,无需上传任何数据到服务器,免费且绝对保护隐私。

如何在 3D 软件中使用本工具导出的 .hdr 文件?

1. 在 Blender 中使用

  1. 打开 Blender,进入右侧 World Properties(世界环境属性) 面板。
  2. 点击 Color(颜色) 旁边的黄色圆点,选择 Environment Texture(环境纹理)
  3. 点击 Open(打开),选择本工具下载的 .hdr 文件。
  4. 将视图着色方式切换为 Rendered(渲染视图) 即可看到全景天空与逼真反射。

2. 在 Three.js Web 项目中使用

使用 Three.js 官方提供的 RGBELoader 即可一行代码快速加载:

import { RGBELoader } from 'three/examples/jsm/loaders/RGBELoader.js';

new RGBELoader().load('your_sky.hdr', (texture) => {
  texture.mapping = THREE.EquirectangularReflectionMapping;
  scene.background = texture;  // 设置场景背景
  scene.environment = texture; // 设置物体 PBR 环境光与反射
});

常见问题解答 (FAQ)

Q: 导出的 .hdr 格式与普通 .jpg 贴图有什么区别? {{ openFaq === 1 ? '▲' : '▼' }}
A: 普通 JPG 图片是 8 位低动态范围(LDR),最大亮度被限制为 1.0(255),无法产生真实强烈的太阳光照与对比阴影。而本工具导出的 .hdr 是 32 位高动态范围格式(Radiance RGBE),太阳和灯光亮度值可以达到 30.0 甚至 100.0 以上,能为 3D 渲染器提供物理级别的强光投射与柔和阴影。
Q: 我应该选择哪种导出分辨率? {{ openFaq === 2 ? '▲' : '▼' }}
A: 如果仅用于场景环境照明(Lighting)和漫反射,1024×512512×256 即可达到极高质感且加载极快;如果场景中有光滑金属镜面反射或作为高清背景直接展示,推荐导出 2048×1024 (2K)4096×2048 (4K)
Q: 生成过程需要消耗服务器带宽或上传图片吗? {{ openFaq === 3 ? '▲' : '▼' }}
A: 完全不需要!本工具所有天空渲染、光照模拟与二进制文件打包都在您的浏览器端通过 JavaScript 实时计算完成,零上传、零等待,完全免费且离线可用。