Stylized Water 2 – Underwater Rendering docs

Stylized Water 2 - Underwater Rendering (Extension)

Stylized Water 2 - Underwater Rendering (Extension)
Version: 1.1.0

4.Transparent Materials #

The underwater fog will always render before transparent materials do. This is because the water surface is transparent, and needs to render on top of the underwater fog. Since the water shader uses the same shading function, both the fog and water appear to blend in seamlessly.

This means that any other transparent shader will appear to render completely unfogged. This is in part because it renders on top of the fog, but also because transparent material do not write to the depth texture.

Fog rendering

The effect relies on the depth texture Unity renders, which provides a means to measure the distance from the camera to an object’s pixel on screen. Based on this distance, a certain amount of fog is applied.

As such, shaders that don’t support depth writing will not be affected by fog. This usually means:

  • Transparent materials (water/particles/etc).
  • Sprites.
  • UI elements
  • Details/grass rendered through the terrain system.
  • Custom shaders without a DepthOnly pass.

On these materials, no fog gets applied, because they’re virtually invisible to the effect. The only way around this is to incorporate the fog shading into custom a shader for the above purposes, and using that instead. This is how Unity’s standard fog works, which applies fog directly to an object, rather than as a post-processing effect.

Incorperating underwater rendering into another shader


See this example shader

Shader Graph

Familiarity with Shader Graph is assumed for this section!

The underwater fog is based on the scene depth, to determine how far away a pixel is away from the camera.

Transparent materials do not contribute to the depth texture Unity renders, therefore cannot be affected by fog. The way around this is to calculate the fog directly in the transparent shader. As such, Unity’s built-in shaders will not support this if the material is set to transparent.

As an alternative, use the Universal Render Pipeline/FX/Underwater Particle shader on particle materials that are used underwater (such as the light rays in the demo scene)

In the StylizedWater2/Shaders/Underwater/Shader Graph folder you’ll find all the functionality needed to add support to a transparent shader.

You’ll find two sub-graphs in this folder:

Apply Underwater Fog

This applies the underwater fog in the same way as it’s done in the post processing effect. The input color will be blended with the fog color based on the fog density. The density output (value gets lower/darker further away from the camera) can also be used to multiply the graph alpha value.

The result will be that the material fades out into the fog.

  • The fog color already has lighting applied to it, hence it adds onto the graph’s Emission value, not the albedo. This applies to both Lit and Unlit graphs.
  • For Lit graphs, pipe in the Fog Density output into the Occlusion port on the Master Node. This avoids environment reflections being visible through the fog.

Get Underwater Mask

This mask (in screen-space) is white for the area of the screen that’s underwater, and black for anything above the water. A common usage would be to multiple the alpha value of the graph, so the material’s pixels are only visible underneath the water.

Note: Only the Red color channel has data, the rest is blank.

Graph example

Example for both Lit and Unlit graphs, where the fog color is applied.

Amplify Shader Editor

Use the included Underwater Mask node.

This applies to the COZY and Atmospheric Height Fog assets, since their shaders are authored using ASE.

For example, it can be integrated into COZY’s fog shader, limiting its visibility to pixels above the water:

This node is available starting from v1.1.0

Yes No Suggest edit
Last updated on August 2, 2023
2 of 2 users found this section helpful
Suggest Edit