DIY WiFi RGB LED Mood Light ESP8266 | Random Nerd Tutorials

Skip to content

# $10 DIY WiFi RGB LED Mood Light with ESP8266 (Step by Step)

TIn this project, I’ll show you how you can build your own mood light. You’ll use an ESP8266 to remotely control the color of your light using your smartphone or any other device that has a browser. This project is called $10 DIY WiFi RGB LED Mood Light.

## First, watch the step by step video tutorial below

To learn more about the ESP8266 and RGB LEDs use the following tutorials as a reference:

- How do RGB LEDs work?
- ESP8266 RGB Color Picker
- Getting started with the ESP8266
- ESP8266 web server with NodeMCU
- Flashing NodeMCU firmware
- ESP8266 troubleshooting guide

If you like the ESP and you want to do more projects you can download my eBook Home Automation using ESP8266 here.

Let’s get started!

## Parts List

Here’s the hardware that you need to complete this project:

- 1x ESP8266-12E – read Best ESP8266 Wi-Fi Development Boards
- 1x RGB LED Strip

- 1x 12V Power Supply
- Device to reduce voltage from 12V to 5V
  - Alternative – LM7805 with heat sink
  - Recommended – Step down buck converter module

## [eBook] Home Automation using ESP8266

Build home automation projects with the ESP8266 Wi-Fi dev board using Arduino IDE and Lua firmware DOWNLOAD »

Build home automation projects with the ESP8266 Wi-Fi dev board using Arduino IDE and Lua firmware DOWNLOAD »

- 3x NPN Transistors 2N2222 or equivalent
- 3x 1k Ohm Resistors
- 1x Breadboard
- Jumper wires
- Table Lamp with Mood Light Look

You can use the preceding links or go directly to MakerAdvisor.com/tools to find all the parts for your projects at the best price!

## Flashing Your ESP with NodeMCU

In this tutorial we are going to use the NodeMCU firmware. You have to flash your ESP with NodeMCU firmare.

## Downloading ESPlorer IDE

I recommend using the ESPlorer IDE which is a program created by 4refr0nt to send commands to your ESP8266.

Follow these instructions to download and install ESPlorer IDE:

1. Click here to download ESPlorer
2. Unzip that folder
3. Go to the main folder
4. Run “ESPlorer.jar” file
5. Open the ESPlorer IDE

## Uploading Code

You should see a window similar to the preceding Figure, follow these instructions to upload a Lua file:

1. Connect your ESP8266-12E that has built-in programmer to your computer
2. Select your ESP8266-12E port
3. Press Open/Close
4. Select NodeMCU+MicroPtyhon tab
5. Create a new file called init.lua
6. Press Save to ESP

Everything that you need to worry about or change is highlighted in red box.

## Code

Upload the following code into your ESP8266 using the preceding software. Your file should be named “init.lua“.

Don’t forget to add your network name (SSID) and password to the script below.

IMPORTANT: the embedded script below was made in 2016 and it works with an older version of the Lua firmware. If you’re running a newer version of the Lua firmware, you’ll need to use this script instead: ESP8266_RGB_Color_Picker_New.lua.

## Download our Free eBooks and Resources

Email
Email

    -- Rui Santos
    -- Complete project details at https://randomnerdtutorials.com

    wifi.setmode(wifi.STATION)
    wifi.sta.config("REPLACE_WITH_YOUR_SSID","REPLACE_WITH_YOUR_PASSWORD")

    print(wifi.sta.getip())

    function led(r, g, b)
        pwm.setduty(5, r)
        pwm.setduty(6, g)
        pwm.setduty(7, b)
    end
    pwm.setup(5, 1000, 1023)
    pwm.setup(6, 1000, 1023)
    pwm.setup(7, 1000, 1023)
    pwm.start(5)
    pwm.start(6)
    pwm.start(7)

    srv=net.createServer(net.TCP)
    srv:listen(80,function(conn)
        conn:on("receive", function(client,request)
            local buf = "";
            buf = buf.."HTTP/1.1 200 OK\n\n"
            local _, _, method, path, vars = string.find(request, "([A-Z]+) (.+)?(.+) HTTP");
            if(method == nil)then
                _, _, method, path = string.find(request, "([A-Z]+) (.+) HTTP");
            end
            local _GET = {}
            if (vars ~= nil)then
                for k, v in string.gmatch(vars, "(%w+)=(%w+)&*") do
                    _GET[k] = v
                end
            end
            buf = buf.."<!DOCTYPE html><html><head>";
            buf = buf.."<meta charset=\"utf-8\">";
            buf = buf.."<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">";
            buf = buf.."<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">";
            buf = buf.."<link rel=\"stylesheet\" href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css\">";
            buf = buf.."<script src=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js\"></script>";
            buf = buf.."<script src=\"https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.0.4/jscolor.min.js\"></script>";
            buf = buf.."</head><body><div class=\"container\"><div class=\"row\"><h1>ESP Color Picker</h1>";
            buf = buf.."<a type=\"submit\" id=\"change_color\" type=\"button\" class=\"btn btn-primary\">Change Color</a> ";
            buf = buf.."<input class=\"jscolor {onFineChange:'update(this)'}\" id=\"rgb\"></div></div>";
            buf = buf.."<script>function update(picker) {document.getElementById('rgb').innerHTML = Math.round(picker.rgb[0]) + ', ' +  Math.round(picker.rgb[1]) + ', ' + Math.round(picker.rgb[2]);";
            buf = buf.."document.getElementById(\"change_color\").href=\"?r=\" + Math.round(picker.rgb[0]*4.0117) + \"&g=\" +  Math.round(picker.rgb[1]*4.0117) + \"&b=\" + Math.round(picker.rgb[2]*4.0117);}</script></body></html>";

            if(_GET.r or _GET.g or _GET.b) then
                led(_GET.r, _GET.g,_GET.b)
            end
            client:send(buf);
            client:close();
            collectgarbage();
        end)
    end)

