# Shadows are pixelated/boxy?

**URL:** <https://discourse.threejs.org/t/shadows-are-pixelated-boxy/27165>\
**Category:** Questions\
**Tags:** shadows\
**Created:** [June 11, 2021, 6:15pm UTC](https://discourse.threejs.org/t/shadows-are-pixelated-boxy/27165 "2021-06-11T18:15:48Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![UI\_UNICORN](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ui_unicorn/32/9842_2.png) [@UI\_UNICORN](https://discourse.threejs.org/u/UI_UNICORN)\
**Post date:** [June 11, 2021, 6:15pm UTC](https://discourse.threejs.org/t/shadows-are-pixelated-boxy/27165/1 "2021-06-11T18:15:48Z")

</div>

Hi So i am trying to cast some shadows on to a plane but the result is that the shadws look boxy/ pixelated is there a setting i am missing?  
here’s a pen (long load time):

https://codepen.io/uiunicorn/embed/preview/gOmBRvd?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=gOmBRvd

---

<div class="post-metadata">

**Author:** ![marquizzo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/marquizzo/32/25192_2.png) [@marquizzo](https://discourse.threejs.org/u/marquizzo)\
**Post date:** [June 11, 2021, 7:17pm UTC](https://discourse.threejs.org/t/shadows-are-pixelated-boxy/27165/2 "2021-06-11T19:17:26Z")

</div>

That looks like shadow acne. You might be looking for [`shadow.bias`](https://threejs.org/docs/?q=shadow#api/en/lights/shadows/LightShadow.bias) or [`shadow.normalBias`](https://threejs.org/docs/?q=shadow#api/en/lights/shadows/LightShadow.normalBias).

---

<div class="post-metadata">

**Author:** ![UI\_UNICORN](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ui_unicorn/32/9842_2.png) [@UI\_UNICORN](https://discourse.threejs.org/u/UI_UNICORN)\
**Post date:** [June 11, 2021, 8:33pm UTC](https://discourse.threejs.org/t/shadows-are-pixelated-boxy/27165/3 "2021-06-11T20:33:49Z")

</div>

So i’ve played around with those and here is the result:

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/4/6/4670438570234a6344fce308c8073fb8955b8399.jpeg)

here is what i’m aiming for:

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/1/7/17411bebf25d6aad3666f8143b2c9639d77fba6f.jpeg)

as you can see the shadow thats behind any idea’s?

---

<div class="post-metadata">

**Author:** ![dllb](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/dllb/32/19191_2.png) [@dllb](https://discourse.threejs.org/u/dllb)\
**Post date:** [June 12, 2021, 6:11am UTC](https://discourse.threejs.org/t/shadows-are-pixelated-boxy/27165/4 "2021-06-12T06:11:34Z")

</div>

Something like this?

 ![directional_light](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/2/020f3935737dec67c085ca38ac49b5c5bd429f89.jpeg)

https://codepen.io/dllb/embed/preview/mdWzxgz?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=mdWzxgz

I’d just use a directional light which is cheap, (probably along with a hemishpere light), people don’t need much to be satisfied. I have adjusted the light position, the shadow’s resolution, and the ambient to soften the shadow. But if you want a fallout, you might want to experiment with one spotlight (less is more).

---

<div class="post-metadata">

**Author:** ![UI\_UNICORN](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ui_unicorn/32/9842_2.png) [@UI\_UNICORN](https://discourse.threejs.org/u/UI_UNICORN)\
**Post date:** [June 12, 2021, 6:14pm UTC](https://discourse.threejs.org/t/shadows-are-pixelated-boxy/27165/5 "2021-06-12T18:14:55Z")

</div>

That is absolutely perfect !