# Soft shadows from jaggered ones

**URL:** <https://discourse.threejs.org/t/soft-shadows-from-jaggered-ones/57534>\
**Category:** Questions\
**Tags:** shadows\
**Created:** [October 29, 2023, 11:09am UTC](https://discourse.threejs.org/t/soft-shadows-from-jaggered-ones/57534 "2023-10-29T11:09:58Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![arjun\_lokesh](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/arjun_lokesh/32/39767_2.png) [@arjun\_lokesh](https://discourse.threejs.org/u/arjun_lokesh)\
**Post date:** [October 29, 2023, 11:09am UTC](https://discourse.threejs.org/t/soft-shadows-from-jaggered-ones/57534/1 "2023-10-29T11:09:58Z")

</div>

I am getting harsh shadows and I’ve tried to blur it apparently its not working is there like a simple blur option which i can use to get softer shadows.

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/6/c/6c2eca20f4668af940618433d58e83c110ab76f2.jpeg)  
Baking is not an option for me.

the code for creating a transparent shadow receiving plane and the dlight is mentioned below.  
const planegeo = new THREE.CircleGeometry(2.5,128);  
const planemat = new THREE.ShadowMaterial( { opacity : .1 } );  
planemat.opacity = 0.5;

//creating a circle mesh and and applying it to the geometry  
const planemesh = new THREE.Mesh(planegeo, planemat);  
planemesh.rotation.x = -0.5 \* Math.PI;  
planemesh.receiveShadow = true;  
scene.add(planemesh);

//initializing the direction light and making it cast shadow  
const dlight = new THREE.DirectionalLight(0xffffff, 3);  
dlight.position.set(3, 6, 7);  
dlight.castShadow = true;  
dlight.shadow.radius = 15;  
scene.add(dlight);

//softening the shadow and specifying the bouding box  
dlight.shadow.mapSize.width = 1024;  
dlight.shadow.mapSize.height = 1024;  
dlight.shadow.camera.near = 0.5;  
dlight.shadow.camera.far = 500;  
dlight.shadow.radius = 3;

---

<div class="post-metadata">

**Author:** ![seanwasere](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/seanwasere/32/20864_2.png) [@seanwasere](https://discourse.threejs.org/u/seanwasere)\
**Post date:** [October 29, 2023, 11:39am UTC](https://discourse.threejs.org/t/soft-shadows-from-jaggered-ones/57534/2 "2023-10-29T11:39:48Z")

</div>

try  
`renderer.shadowMap.type = THREE.VSMShadowMap`  
E.g.,  
Soft Shadows : [https://sbcode.net/threejs/soft-shadows/](https://sbcode.net/threejs/soft-shadows/)  
[![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/6/0/6074b16ef9ba869fb6b7ea3e5bedee91fd542ccb.png)](https://sbcode.net/threejs/soft-shadows/)

---

<div class="post-metadata">

**Author:** ![Chaser\_Code](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/chaser_code/32/20199_2.png) [@Chaser\_Code](https://discourse.threejs.org/u/Chaser_Code)\
**Post date:** [October 29, 2023, 12:06pm UTC](https://discourse.threejs.org/t/soft-shadows-from-jaggered-ones/57534/3 "2023-10-29T12:06:36Z")

</div>

```javascript
dlight.shadow.mapSize.width = 2048;
dlight.shadow.mapSize.height = 2048;

```

---

<div class="post-metadata">

**Author:** ![Quan\_Le](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/quan_le/32/36133_2.png) [@Quan\_Le](https://discourse.threejs.org/u/Quan_Le)\
**Post date:** [October 30, 2023, 2:38am UTC](https://discourse.threejs.org/t/soft-shadows-from-jaggered-ones/57534/4 "2023-10-30T02:38:54Z")

</div>

`dlight.shadow.bias` = 0.0001

[https://threejs.org/docs/#api/en/lights/shadows/LightShadow.bias](https://threejs.org/docs/#api/en/lights/shadows/LightShadow.bias)