# Simple 2D Lighting

**URL:** <https://forum.defold.com/t/simple-2d-lighting/14545>\
**Category:** Questions\
**Created:** [December 11, 2017, 12:43am UTC](https://forum.defold.com/t/simple-2d-lighting/14545 "2017-12-11T00:43:07Z")\
**Posts on this page:** 1\
**Showing post:** 15

<div class="post-metadata">

**Author:** ![britzl](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/britzl/32/23_2.png) [@britzl](https://forum.defold.com/u/britzl)\
**Post date:** [October 30, 2018, 6:04am UTC](https://forum.defold.com/t/simple-2d-lighting/14545/15 "2018-10-30T06:04:40Z")

</div>

> [@stephenkalisch](#):
>
> What about the tutorial or an example project in a clear enviroment? Would be very helpful

It is not that complex although you do need to mess with the render script, a shader and some new materials. The basic idea is this:

**STEP 1 - DRAW NORMAL COMPONENTS TO RENDER TARGET**  
Draw your sprites, tilemaps and any other components you have in your game to a render target (a texture in memory) instead of directly to screen.

 ![58](https://forum-defold-uploads.b-cdn.net/original/2X/a/a22efb8ccf8ed7f533a75b1c59f4f19b527521e9.png)

You create a render target using [`render.render_target()`](https://www.defold.com/ref/render/#render.render_target:name-parameters). You enable it in your render script, draw using the normal render calls, then disable it again. Done!

**STEP 2 - DRAW LIGHTS TO RENDER TARGET**  
Draw your lights to another render target. Clear the render target with a semitransparent black color for some ambient light.

 ![32](https://forum-defold-uploads.b-cdn.net/original/2X/d/dc5b78387a7303b74d507ec7acef8ff53f1eafb7.png)

In this example the lights are circular sprites of various sizes and with increasing transparency.

 ![17](https://forum-defold-uploads.b-cdn.net/original/2X/8/8769262f5bc00f14b863937d3150093567380ba1.jpeg)

They are drawn with a Blend Mode set to Add instead of Alpha.

 ![02](https://forum-defold-uploads.b-cdn.net/original/2X/6/678e625c14e4ed652aeac3110049b082679c9e50.png)

The sprites have a different material assigned than the normal sprite material. The material uses another tag/predicate so that it doesn’t get drawn with everything else in step 1.

 ![52](https://forum-defold-uploads.b-cdn.net/original/2X/4/44883816d850b3017877034dfbf906b9131470bd.png)

**STEP 3 - DRAW A MIX OF BOTH RENDER TARGETS TO A QUAD ON SCREEN**  
Draw a mix of the two render targets to a model component with a quad (a rectangle) and draw it so that it fills the entire screen.

 ![20](https://forum-defold-uploads.b-cdn.net/original/2X/5/557c8be1e2e9b04cbe04cc06082c40df2b3116c9.png)

The quad has a separate material which takes two textures as input parameters and it uses a new tag/predicate so that we can draw it in a separate pass.

Each pixels is a multiplication of the pixel value from the normal graphics and the light. Final result:

 ![35](https://forum-defold-uploads.b-cdn.net/original/2X/4/4d0b13db714706040d37c8869b7b3f6b2a2abfe7.png)

I’ve put it all together in an example here:

CODE: [publicexamples/examples/simple\_lights at master · britzl/publicexamples · GitHub](https://github.com/britzl/publicexamples/tree/master/examples/simple_lights)  
DEMO: [Simple Lights 0.0](http://britzl.github.io/publicexamples/simple_lights/index.html)

---

_[View the full topic](https://forum.defold.com/t/simple-2d-lighting/14545)._
