Skybox, in video games, is a cube that wraps the entire scene. The Skybox can render the atmosphere of the entire environment and express the environment of the entire scene. The Skybox is also a very important part in the PBR-based workflow.

The Skybox in Cocos Creator 3D, is shown below:


Enabling Skybox

Enabling the Skybox effect in Cocos Creator 3D, takes just one step:

  • The Skybox panel is on the Scene node's Properties panel. Check the Enabled property to enable the Skybox. Open skybox

    Note: When the Envmap property of Skybox is empty, the default pixel map will be used and displayed.

Modify the environment map of the Skybox

Modifying the environment map of the Skybox in Cocos Creator 3D is done by setting a asset of type TextureCube. Importing from a asset into a TextureCube and setting it into a Skybox can be done in the following steps:

  1. Import picture assets.

    Note: This example is of a panorama. Creating a CubeMap is covered later in this documentation.

  2. Select the imported panorama asset and set it to the TextureCube type in the Inspector panel on the right, as shown in this figure:

    Set as TextureCube

  3. Drag the TextureCube asset to the Envmap property on the Skybox's Inspector Panel.

    Set the environment map of the skybox

After completing the above steps, you should be able to see the newly replaced environment map in the editor scene.

Confirm setting the SkyIllum parameter

If the skybox doesn't show in the Scene Editor after completing the previous step, it is highly likely that the SkyIllum parameter setting is too low. Check the parameter of ambient -> SkyIllum in the Inspector Panel of the scene node. Generally speaking, if SkyIllum < 300, the skybox texture is not very visible. SkyIllum is 5000 is probably the light intensity of the moon at night. For a newly created Cocos Creator 3D project, the default SkyIllum is 20000.

Modify the Clear Flag of Camera

After completing the above steps, although the skybox can be displayed correctly in the Scene Editor, it is still not visible when running. At this time, you need to modify the Clear Flag of Camera to SKYBOX, as shown below

change Clear Flag of Camera to SKYBOX

Skybox panel

skybox panel

The following describes all the properties of the Skybox panel:

Properties Explanation
enabled whether to enable Skybox
envmap environment map, type is TextureCube
isRGBE whether the pixel format of the environment map is RGBE
useIBL whether to use ambient light


CubeMap is a kind of environment map asset for a Skybox. It is composed of map assets of six faces on a cube. It can be used as a TextureCube asset.

Making and applying a CubeMap

To make a CubeMap in Cocos Creator 3D and set it to a Skybox, follow these steps:

  1. Import the six texture map assets prepared in advance, and set these texture assets to the Texture type.

    import Cubemap textures create Cubemap textures type

  2. Create a new CubeMap resource

    create Cubemap

  3. Drag the imported texture assets into the corresponding input box, and click the green check button when you are finished.

    Set CubeMap

  4. Finally, drag the completed CubeMap asset into the Envmap property box of the Skybox.


Note: Faces that are not mapped in CubeMap. It will be filled with a default texture.

Note: The pictures associated with the TextureCube should not be the same. Otherwise, there will be a problem that some platforms will not display it.

Continue to the Global Fog documentation.

results matching ""

    No results matching ""