material-shading.html - Basic Example

This example shows how easy it is to create a preview for a PBR material: The individual maps can simply be referenced by appending the image URLs. Additional parameters like the tiling scale are set via the URL as well, but can also be adjusted in real time using the GUI.

https://cdn.pbr.one/main/material-shading.html#
color_url=https://pbr.one/media/bricks_col.jpg&
normal_url=https://pbr.one/media/bricks_nrm.jpg&
roughness_url=https://pbr.one/media/bricks_rgh.jpg&
displacement_url=https://pbr.one/media/bricks_dsp.jpg&
geometry_type=cylinder&
displacement_scale=0.01&
tiling_scale=1.33
				

hdri-exposure.html - Basic Example

This view can be used to see the full dynamic range of an HDRI panorama. Exposure and tone mapping can be controlled dynamically using the GUI.

https://cdn.pbr.one/main/material-shading.html#
environment_url=https://pbr.one/media/park.exr&
environment_exposure=-2&
environment_tonemapping=linear
				

hdri-shading.html - Basic Example

This view renders the HDRI as an actual environment to judge the shading and reflections.

https://cdn.pbr.one/main/material-shading.html#
environment_url=https://pbr.one/media/park.exr
				

texture-tiling.html - Basic Example

This view simply creates a tiled preview of a texture. The preview can be zoomed and dragged around.

https://cdn.pbr.one/main/material-shading.html#
texture_url=https://pbr.one/media/bricks_col.jpg
				

material-shading.html - Advanced Example

Multiple PBR materials can be loaded by specifying multiple maps for every channel. You can use the "Material" dropdown to switch to the other material and the "Environment" dropdown to change the environment.

https://cdn.pbr.one/main/material-shading.html#
material_name=Bricks,Rusty Metal&

color_url=https://pbr.one/media/bricks_col.jpg,https://pbr.one/media/rustymetal_col.jpg&
normal_url=https://pbr.one/media/bricks_nrm.jpg,https://pbr.one/media/rustymetal_nrm.jpg&
roughness_url=https://pbr.one/media/bricks_rgh.jpg,https://pbr.one/media/rustymetal_rgh.jpg&
displacement_url=https://pbr.one/media/bricks_dsp.jpg,https://pbr.one/media/rustymetal_dsp.jpg&
metalness_url=,https://pbr.one/media/rustymetal_met.jpg&

environment_url=https://pbr.one/media/park.exr,https://pbr.one/media/plaza.exr&
environment_name=Park,Nightly-Plaza&

displacement_scale=0.005&
tiling_scale=2&
geometry_type=plane&
geometry_subdivisions=400
				

hdri-exposure.html - Advanced Example

This view can be used to see the full dynamic range of an HDRI panorama. In this example two HDRIs with custom names are loaded which can be selected using the "Environment" dropdown.

https://cdn.pbr.one/main/material-shading.html#
environment_url=https://pbr.one/media/plaza.exr,https://pbr.one/media/park.exr&
environment_name=Nightly Plaza,Park&
environment_exposure=0.5&
environment_tonemapping=linear
				

hdri-shading.html - Advanced Example

This view also supports loading multiple environments. The default HDRI can be set using the environment_index parameter.

https://cdn.pbr.one/main/material-shading.html#
environment_url=https://pbr.one/media/plaza.exr,https://pbr.one/media/park.exr&
environment_name=Nightly Plaza,Park&
environment_exposure=0.5&
environment_index=1&
environment_tonemapping=linear
				

texture-tiling.html - Advanced Example

More than one texture can be loaded to show off all the maps of a PBR material.

https://cdn.pbr.one/main/texture-tiling.html#
texture_url=https://pbr.one/media/bricks_col.jpg,
https://pbr.one/media/bricks_dsp.jpg,
https://pbr.one/media/bricks_nrm.jpg,
https://pbr.one/media/bricks_rgh.jpg,
https://pbr.one/media/bricks_ao.jpg,
texture_name=Color,Displacement,Normal,Roughness,Ambient Occlusion