{"id":25268,"date":"2016-08-18T07:41:41","date_gmt":"2016-08-18T07:41:41","guid":{"rendered":"http:\/\/randomnerdtutorials.com\/?p=25268"},"modified":"2019-04-02T10:23:31","modified_gmt":"2019-04-02T10:23:31","slug":"10-diy-wifi-rgb-led-mood-light-with-esp8266-step-by-step","status":"publish","type":"post","link":"https:\/\/randomnerdtutorials.com\/10-diy-wifi-rgb-led-mood-light-with-esp8266-step-by-step\/","title":{"rendered":"$10 DIY WiFi RGB LED Mood Light with ESP8266 (Step by Step)"},"content":{"rendered":"<p>TIn this project, I\u2019ll show you how you can build your own mood light.\u00a0You\u2019ll 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.<!--more--><span id=\"more-21081\"><\/span><\/p>\n<h2>First, watch the step by step video\u00a0tutorial below<\/h2>\n<p style=\"text-align:center\"><iframe width=\"720\" height=\"405\" src=\"https:\/\/www.youtube.com\/embed\/Ekfu5eQFFMs?rel=0\" frameborder=\"0\" allowfullscreen><\/iframe><\/p>\n<p><strong>To\u00a0learn more about the ESP8266 and RGB LEDs use the\u00a0following tutorials as a reference:<\/strong><\/p>\n<ul>\n<li><strong><a href=\"https:\/\/randomnerdtutorials.com\/electronics-basics-how-do-rgb-leds-work\/\" target=\"_blank\" rel=\"noopener noreferrer\">How do RGB LEDs work?<\/a><\/strong><\/li>\n<li><strong><a href=\"https:\/\/randomnerdtutorials.com\/esp8266-rgb-color-picker\/\" target=\"_blank\" rel=\"noopener noreferrer\">ESP8266 RGB Color Picker<\/a><\/strong><\/li>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/getting-started-with-esp8266-wifi-transceiver-review\/\" target=\"_blank\" rel=\"noopener noreferrer\">Getting started with the ESP8266<\/a><\/li>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/esp8266-web-server\/\" target=\"_blank\" rel=\"noopener noreferrer\">ESP8266 web server with NodeMCU<\/a><\/li>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/flashing-nodemcu-firmware-on-the-esp8266-using-windows\/\" target=\"_blank\" rel=\"noopener noreferrer\">Flashing NodeMCU firmware<\/a><\/li>\n<li><a href=\"https:\/\/randomnerdtutorials.com\/esp8266-troubleshooting-guide\/\" target=\"_blank\" rel=\"noopener noreferrer\">ESP8266 troubleshooting guide<\/a><\/li>\n<\/ul>\n<p>If you like the ESP and you want to do more projects\u00a0you can download\u00a0my eBook <a href=\"https:\/\/randomnerdtutorials.com\/home-automation-using-esp8266\/\" target=\"_blank\" rel=\"noopener noreferrer\">Home Automation using ESP8266 here<\/a>.<\/p>\n<p><strong>Let\u2019s get started!<\/strong><\/p>\n<h2>Parts List<\/h2>\n<p>Here\u2019s the hardware that you need to complete\u00a0this project:<\/p>\n<ul>\n<li>1x<a href=\"https:\/\/makeradvisor.com\/tools\/esp8266-esp-12e-nodemcu-wi-fi-development-board\/\" target=\"_blank\" rel=\"noopener noreferrer\">\u00a0ESP8266-12E<\/a> &#8211; read <a href=\"https:\/\/makeradvisor.com\/best-esp8266-wi-fi-development-board\/\" target=\"_blank\" rel=\"noopener noreferrer\">Best ESP8266 Wi-Fi Development Boards<\/a><\/li>\n<li><a href=\"https:\/\/makeradvisor.com\/tools\/dc12v-rgb-led-strip-ir-remote-controlled\/\" target=\"_blank\" rel=\"noopener noreferrer\">1x\u00a0RGB LED Strip\u00a0<\/a><\/li>\n<\/ul>\n<p><img data-recalc-dims=\"1\" fetchpriority=\"high\" decoding=\"async\" class=\"aligncenter wp-image-25281\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?resize=456%2C256&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"rgb led strip\" width=\"456\" height=\"256\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?w=700&amp;quality=100&amp;strip=all&amp;ssl=1 700w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?resize=150%2C84&amp;quality=100&amp;strip=all&amp;ssl=1 150w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?resize=300%2C168&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?resize=80%2C45&amp;quality=100&amp;strip=all&amp;ssl=1 80w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?resize=220%2C124&amp;quality=100&amp;strip=all&amp;ssl=1 220w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?resize=178%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 178w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?resize=267%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 267w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/rgb-led-strip.png?resize=424%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 424w\" sizes=\"(max-width: 456px) 100vw, 456px\" \/><\/p>\n<ul>\n<li><a href=\"https:\/\/makeradvisor.com\/12v-2a-power-adaptor-dc-jack\/\" target=\"_blank\" rel=\"noopener noreferrer\">1x 12V Power Supply<\/a><\/li>\n<li>Device to reduce voltage from 12V to 5V\n<ul>\n<li>Alternative &#8211; LM7805 with heat sink<\/li>\n<li><strong>Recommended<\/strong> &#8211; <a href=\"https:\/\/makeradvisor.com\/tools\/lm2577lm2596-step-down-buck-converter\/\" target=\"_blank\" rel=\"noopener noreferrer\">Step down buck converter module<\/a><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"aligncenter wp-image-25280\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?resize=401%2C225&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"buck converter\" width=\"401\" height=\"225\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?w=700&amp;quality=100&amp;strip=all&amp;ssl=1 700w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?resize=150%2C84&amp;quality=100&amp;strip=all&amp;ssl=1 150w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?resize=300%2C168&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?resize=80%2C45&amp;quality=100&amp;strip=all&amp;ssl=1 80w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?resize=220%2C124&amp;quality=100&amp;strip=all&amp;ssl=1 220w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?resize=178%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 178w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?resize=267%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 267w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/buck-converter.png?resize=424%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 424w\" sizes=\"(max-width: 401px) 100vw, 401px\" \/><\/p>\n<ul>\n<li><a href=\"https:\/\/makeradvisor.com\/tools\/transistors-npn-pnp-kit\/\" target=\"_blank\" rel=\"noopener noreferrer\">3x <span style=\"font-weight: 400;\">NPN Transistors 2N2222 or equivalent<\/span><\/a><\/li>\n<li><a href=\"https:\/\/makeradvisor.com\/tools\/resistors-kits\/\" target=\"_blank\" rel=\"noopener noreferrer\">3x 1k Ohm\u00a0<span style=\"font-weight: 400;\">Resistors<\/span><\/a><\/li>\n<li><a href=\"https:\/\/makeradvisor.com\/tools\/mb-102-solderless-breadboard-830-points\/\" target=\"_blank\" rel=\"noopener noreferrer\">1x Breadboard<\/a><\/li>\n<li><a href=\"https:\/\/makeradvisor.com\/tools\/jumper-wires-kit-120-pieces\/\" target=\"_blank\" rel=\"noopener noreferrer\">Jumper wires<\/a><\/li>\n<li>Table Lamp with Mood Light Look<\/li>\n<\/ul>\n<p><img data-recalc-dims=\"1\" decoding=\"async\" class=\"aligncenter wp-image-25283\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?resize=518%2C281&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"white lamp\" width=\"518\" height=\"281\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?w=700&amp;quality=100&amp;strip=all&amp;ssl=1 700w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?resize=150%2C81&amp;quality=100&amp;strip=all&amp;ssl=1 150w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?resize=300%2C163&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?resize=80%2C43&amp;quality=100&amp;strip=all&amp;ssl=1 80w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?resize=220%2C119&amp;quality=100&amp;strip=all&amp;ssl=1 220w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?resize=184%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 184w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?resize=276%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 276w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/white-lamp.png?resize=438%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 438w\" sizes=\"(max-width: 518px) 100vw, 518px\" \/><\/p>\n<p>You can use the preceding links or go directly to <a href=\"https:\/\/makeradvisor.com\/tools\/?utm_source=rnt&utm_medium=post&utm_campaign=post\" target=\"_blank\">MakerAdvisor.com\/tools<\/a> to find all the parts for your projects at the best price!<\/p><p style=\"text-align:center;\"><a href=\"https:\/\/makeradvisor.com\/tools\/?utm_source=rnt&utm_medium=post&utm_campaign=post\" target=\"_blank\"><img data-recalc-dims=\"1\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2017\/10\/header-200.png?w=1200&#038;quality=100&#038;strip=all&#038;ssl=1\"><\/a><\/p>\n<h2>Flashing Your ESP with NodeMCU<\/h2>\n<p>In this tutorial we are going to use the NodeMCU firmware.\u00a0You have to\u00a0<a href=\"https:\/\/randomnerdtutorials.com\/flashing-nodemcu-firmware-on-the-esp8266-using-windows\/\" target=\"_blank\" rel=\"noopener noreferrer\">flash your ESP with NodeMCU firmare<\/a>.<\/p>\n<h2>Downloading ESPlorer IDE<\/h2>\n<p>I recommend using the ESPlorer IDE which is a program\u00a0created by 4refr0nt\u00a0to send commands to your\u00a0ESP8266.<\/p>\n<p>Follow these instructions to download and install ESPlorer IDE:<\/p>\n<ol>\n<li><a href=\"http:\/\/esp8266.ru\/esplorer\/#tutorials\" target=\"_blank\" rel=\"noopener noreferrer\">Click here<\/a> to download\u00a0ESPlorer<\/li>\n<li>Unzip that folder<\/li>\n<li>Go to the main\u00a0folder<\/li>\n<li>Run \u201c<strong>ESPlorer.jar\u201d<\/strong> file<\/li>\n<li>Open the ESPlorer IDE<\/li>\n<\/ol>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-5125\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2015\/02\/esplorer-start.png?resize=802%2C598&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"802\" height=\"598\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2015\/02\/esplorer-start.png?w=802&amp;quality=100&amp;strip=all&amp;ssl=1 802w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2015\/02\/esplorer-start.png?resize=300%2C224&amp;quality=100&amp;strip=all&amp;ssl=1 300w\" sizes=\"(max-width: 802px) 100vw, 802px\" \/><\/p>\n<h2>Uploading Code<\/h2>\n<p>You should see a window similar to the preceding Figure, follow these instructions to upload a Lua file:<\/p>\n<ol>\n<li>Connect your ESP8266-12E that has built-in\u00a0programmer to your computer<\/li>\n<li>Select your ESP8266-12E <strong>port<\/strong><\/li>\n<li>Press\u00a0<strong>Open\/Close<\/strong><\/li>\n<li>Select <strong>NodeMCU+MicroPtyhon tab<\/strong><\/li>\n<li>Create a new file called <strong>init.lua<\/strong><\/li>\n<li>Press <strong>Save to ESP<\/strong><\/li>\n<\/ol>\n<p>Everything that you need to worry about or change is highlighted in red box.<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-5126\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2015\/02\/esplorer_tab.png?resize=899%2C650&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"\" width=\"899\" height=\"650\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2015\/02\/esplorer_tab.png?w=899&amp;quality=100&amp;strip=all&amp;ssl=1 899w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2015\/02\/esplorer_tab.png?resize=300%2C217&amp;quality=100&amp;strip=all&amp;ssl=1 300w\" sizes=\"(max-width: 899px) 100vw, 899px\" \/><\/p>\n<h2>Code<\/h2>\n<p>Upload the following code into your ESP8266 using the preceding software. Your file should be named \u201c<strong>init.lua<\/strong>\u201c.<\/p>\n<p><strong>Don\u2019t forget to add your network name (SSID) and password to the script\u00a0below.<\/strong><\/p>\n<p><span style=\"color: #ff0000;\"><strong>IMPORTANT: <\/strong>the embedded script below was made in 2016 and it works with an older version of the Lua firmware. If you&#8217;re running a newer version of the Lua firmware, you&#8217;ll need to use this script instead:\u00a0<strong><a style=\"color: #ff0000;\" href=\"https:\/\/raw.githubusercontent.com\/RuiSantosdotme\/Random-Nerd-Tutorials\/master\/Projects\/ESP8266_RGB_Color_Picker_New.lua\" target=\"_blank\" rel=\"noopener noreferrer\">ESP8266_RGB_Color_Picker_New.lua<\/a>.<\/strong><\/span><\/p>\n<pre style=\"max-height: 40em; margin-bottom: 20px;\"><code class=\"language-c\">-- Rui Santos\n-- Complete project details at http:\/\/randomnerdtutorials.com\n\nwifi.setmode(wifi.STATION)\nwifi.sta.config(&quot;REPLACE_WITH_YOUR_SSID&quot;,&quot;REPLACE_WITH_YOUR_PASSWORD&quot;)\n\nprint(wifi.sta.getip())\n\nfunction led(r, g, b)\n    pwm.setduty(5, r)\n    pwm.setduty(6, g)\n    pwm.setduty(7, b)\nend\npwm.setup(5, 1000, 1023)\npwm.setup(6, 1000, 1023)\npwm.setup(7, 1000, 1023)\npwm.start(5)\npwm.start(6)\npwm.start(7)\n\nsrv=net.createServer(net.TCP)\nsrv:listen(80,function(conn)\n    conn:on(&quot;receive&quot;, function(client,request)\n        local buf = &quot;&quot;;\n        buf = buf..&quot;HTTP\/1.1 200 OK\\n\\n&quot;\n        local _, _, method, path, vars = string.find(request, &quot;([A-Z]+) (.+)?(.+) HTTP&quot;);\n        if(method == nil)then\n            _, _, method, path = string.find(request, &quot;([A-Z]+) (.+) HTTP&quot;);\n        end\n        local _GET = {}\n        if (vars ~= nil)then\n            for k, v in string.gmatch(vars, &quot;(%w+)=(%w+)&amp;*&quot;) do\n                _GET[k] = v\n            end\n        end\n        buf = buf..&quot;&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&quot;;\n        buf = buf..&quot;&lt;meta charset=\\&quot;utf-8\\&quot;&gt;&quot;;\n        buf = buf..&quot;&lt;meta http-equiv=\\&quot;X-UA-Compatible\\&quot; content=\\&quot;IE=edge\\&quot;&gt;&quot;;\n        buf = buf..&quot;&lt;meta name=\\&quot;viewport\\&quot; content=\\&quot;width=device-width, initial-scale=1\\&quot;&gt;&quot;;\n        buf = buf..&quot;&lt;link rel=\\&quot;stylesheet\\&quot; href=\\&quot;https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.6\/css\/bootstrap.min.css\\&quot;&gt;&quot;;\n        buf = buf..&quot;&lt;script src=\\&quot;https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/3.3.6\/js\/bootstrap.min.js\\&quot;&gt;&lt;\/script&gt;&quot;;\n        buf = buf..&quot;&lt;script src=\\&quot;https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jscolor\/2.0.4\/jscolor.min.js\\&quot;&gt;&lt;\/script&gt;&quot;;\n        buf = buf..&quot;&lt;\/head&gt;&lt;body&gt;&lt;div class=\\&quot;container\\&quot;&gt;&lt;div class=\\&quot;row\\&quot;&gt;&lt;h1&gt;ESP Color Picker&lt;\/h1&gt;&quot;;       \n        buf = buf..&quot;&lt;a type=\\&quot;submit\\&quot; id=\\&quot;change_color\\&quot; type=\\&quot;button\\&quot; class=\\&quot;btn btn-primary\\&quot;&gt;Change Color&lt;\/a&gt; &quot;;\n        buf = buf..&quot;&lt;input class=\\&quot;jscolor {onFineChange:'update(this)'}\\&quot; id=\\&quot;rgb\\&quot;&gt;&lt;\/div&gt;&lt;\/div&gt;&quot;;\n        buf = buf..&quot;&lt;script&gt;function update(picker) {document.getElementById('rgb').innerHTML = Math.round(picker.rgb[0]) + ', ' +  Math.round(picker.rgb[1]) + ', ' + Math.round(picker.rgb[2]);&quot;;      \n        buf = buf..&quot;document.getElementById(\\&quot;change_color\\&quot;).href=\\&quot;?r=\\&quot; + Math.round(picker.rgb[0]*4.0117) + \\&quot;&amp;g=\\&quot; +  Math.round(picker.rgb[1]*4.0117) + \\&quot;&amp;b=\\&quot; + Math.round(picker.rgb[2]*4.0117);}&lt;\/script&gt;&lt;\/body&gt;&lt;\/html&gt;&quot;;\n        \n        if(_GET.r or _GET.g or _GET.b) then\n            led(_GET.r, _GET.g,_GET.b)\n        end\n        client:send(buf);\n        client:close();\n        collectgarbage();\n    end)\nend)\n<\/code><\/pre>\n\t<p style=\"text-align:center\"><a class=\"rntwhite\" href=\"https:\/\/github.com\/RuiSantosdotme\/Random-Nerd-Tutorials\/raw\/master\/Projects\/Mood_Light_with_ESP8266.lua\" target=\"_blank\">View raw code<\/a><\/p>\n<h2>Schematics<\/h2>\n<p>Now follow these schematics to create the final circuit.<\/p>\n<p><a href=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?quality=100&#038;strip=all&#038;ssl=1\" target=\"_blank\" rel=\"noopener noreferrer\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-25271\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=655%2C827&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"ESP8266_moodlight_bb\" width=\"655\" height=\"827\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?w=1282&amp;quality=100&amp;strip=all&amp;ssl=1 1282w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=119%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 119w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=238%2C300&amp;quality=100&amp;strip=all&amp;ssl=1 238w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=768%2C969&amp;quality=100&amp;strip=all&amp;ssl=1 768w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=811%2C1024&amp;quality=100&amp;strip=all&amp;ssl=1 811w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=63%2C80&amp;quality=100&amp;strip=all&amp;ssl=1 63w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=174%2C220&amp;quality=100&amp;strip=all&amp;ssl=1 174w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=79%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 79w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=189%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 189w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=329%2C415&amp;quality=100&amp;strip=all&amp;ssl=1 329w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=386%2C487&amp;quality=100&amp;strip=all&amp;ssl=1 386w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESP8266_moodlight_bb.jpg?resize=471%2C595&amp;quality=100&amp;strip=all&amp;ssl=1 471w\" sizes=\"(max-width: 655px) 100vw, 655px\" \/><\/a><\/p>\n<h2>Your ESP IP Address<\/h2>\n<p>When your ESP8266 restarts, it prints in your serial monitor\u00a0the ESP IP address. Save that IP address, because you\u2019ll need it later.<\/p>\n<p>In my case, the\u00a0ESP IP address is <strong>192.168.1.105<\/strong>. If you experience problems seeing your IP\u00a0<a href=\"https:\/\/randomnerdtutorials.com\/esp8266-troubleshooting-guide\/\" target=\"_blank\" rel=\"noopener noreferrer\">read this troubleshooting guide<\/a>.<\/p>\n<p><strong>You\u2019re all set!<\/strong><\/p>\n<p><a href=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?quality=100&#038;strip=all&#038;ssl=1\"><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-25276\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?resize=700%2C373&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"ESPlorer IDE - fixed\" width=\"700\" height=\"373\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?w=700&amp;quality=100&amp;strip=all&amp;ssl=1 700w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?resize=150%2C80&amp;quality=100&amp;strip=all&amp;ssl=1 150w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?resize=300%2C160&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?resize=80%2C43&amp;quality=100&amp;strip=all&amp;ssl=1 80w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?resize=220%2C117&amp;quality=100&amp;strip=all&amp;ssl=1 220w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?resize=188%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 188w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?resize=280%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 280w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/ESPlorer-IDE-fixed-1.png?resize=447%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 447w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/a><\/p>\n<h2>Opening Your Web Server<\/h2>\n<p>Go to any browser and enter the IP address of your ESP8266. This is what you should see:<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-21084 size-full\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?resize=382%2C318&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"RGB color picker main selecting color\" width=\"382\" height=\"318\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?w=382&amp;quality=100&amp;strip=all&amp;ssl=1 382w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?resize=150%2C125&amp;quality=100&amp;strip=all&amp;ssl=1 150w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?resize=300%2C250&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?resize=80%2C67&amp;quality=100&amp;strip=all&amp;ssl=1 80w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?resize=220%2C183&amp;quality=100&amp;strip=all&amp;ssl=1 220w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?resize=120%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 120w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?resize=180%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 180w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/RGB-color-picker-main-selecting-color.png?resize=286%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 286w\" sizes=\"(max-width: 382px) 100vw, 382px\" \/><\/p>\n<p>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\u00a0RGB LED strip:<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-21085 size-full\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?resize=400%2C312&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"selecting color\" width=\"400\" height=\"312\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?w=400&amp;quality=100&amp;strip=all&amp;ssl=1 400w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?resize=150%2C117&amp;quality=100&amp;strip=all&amp;ssl=1 150w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?resize=300%2C234&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?resize=80%2C62&amp;quality=100&amp;strip=all&amp;ssl=1 80w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?resize=220%2C172&amp;quality=100&amp;strip=all&amp;ssl=1 220w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?resize=128%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 128w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?resize=192%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 192w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/05\/selecting-color.png?resize=305%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 305w\" sizes=\"(max-width: 400px) 100vw, 400px\" \/><\/p>\n<p>Finally, press the \u201cChange Color\u201d button:<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-25278\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?resize=700%2C393&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"Browser\" width=\"700\" height=\"393\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?w=700&amp;quality=100&amp;strip=all&amp;ssl=1 700w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?resize=150%2C84&amp;quality=100&amp;strip=all&amp;ssl=1 150w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?resize=300%2C168&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?resize=80%2C45&amp;quality=100&amp;strip=all&amp;ssl=1 80w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?resize=220%2C124&amp;quality=100&amp;strip=all&amp;ssl=1 220w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?resize=178%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 178w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?resize=267%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 267w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/Browser.png?resize=424%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 424w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/p>\n<p>Now, your mood light can be placed in your living room:<\/p>\n<p><img data-recalc-dims=\"1\" loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-25279\" src=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?resize=700%2C393&#038;quality=100&#038;strip=all&#038;ssl=1\" alt=\"living room\" width=\"700\" height=\"393\" srcset=\"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?w=700&amp;quality=100&amp;strip=all&amp;ssl=1 700w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?resize=150%2C84&amp;quality=100&amp;strip=all&amp;ssl=1 150w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?resize=300%2C168&amp;quality=100&amp;strip=all&amp;ssl=1 300w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?resize=80%2C45&amp;quality=100&amp;strip=all&amp;ssl=1 80w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?resize=220%2C124&amp;quality=100&amp;strip=all&amp;ssl=1 220w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?resize=178%2C100&amp;quality=100&amp;strip=all&amp;ssl=1 178w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?resize=267%2C150&amp;quality=100&amp;strip=all&amp;ssl=1 267w, https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/living-room.png?resize=424%2C238&amp;quality=100&amp;strip=all&amp;ssl=1 424w\" sizes=\"(max-width: 700px) 100vw, 700px\" \/><\/p>\n<p><strong>Go to the top of this page to see a video demonstration\u00a0of this project.<\/strong><\/p>\n<h2>Wrapping Up<\/h2>\n<p>This project shows a real world application for the ESP8266 board.\u00a0If you don&#8217;t have an\u00a0RGB LED strip, but you still want to try this project you can read this blog post\u00a0<strong><a href=\"https:\/\/randomnerdtutorials.com\/esp8266-rgb-color-picker\/\" target=\"_blank\" rel=\"noopener noreferrer\">ESP8266 RGB Color Picker<\/a>\u00a0<\/strong>that changes the color of an RGB LED with an ESP8266.<\/p>\n<p><strong>Do you have any questions?\u00a0<\/strong><strong>Leave a comment down below!<\/strong><\/p>\n<p>Thanks for reading. If you like this post probably you might like my next ones, so please support me by <a href=\"https:\/\/randomnerdtutorials.com\/download\">subscribing my blog<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>TIn this project, I\u2019ll show you how you can build your own mood light.\u00a0You\u2019ll use an ESP8266 to remotely control the color of your light using your smartphone or any &#8230; <\/p>\n<p class=\"read-more-container\"><a title=\"$10 DIY WiFi RGB LED Mood Light with ESP8266 (Step by Step)\" class=\"read-more button\" href=\"https:\/\/randomnerdtutorials.com\/10-diy-wifi-rgb-led-mood-light-with-esp8266-step-by-step\/#more-25268\" aria-label=\"Read more about $10 DIY WiFi RGB LED Mood Light with ESP8266 (Step by Step)\">CONTINUE READING \u00bb<\/a><\/p>\n","protected":false},"author":1,"featured_media":25269,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[214,265,240,300,225,250,264,218],"tags":[],"class_list":["post-25268","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-esp8266","category-esp8266-project","category-esp8266-projects","category-0-esp8266","category-home-automation","category-nodemcu","category-project","category-web-server"],"aioseo_notices":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/randomnerdtutorials.com\/wp-content\/uploads\/2016\/08\/thumbnail-mood-light.jpg?fit=1164%2C720&quality=100&strip=all&ssl=1","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/posts\/25268","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/comments?post=25268"}],"version-history":[{"count":0,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/posts\/25268\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/media\/25269"}],"wp:attachment":[{"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/media?parent=25268"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/categories?post=25268"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/randomnerdtutorials.com\/wp-json\/wp\/v2\/tags?post=25268"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}