ESP32 Smart light
A system that is powered by ESP32 and controls 2 LED strips and a neopixel ring using clapping and the web!
Created by
mavory
Tier 4
10 views
0 followers
mavory
submitted ESP32 Smart light for review ago
Iamalive 🚀
requested changes for ESP32 Smart light ago
Wait this is actually so well journed and made! Love how it looks in the end :) If you can just add a wiring diagram that shows how everything is connected, that should be good!
mavory
submitted ESP32 Smart light for review ago
mavory
added to the journal ago
ESP32 Smart Light it is finished!!!
A system that is powered by ESP32 and controls 2 LED strips and a neopixel ring using clapping and the web!

Why did I do this?
I wanted to create a system that could be controlled using my new Big sound module, so I started thinking and came up with this interesting idea!
Features
- Web interface
- It has a buzzer and an RGB LED for notification
- You can clap to turn the lights on/off
- You have a neopixel ring that you can set up to 10+ mods on
Scripts
In total, the script has about 650 lines, but the website, functions,...It´s only in this script. So just upload it via Arduino IDE to ESP32 and everything should work!!
Home page:

How it works?
- Clap control: 1x clap toggles the LED strip!! 2x claps toggle the ring and 3x claps change the ring mode
- Physical button: 1x click toggles the LED strip, 2x click changes brightness (strip), 3x click swaps ring modes. Long press turns the system On/Off
- Web UI: Change 12 ring modes (Matrix, Fire, Rainbow, etc.), 3 strip effects, and brightness
- Status LED: Shows WiFi status and gives color feedback (Green/Red/Blue) when you change settings
- Auto Demo: Randomly cycles through all ring effects every 10 seconds....
Libraries:
- Adafruit_NeoPixel.h
- OneButton.h
- WiFi.h
- WebServer.h
- Preferences.h
3D models
Here is a view of the top and bottom of the case:


Circuit and Wiring Diagram


Here is the PDF format for download: ESP32
mavory
added to the journal ago
GitHub editing
After exporting I started uploading files to the repo and also started writing README.md which is very important. I also had to make a journal file where everything is described.
Next I made a video of how it works and uploaded it to YouTube...

mavory
added to the journal ago
Preparing things for the GitHub repo
When I was slowly finishing my project, I started making BOM and preparing things for export to GitHub.
I tried to find the cheapest things with cheap shipping and I also had to convert my 3D models from .STL to .STEP via convector.
I also exported the file for ESP32 and prepared everything in a folder for upload!!

mavory
added to the journal ago
Circuit diagram is finished!!
When I added the symbols, I started connecting the components with the ESP32. The microphone took me the most time because I forgot to connect it, so I had to find it on the internet (the 3D case was already closed).
So I finished the last part, rotated a few symbols and renamed the project.

mavory
added to the journal ago
Circuit diagram in KiCad
After finishing the 3D case, I moved on to the schematic, which I always do in KiCad. At first, I was thinking about what pins I would use mainly for the mosfet, but I decided to use normal...
I then gradually inserted all the components and also prepared the connection symbols.

mavory
added to the journal ago
Finishing the case
As I wrote before, I still had to finish the case to make it perfect. I added a little glue at one point because the top part was peeling off a little, but that's it.
I also took some finer grit sandpaper and sanded the case a little in some places because there were still some glue residue, some bumps, etc.

mavory
added to the journal ago
Language editing
To make the page readable for everyone, I had to edit the code one last time by rewriting the main logic into English. It only took me about half an hour and I'm happy for it!

mavory
added to the journal ago
Website completion!
After a few hours I finished the website!
It took me a long time to get it up and running, but I managed to do it... I had to rework the logic of the operation. First I thought about adding a "Demo Mode" that would constantly cycle through all the modes, and I managed to do that!
I also fixed the buttons and added "live fetch" which works as follows:
- I press, for example, a button on the case that turns on the light and on the website the button status also changes to on.
This was probably the most difficult part of the editing, because I was mostly editing and looking for errors that were there.

