# Fresnel Parameters

> Learn fresnel parameters in Babylon.js.

Source: https://doc.babylonjs.com/features/featuresDeepDive/materials/using/fresnelParameters

Babylon.js 1.14 introduced new parameters for the StandardMaterial: _FresnelParameters_.

![](https://doc.babylonjs.com/img/how_to/Fresnel/fresnel.webp)

There are 5 of them:

* ```StandardMaterial.diffuseFresnelParameters```
* ```StandardMaterial.opacityFresnelParameters```
* ```StandardMaterial.reflectionFresnelParameters```
* ```StandardMaterial.emissiveFresnelParameters```
* ```StandardMaterial.refractionFresnelParameters```

## How Fresnel Works

A Fresnel term is computed by the StandardMaterial to change how a color is applied based on the viewing angle.

For instance, you can simulate great glass or reflection effects by just using a simple Fresnel term. It gives you more reflection on the edges and less in the center.

To do so, just use this code:

```javascript
material.reflectionFresnelParameters = new BABYLON.FresnelParameters();
```

You can then control if the reflection is applied on the edges or on the center. For instance, if you want the reflection on the edges (by default), you can control it using the color properties:

```javascript
material.reflectionFresnelParameters.leftColor = BABYLON.Color3.White();
material.reflectionFresnelParameters.rightColor = BABYLON.Color3.Black();
```

![](https://doc.babylonjs.com/img/how_to/Fresnel/fresnel01.webp)

Conversely, if you only want reflection in the center:

```javascript
material.reflectionFresnelParameters.leftColor = BABYLON.Color3.Black();
material.reflectionFresnelParameters.rightColor = BABYLON.Color3.White();
```

![](https://doc.babylonjs.com/img/how_to/Fresnel/fresnel02.webp)

By using the ```bias``` and ```power``` properties, you can control how the Fresnel term is computed along the surface of the object according to this formula:

_finalFresnelTerm = pow(**bias** + fresnelTerm, **power**)_

By default, bias == 0 and power == 1.

For instance, the following code:

```javascript
material.reflectionFresnelParameters = new BABYLON.FresnelParameters();
material.reflectionFresnelParameters.leftColor = BABYLON.Color3.Black();
material.reflectionFresnelParameters.rightColor = BABYLON.Color3.White();
material.reflectionFresnelParameters.power = 4;
```

...generates the following rendering:

![](https://doc.babylonjs.com/img/how_to/Fresnel/fresnel03.webp)

## How to use it

A _FresnelParameter_ is defined by the following properties:
* ```isEnabled``` to activate or deactivate the Fresnel effect
* leftColor to define the color used on the edges
* rightColor to define the color used in the center
* bias to define the bias applied to the computed Fresnel term
* power to define the exponent applied to the Fresnel term

Here is a simple example:

```javascript
material.reflectionTexture = new BABYLON.CubeTexture("Scenes/Customs/skybox/TropicalSunnyDay", scene);
material.diffuseColor = new BABYLON.Color3(0, 0, 0);
material.emissiveColor = new BABYLON.Color3(0.5, 0.5, 0.5);
material.alpha = 0.2;
material.specularPower = 16;

// Fresnel
material.reflectionFresnelParameters = new BABYLON.FresnelParameters();
material.reflectionFresnelParameters.bias = 0.1;

material.emissiveFresnelParameters = new BABYLON.FresnelParameters();
material.emissiveFresnelParameters.bias = 0.6;
material.emissiveFresnelParameters.power = 4;
material.emissiveFresnelParameters.leftColor = BABYLON.Color3.White();
material.emissiveFresnelParameters.rightColor = BABYLON.Color3.Black();

material.opacityFresnelParameters = new BABYLON.FresnelParameters();
material.opacityFresnelParameters.leftColor = BABYLON.Color3.White();
material.opacityFresnelParameters.rightColor = BABYLON.Color3.Black();
```

- [Playground: Fresnel Refraction](https://playground.babylonjs.com/#22KZUW#6) - Simple example of using fresnel refraction in your scene.
- [Playground: Fresnel Parameters](https://playground.babylonjs.com/#AQZJ4C#0) - Simple example for you to explore fresnel parameters in your scene.