View raw code

## Schematics

Now follow these schematics to create the final circuit.

## Your ESP IP Address

When your ESP8266 restarts, it prints in your serial monitor the ESP IP address. Save that IP address, because you’ll need it later.

In my case, the ESP IP address is 192.168.1.105. If you experience problems seeing your IP read this troubleshooting guide.

You’re all set!

## Opening Your Web Server

Go to any browser and enter the IP address of your ESP8266. This is what you should see:

Click the input field and a small window opens with a color picker. Simply drag your mouse or finger and select the color for your RGB LED strip:

Finally, press the “Change Color” button:

Now, your mood light can be placed in your living room:

Go to the top of this page to see a video demonstration of this project.

## Wrapping Up

This project shows a real world application for the ESP8266 board. If you don’t have an RGB LED strip, but you still want to try this project you can read this blog post ESP8266 RGB Color Picker that changes the color of an RGB LED with an ESP8266.

Do you have any questions? Leave a comment down below!

Thanks for reading. If you like this post probably you might like my next ones, so please support me by subscribing my blog.

## [eBook] MicroPython Programming with ESP32 and ESP8266

Learn how to program and build projects with the ESP32 and ESP8266 using MicroPython firmware DOWNLOAD »

Learn how to program and build projects with the ESP32 and ESP8266 using MicroPython firmware DOWNLOAD »

### Recommended Resources

Build a Home Automation System from Scratch » With Raspberry Pi, ESP8266, Arduino, and Node-RED.

Home Automation using ESP8266 eBook and video course » Build IoT and home automation projects.

Arduino Step-by-Step Projects » Build 25 Arduino projects with our course, even with no prior experience!

### What to Read Next…

### WiFiManager with ESP8266 – Autoconnect, Custom Parameter and Manage your SSID and Password

### Build a Multisensor Shield for ESP8266

### Alexa (Echo) with ESP32 and ESP8266 – Voice Controlled Relay

### ESP8266 Daily Task – Publish Temperature Readings to ThingSpeak

### Nextion Display with ESP8266 – Touchscreen User Interface for Node-RED

### Power ESP8266 with Mains Voltage using Hi-Link HLK-PM03 Converter

### Enjoyed this project? Stay updated by subscribing our weekly newsletter!

Email

### 32 thoughts on “$10 DIY WiFi RGB LED Mood Light with ESP8266 (Step by Step)”

1. Nice presentation. Thanks.

   - Thank you for reading Robert!

2. Looks Easy and clear! Will empty My workarea and listen to your lessons.

   - Awesome! Looking forward to see the final result!

3. Nifty little project! Now, and off the wall question: could this project be converted to use Bluetooth instead of wi-fi? Thanks!

   - I’m glad it was useful Kyle. Yes, this could be controlled with an Arduino that had a bluetooth module attached

4. Lovely ! Very nicely done! I highly appreciate your tutorials !

   - Thank you for reading Mike!

   - You’re welcome Mike!

5. Hello Rui,

   Thank you very much for your great tutorials. I would like to ask you if I could use three MOSFETs instead of BJTs. I would also to ask you about a general “problem” I have. When I reset Esp-01, for example in the case of one led connected at GPIO-02 , blue led remains on and I have to remove this led at GPIO-02 and reset it again to work.

   Thank you in advance

   Panos

   - Rui does look good after his followers, true. If you want to reach out to the global NodeMCU community rather then depending on Rui’s personal feedback I suggest you take a look at nodemcu.readthedocs.io/en/latest/en/support.