mavory
added to the journal ago
Continuing to create the website
When I had a finished but non-functional website, I decided to completely redo it.
I deleted the code and started from scratch... I was thinking about what look to use and decided to use white and blue with a touch of minimalism!
I gradually added buttons, sliders, selections,.... until I came to a functional website that could control my system - But it had one flaw:
- When I wanted to turn something off/on via the button and then turn it on/off via the website, the website threw me nonsense and nothing worked...
I was missing something there...

mavory
added to the journal ago
Creating a website for the system
I decided that I would like to use one more cool feature of ESP32 - WiFi!
So I thought about how to create a website, but so that it works... At first I thought that I could put buttons and sliders on the website, that was just the beginning, but unfortunately when I created the page, the system did not work, so later I had to start again and with a better look!

mavory
added to the journal ago
The 3D case is ready!!!
After a long time I finished the 3D case and glued everything.
At first the holders for the LED strips didn't hold together, so I had to sand them down first and then try to glue them...

I guess the most difficult thing was to somehow straighten it out and do it right, because before I always had it either too far forward or too far back. So now it's level, but I still have to sand it a little to fine-tune the straightness.

mavory
added to the journal ago
Gluing the upper part of the holder
When I had some time, I started gluing the first part of the strip holder.
I thought it would be easy, but it wasn't possible at all... At first, I just applied glue to the holder and tried to let it dry - but it didn't work. I had to take a stronger glue and started adding from both sides. It was better, but it still wasn't enough (it was falling to the sides, etc).
So I put a big dose of glue on top and held it for about 20 minutes, then I turned it over and started adding glue from the other side again and it helped! We just applied glue a few times, maybe it held even more, but now I'm satisfied.
.jpg)
mavory
added to the journal ago
Continuing coding!!
I continued coding and decided that I would like to add some mods for the ring and also to dim the led strip.
I achieved this by adding a OneButton function to the code, which was there before, but I didn't use it that much.
I also added the ability to clap multiple times and here's what it means:
- 1x = turns the led strips on/off
- 2x = turns the neopixel ring on/off
-
3x = changes the sew mode of the neopixel ring
mavory
added to the journal ago
Start of coding
In the meantime, I decided to start making a code. Before that, it was just a test code to see if everything works, and now we're going to the master code!
At first, I didn't know how to code it, but gradually I started thinking of various other things to improve it...
So far, the code can only turn the led strip on and off (1x) and clap twice to turn the ring on/off.

mavory
added to the journal ago
Remodeling :(
When I got the new piece printed, I was amazed at how it still let in light even though I had enlarged the wall by about 50%...
So I went back into the program and added a few more millimeters and hopefully it will be good. Next, I put on the holder for the LED strips and it works very well so far!

mavory
added to the journal ago
Thickness error
I thought it would work fine, but here came a small problem...
When I tried the strips and turned them on on the 3D holder, the light was shining through from one side where it shouldn't.
So I went back into the program and reworked it to be thicker and not let in light. I also adjusted the fill to 100% in BambuLab studio and added 3 wall perimeters.
.jpg)
mavory
added to the journal ago
Top printing
In my free time I started printing the upper part of the 3D case. Then I took it, modified it again with a knife, sandpaper and removed the supports where I did research for a good removal of the supports and it worked! Anyway, here is an example:


I took some quick-drying glue and some isopropyl alcohol, which I used to clean everything so that there was no grease and it would stick well...
I applied a small amount of glue to the neopixel ring and stuck it into the hole for the neopixel just mentioned.

mavory
added to the journal ago
Inserting components into the case!!
After successfully modifying the case, I started putting the breadboard and components into the case. I had a few problems that occurred to me:
- I turned the breadboard the wrong way around, so I had to take it all out and put it back in, because only one side has a hole for the button, which is placed from the side... đź’€
- I took out the components a few times to put the cables under them, so that everything would fit nicely into the case
- I also had to disconnect the mosfet and thread the cable through the hole so that the LED strips could be powered.
Otherwise, I did the case and things like that well, because the cables fit perfectly in there.

mavory
added to the journal ago
Removing supports and strange things
After printing the bottom part I started removing the supports. I also had to take a knife and cut off the little bumps it made near the holes...
Once I had it, I took some sandpaper and started sanding the case to make it look a bit nicer.

mavory
added to the journal ago
Groove for LED strip
Once I had the 3D case finished, I started working on the groove for the led strip.
First I had to create a bracket that would connect to the 3D case and the groove would be inserted into it.
I was thinking about what design to choose and decided on a regular "U" style where the strip would be glued.

mavory
added to the journal ago
Finishing the top and bottom of the 3D case
After a short break I started making the 3D case again...
I didn't know exactly how I was going to make the top part, but I decided to make a hole at the top for adding LED strips later. It took me a while and I think it will need some more work anyway... The hardest part was probably finding the right place for the neopixel ring.

mavory
added to the journal ago
Measurement error!
When I was checking how to make a large hole for the neopixel ring, I also looked at the website of the store where I bought it and they wrote completely different things there... So I decided that I would continue with my sizes anyway, but I would adjust the case to 100x100mm, and if everything would fit there.

mavory
added to the journal ago
The beginning of 3D modeling
After measuring and writing down all the sizes, I moved to TinkerCad. I created a new project and started creating.
I thought about what shape I would make and decided on a circle because I could easily insert the neopixel ring there and everything would fit nicely.
I took a piece of paper with the sizes and started calculating how big I would make it... I decided that the total circle would be 90x90mm and then I continued with the hole.
Later I also started making the top lid, into which the mined ring will be inserted:

mavory
added to the journal ago
Component measurement
Before coding, I started modeling.
As I always say, TinkerCad is the easiest and easiest to learn for me, so I chose this program again, but before I started, I had to measure all the components to make sure they fit and add small deviations to them.

mavory
added to the journal ago
Testing component connections
When I finished soldering, I started testing the mosfet and neopixel ring.
At first, the ring didn't work because I didn't connect it properly to the GND common, but I fixed that mistake. The LED strip worked beautifully and for the first time in my life it even dimmed!

mavory
added to the journal ago
Soldering!!
After successfully connecting the components, I moved on to soldering the cables and soldering the mosfet!
At first I was wondering how to connect the mosfet, but later I found documentation that explained nicely how to connect GND and PWM...
Soldering cables:
I cut the cables and then removed the protection. I tinned the cables on all sides and later I was done.

Soldering the mosfet:
When I had the cables ready, I moved on to the aforementioned mosfet, but I was wondering what cables to use for the connection... I decided to use standard jumpers, but without headers.

mavory
added to the journal ago
Connecting components to small breadboards
After testing everything I decided to start connecting everything to the breadboard. I didn't want to use the huge one, so I decided to use these 2 small ones and connect them.
At first I didn't know how the pins were connected and I found out that they were in rows...
First I had a problem that I couldn't fit all the things on GND, so I thought about how to connect it. I took a jumper and connected it to the next row - problem solved.

mavory
added to the journal ago
Component testing
When I had the idea ready, I started testing all the components one by one.
First I started with the big sound module because I had to adjust the sensitivity and it took me quite a while because it seemed to be set to the absolute maximum, so it didn't pick up anything... I had to turn it to the left many times so that only one LED on the module was lit and then it worked!
Then I just tested if everything worked to make sure everything worked!