6. Nice one

   Please don’t teach your readers bad practice, though!

   wifi.sta.config(…)
   tmr.delay(5000)
   print(wifi.sta.getip())

   Is a no-go for two reasons:
   – tmr.delay() is bad practice and should only be used as a last resort. Also, IIRC the delay must not be more than 50µs. See http://nodemcu.readthedocs.io/en/latest/en/modules/tmr/#tmrdelay for details.
   – wifi.sta.config() is asynchronous and you need to wait until you get an IP address before you can continue, it may very well be more than 5000µs. See http://nodemcu.readthedocs.io/en/latest/en/upload/#initlua for a much better boot sequence.

   - I’ve removed the delay from the code. Thank you Marcel!

     - That ain’t good enough, sorry.
       Without the delay wifi.sta.getip() will print nil because wifi.sta.config() is asynchronous i.e. it won’t block until an IP was assigned. You really need some sort of timer interval as shown in our docs. Alternatively you could use the more modern approach and register for WiFi events, see nodemcu.readthedocs.io/en/latest/en/modules/wifi/#wifistaeventmonreg.

7. Hi can you try an example on how to controlle 5v ws2812b leds and matrix over wifi? or even controle glediator easy via esp8266.

8. Gentlemen Good day
   Some time ago I read an article regarding the control of LEDs. A module was recommended in the article, so I rushed off and bought one:
   Digital TM1638 8 Bits LED Keyboard Scan And Display Module Digital Tube ST
   At the time of reading the article, I thought I had saved the instructions on how to use this module.
   Of course, now I come to look for them…can’t find them. Can you help me please?
   Many thanks
   Michael

   - Hi Michael,
     I don’t recall using or mentioning the TM1638 8 Bits LED and I don’t have any tutorials with that module.

     Thanks for asking,
     Rui

9. cool explanation. Thanks for that.
   One question for a beginner: Why do I have to use a resistor on the gate of the mosfet and how do I have to calculate the size of 1k?

   - That value should work!

10. Nice work. Thanks for sharing this !!!

    - You’re welcome! Thanks,
      Rui

11. Please be aware that the transistors you use are limited to 600mA, this can be an issue with long or power hungry strips.

12. He Rui,

    I have tryed this now on different nodemcu e12 but the sum is always the same.
    It connects to the wifinetwork and I can surf to the page but then …
    It never changes a color of the ledstrip!
    I can click on the color field in the page, change the hex numbers and push the button but the is no action in the ledstrip.
    There is always 0.41 volt on the blue wire. 0.84 on the green and red wire.
    I flashed the nodemcu e12 with : nodemcu_float_0.9.6-dev_20150704 and even let a flash fill make by a thirth party but, like I said before, the sum is always the same.
    Something is wrong but have no clue any more.
    Do you have any idea?

    Greetings,
    Ray.

    - Update.
      if I change (type it in) :http://192.168.xxx.xxx/?r=000&g=000&b=000 (where the xxx.xxx is my ip) in :http://192.168.xxx.xxx/?r=254&g=254&b=254 the values on the nodemcu e12 change!
      Is this browser related?

13. Hi,

    I noticed that this exaple with rgb led only works using Your firmware from August 2016. With new firmware the webserver does not work properly. Of course I have changed ssid and pwd in a table and have the firmware made using the same modules.. The webserver changes colors, but cannot be called anymore by the IP-adress.

    I would be very interested in a solution

    Regards Derek

    - Hi.
      You’re probably right. We haven’t tested this example for a while.
      At the moment we don’t have time to update the code.
      The method to create the web server with the new version of the firmware might be slightly different now.
      So, try to look for a web server example that works with the most recent firmware version and then, try to modify this example to make it work with the new version.
      Regards,
      Sara

14. only my green turns off and red and blue stay on no matter what colour i choose

    - Hi.
      It might be something wrong with your LED strip, or it is not fully compatible with this tutorial.
      Regards,
      Sara

15. Hi

    first of all nice project.
    What do i need to modify to run the same with 24V?
    What are those values and where you get them from?
    pwm.setup(5, 1000, 1023)
    pwm.setup(6, 1000, 1023)
    pwm.setup(7, 1000, 1023)

    - The same values should work with 24V… The ESP will output only 3.3V regardless, so the PWM signals is always the same.

16. That step down converter has IN+, IN-, OUT+ and OUT-, but you only need to connect one cable to the esp and one to the power source. Should they be connected to IN+ and OUT- or how does that work?

    - Hi.
      The OUT- should be connected to the ESP8266 GND. And the and IN- should be connected to GND of your power source.
      Regards,
      Sara

### Leave a Comment Cancel reply

Comment

Name Email Website

Notify me of follow-up comments by email.

Notify me of new posts by email.