mavory
added to the journal ago
The beginning of my project!!
I wanted to create a system that would be controllable via my new components and I managed to come up with a lamp that is controllable via an end switch and also via a big sound microphone.
Here’s the breakdown of the setup:
- ESP32 as the brain of everythinggg
- External LED Strip powered by a 400W MOSFET, which allows me to do smooth "fade-in" and "fade-out" effects and change the brightness...
- Big Sound Module (Microphone) = 2 claps toggle the main light, and 3 claps control the Ring.
- 24-LED Neopixel Ring with 10 different color modes.
- RGB LED (it glows green when turning on and flashes red when turning off).
- Passive Buzzer for feedback, so I know exactly when a command is registered.
- Micro-switch (End-stop) for "offline" control. I'm using the OneButton library so I can click once for on/off, twice for brightness, three times for Neopixel colors, or just hold it for 3 seconds to kill the ring light.
mavory
started ESP32 Smart light ago
1/18/2026 11:26 AM - The beginning of my project!!
I wanted to create a system that would be controllable via my new components and I managed to come up with a lamp that is controllable via an end switch and also via a big sound microphone.
Here’s the breakdown of the setup:
- ESP32 as the brain of everythinggg
- External LED Strip powered by a 400W MOSFET, which allows me to do smooth "fade-in" and "fade-out" effects and change the brightness...
- Big Sound Module (Microphone) = 2 claps toggle the main light, and 3 claps control the Ring.
- 24-LED Neopixel Ring with 10 different color modes.
- RGB LED (it glows green when turning on and flashes red when turning off).
- Passive Buzzer for feedback, so I know exactly when a command is registered.
- Micro-switch (End-stop) for "offline" control. I'm using the OneButton library so I can click once for on/off, twice for brightness, three times for Neopixel colors, or just hold it for 3 seconds to kill the ring light.
1/18/2026 11:49 AM - Component testing
When I had the idea ready, I started testing all the components one by one.
First I started with the big sound module because I had to adjust the sensitivity and it took me quite a while because it seemed to be set to the absolute maximum, so it didn't pick up anything... I had to turn it to the left many times so that only one LED on the module was lit and then it worked!
Then I just tested if everything worked to make sure everything worked!

1/18/2026 5:41 PM - Connecting components to small breadboards
After testing everything I decided to start connecting everything to the breadboard. I didn't want to use the huge one, so I decided to use these 2 small ones and connect them.
At first I didn't know how the pins were connected and I found out that they were in rows...
First I had a problem that I couldn't fit all the things on GND, so I thought about how to connect it. I took a jumper and connected it to the next row - problem solved.

1/18/2026 5:48 PM - Soldering!!
After successfully connecting the components, I moved on to soldering the cables and soldering the mosfet!
At first I was wondering how to connect the mosfet, but later I found documentation that explained nicely how to connect GND and PWM...
Soldering cables:
I cut the cables and then removed the protection. I tinned the cables on all sides and later I was done.

Soldering the mosfet:
When I had the cables ready, I moved on to the aforementioned mosfet, but I was wondering what cables to use for the connection... I decided to use standard jumpers, but without headers.

1/18/2026 5:52 PM - Testing component connections
When I finished soldering, I started testing the mosfet and neopixel ring.
At first, the ring didn't work because I didn't connect it properly to the GND common, but I fixed that mistake. The LED strip worked beautifully and for the first time in my life it even dimmed!

1/18/2026 6:01 PM - Component measurement
Before coding, I started modeling.
As I always say, TinkerCad is the easiest and easiest to learn for me, so I chose this program again, but before I started, I had to measure all the components to make sure they fit and add small deviations to them.

1/18/2026 6:22 PM - The beginning of 3D modeling
After measuring and writing down all the sizes, I moved to TinkerCad. I created a new project and started creating.
I thought about what shape I would make and decided on a circle because I could easily insert the neopixel ring there and everything would fit nicely.
I took a piece of paper with the sizes and started calculating how big I would make it... I decided that the total circle would be 90x90mm and then I continued with the hole.
Later I also started making the top lid, into which the mined ring will be inserted:

1/18/2026 6:25 PM - Measurement error!
When I was checking how to make a large hole for the neopixel ring, I also looked at the website of the store where I bought it and they wrote completely different things there... So I decided that I would continue with my sizes anyway, but I would adjust the case to 100x100mm, and if everything would fit there.

1/18/2026 6:37 PM - Finishing the top and bottom of the 3D case
After a short break I started making the 3D case again...
I didn't know exactly how I was going to make the top part, but I decided to make a hole at the top for adding LED strips later. It took me a while and I think it will need some more work anyway... The hardest part was probably finding the right place for the neopixel ring.

1/18/2026 6:46 PM - Groove for LED strip
Once I had the 3D case finished, I started working on the groove for the led strip.
First I had to create a bracket that would connect to the 3D case and the groove would be inserted into it.
I was thinking about what design to choose and decided on a regular "U" style where the strip would be glued.

1/19/2026 9:24 AM - Removing supports and strange things
After printing the bottom part I started removing the supports. I also had to take a knife and cut off the little bumps it made near the holes...
Once I had it, I took some sandpaper and started sanding the case to make it look a bit nicer.

1/19/2026 9:35 AM - Inserting components into the case!!
After successfully modifying the case, I started putting the breadboard and components into the case. I had a few problems that occurred to me:
- I turned the breadboard the wrong way around, so I had to take it all out and put it back in, because only one side has a hole for the button, which is placed from the side... đź’€
- I took out the components a few times to put the cables under them, so that everything would fit nicely into the case
- I also had to disconnect the mosfet and thread the cable through the hole so that the LED strips could be powered.
Otherwise, I did the case and things like that well, because the cables fit perfectly in there.

1/19/2026 9:46 AM - Top printing
In my free time I started printing the upper part of the 3D case. Then I took it, modified it again with a knife, sandpaper and removed the supports where I did research for a good removal of the supports and it worked! Anyway, here is an example:


I took some quick-drying glue and some isopropyl alcohol, which I used to clean everything so that there was no grease and it would stick well...
I applied a small amount of glue to the neopixel ring and stuck it into the hole for the neopixel just mentioned.

1/19/2026 10:06 AM - Thickness error
I thought it would work fine, but here came a small problem...
When I tried the strips and turned them on on the 3D holder, the light was shining through from one side where it shouldn't.
So I went back into the program and reworked it to be thicker and not let in light. I also adjusted the fill to 100% in BambuLab studio and added 3 wall perimeters.
.jpg)
1/19/2026 10:27 AM - Remodeling :(
When I got the new piece printed, I was amazed at how it still let in light even though I had enlarged the wall by about 50%...
So I went back into the program and added a few more millimeters and hopefully it will be good. Next, I put on the holder for the LED strips and it works very well so far!

1/19/2026 10:33 AM - Start of coding
In the meantime, I decided to start making a code. Before that, it was just a test code to see if everything works, and now we're going to the master code!
At first, I didn't know how to code it, but gradually I started thinking of various other things to improve it...
So far, the code can only turn the led strip on and off (1x) and clap twice to turn the ring on/off.

1/19/2026 11:46 AM - Continuing coding!!
I continued coding and decided that I would like to add some mods for the ring and also to dim the led strip.
I achieved this by adding a OneButton function to the code, which was there before, but I didn't use it that much.
I also added the ability to clap multiple times and here's what it means:
- 1x = turns the led strips on/off
- 2x = turns the neopixel ring on/off
-
3x = changes the sew mode of the neopixel ring
1/19/2026 11:57 AM - Gluing the upper part of the holder
When I had some time, I started gluing the first part of the strip holder.
I thought it would be easy, but it wasn't possible at all... At first, I just applied glue to the holder and tried to let it dry - but it didn't work. I had to take a stronger glue and started adding from both sides. It was better, but it still wasn't enough (it was falling to the sides, etc).
So I put a big dose of glue on top and held it for about 20 minutes, then I turned it over and started adding glue from the other side again and it helped! We just applied glue a few times, maybe it held even more, but now I'm satisfied.
.jpg)
1/19/2026 12 PM - The 3D case is ready!!!
After a long time I finished the 3D case and glued everything.
At first the holders for the LED strips didn't hold together, so I had to sand them down first and then try to glue them...

I guess the most difficult thing was to somehow straighten it out and do it right, because before I always had it either too far forward or too far back. So now it's level, but I still have to sand it a little to fine-tune the straightness.

1/19/2026 4:48 PM - Creating a website for the system
I decided that I would like to use one more cool feature of ESP32 - WiFi!
So I thought about how to create a website, but so that it works... At first I thought that I could put buttons and sliders on the website, that was just the beginning, but unfortunately when I created the page, the system did not work, so later I had to start again and with a better look!

1/19/2026 4:55 PM - Continuing to create the website
When I had a finished but non-functional website, I decided to completely redo it.
I deleted the code and started from scratch... I was thinking about what look to use and decided to use white and blue with a touch of minimalism!
I gradually added buttons, sliders, selections,.... until I came to a functional website that could control my system - But it had one flaw:
- When I wanted to turn something off/on via the button and then turn it on/off via the website, the website threw me nonsense and nothing worked...
I was missing something there...

1/19/2026 5:17 PM - Website completion!
After a few hours I finished the website!
It took me a long time to get it up and running, but I managed to do it... I had to rework the logic of the operation. First I thought about adding a "Demo Mode" that would constantly cycle through all the modes, and I managed to do that!
I also fixed the buttons and added "live fetch" which works as follows:
- I press, for example, a button on the case that turns on the light and on the website the button status also changes to on.
This was probably the most difficult part of the editing, because I was mostly editing and looking for errors that were there.

1/19/2026 5:21 PM - Language editing
To make the page readable for everyone, I had to edit the code one last time by rewriting the main logic into English. It only took me about half an hour and I'm happy for it!

1/19/2026 6:00 PM - Finishing the case
As I wrote before, I still had to finish the case to make it perfect. I added a little glue at one point because the top part was peeling off a little, but that's it.
I also took some finer grit sandpaper and sanded the case a little in some places because there were still some glue residue, some bumps, etc.

1/19/2026 6:52 PM - Circuit diagram in KiCad
After finishing the 3D case, I moved on to the schematic, which I always do in KiCad. At first, I was thinking about what pins I would use mainly for the mosfet, but I decided to use normal...
I then gradually inserted all the components and also prepared the connection symbols.

1/19/2026 6:57 PM - Circuit diagram is finished!!
When I added the symbols, I started connecting the components with the ESP32. The microphone took me the most time because I forgot to connect it, so I had to find it on the internet (the 3D case was already closed).
So I finished the last part, rotated a few symbols and renamed the project.

1/19/2026 7 PM - Preparing things for the GitHub repo
When I was slowly finishing my project, I started making BOM and preparing things for export to GitHub.
I tried to find the cheapest things with cheap shipping and I also had to convert my 3D models from .STL to .STEP via convector.
I also exported the file for ESP32 and prepared everything in a folder for upload!!

1/19/2026 8 PM - GitHub editing
After exporting I started uploading files to the repo and also started writing README.md which is very important. I also had to make a journal file where everything is described.
Next I made a video of how it works and uploaded it to YouTube...

1/19/2026 9 PM - ESP32 Smart Light it is finished!!!
A system that is powered by ESP32 and controls 2 LED strips and a neopixel ring using clapping and the web!

Why did I do this?
I wanted to create a system that could be controlled using my new Big sound module, so I started thinking and came up with this interesting idea!
Features
- Web interface
- It has a buzzer and an RGB LED for notification
- You can clap to turn the lights on/off
- You have a neopixel ring that you can set up to 10+ mods on
Scripts
In total, the script has about 650 lines, but the website, functions,...It´s only in this script. So just upload it via Arduino IDE to ESP32 and everything should work!!
Home page:

How it works?
- Clap control: 1x clap toggles the LED strip!! 2x claps toggle the ring and 3x claps change the ring mode
- Physical button: 1x click toggles the LED strip, 2x click changes brightness (strip), 3x click swaps ring modes. Long press turns the system On/Off
- Web UI: Change 12 ring modes (Matrix, Fire, Rainbow, etc.), 3 strip effects, and brightness
- Status LED: Shows WiFi status and gives color feedback (Green/Red/Blue) when you change settings
- Auto Demo: Randomly cycles through all ring effects every 10 seconds....
Libraries:
- Adafruit_NeoPixel.h
- OneButton.h
- WiFi.h
- WebServer.h
- Preferences.h
3D models
Here is a view of the top and bottom of the case:


Circuit and Wiring Diagram


Here is the PDF format for download: ESP32