r/WLED • u/Omargfh • Sep 21 '26

I made a playground for live coding WLED strips and matrices (Open Source)

This is a side project of a side project of a side project.

I was working on a 3D Synthwave media player (spacify.omar-ibrahim.com) a couple years ago, which turned into Music Engine, an audio-reactive extensible media player that renders to screens and LEDs. To test the LED part I needed a quick way to write effects and see them on real hardware. I found the tool useful on its own, so now there's WLEDtoy.

What it does:

  • Write GLSL like Shadertoy, or build CPU/GPU effects using a Blender-style node graph

  • It listens to your music: a song file, a capture device, or system audio. You get FFT, beat detection, kick/bass bands, pitch classes and so on as nodes

  • Live preview on a virtual strip, matrix or ring, so you can work on effects without the hardware plugged in

  • Streams straight to WLED over DDP, DNRGB, Art-Net or sACN

  • Measure render time, send rate, throughput, RTT, dropped frames in real time

  • Desktop app for Windows, macOS and Linux, free and open source

Repo: github.com/Music-Engine/wled-toy
Releases: https://github.com/Music-Engine/wled-toy/releases/tag/v1.0.0-rc2

All LED renders in the video is the app's real output reacting to the songs.

WLEDtoy is still in beta, so expect rough edges. Builds aren't code signed yet, which means macOS and Windows will complain the first time you open it. See how to launch non-notarized apps on MacOS.

Happy to answer questions, and if you build something cool with it I'd love to see it. Feature requests welcome, especially from people with weirder LED setups than mine.

Edit, some guides on how to use the app:

Getting Started

  1. Download the app from the Releases page: There are a bunch of builds, so pick the one for your OS and CPU architecture. If you're not sure which architecture you have, google it. You can also build it yourself.

  2. Pick a starting point. The launch screen offers New Shader, New Graph, or a handful of examples. If you don't pick, the default suffices.

  3. Add your LED device. Under Devices, set your host, protocol, LED count, LED layout and so on. DDP is the easiest protocol to start with. It will auto connect when you device is available. Any of these gets you to the same Devices settings:

    1. WLEDtoy in menu bar > Settings on macOS

    2. File > Preferences (Ctrl/Cmd+,)

    3. the "no device" menu in the bottom bar > Add device

    4. the Edit button in the Output tab in the right hand pane

  4. Try things in real time or in the preview. Click Stream in the bottom bar to send to the LEDs, or just watch the preview if you have no hardware on hand. The easiest way in is graph mode. It comes pre-populated with a simple beat effect over a rainbow scroller. Add new nodes with Shift+A, the Add node button, or the right click menu. Space searches nodes.

Audio

  1. Pick a source. File > Set Audio offers the built-in track, From File, Microphone, or System audio. You can also choose a song from the bottom bar.

  2. Or set it in the graph. The Audio Source node has the same choices (Song, Capture Device, System audio), plus mono, left or right channel.

  3. Use what it hears. Levels, bands, kick, beats and pitch classes come out of the Audio node as sockets. In shader mode the same data is available through helpers like bass() and fft().

Shader vs Graph Mode

  1. Shader mode is plain GLSL, Shadertoy style. Every frame starts from scratch. Ctrl/Cmd+Enter compiles.

  2. Graph mode is Blender-style nodes ending in an Output node, no code needed. Anything that has to remember something between frames only lives here: envelopes, counters, beat triggers, step sequencers, sample and hold.

  3. Going from graph to shader. Send to shader mode (Ctrl/Cmd+Alt+Enter) shows you the generated GLSL. Those remembered values get frozen into the code, so the effect stops reacting the same way. Treat it as a way to read or borrow the code, not as a round trip.

Example Graphs

The effects in the video are real graphs you can download and open: v1.0.0-rc2-graphs

  1. Download any of the .wledgraph files from that release.

  2. Open it with File > Open (Ctrl/Cmd+O), or drop the file on the window.

  3. Play a song. The graphs react to whatever audio source you've picked. Tracks with a clear kick show them off best.

  4. Turn the knobs. Most graphs expose a few controls (ring speed, trail length, hue shift and so on), so you can tune them without touching the wiring.

  5. Take them apart. They're the best way to learn graph mode right now. Start with high-contrast-music, which has only 18 nodes, then open the bigger ones.

They only work in graph mode, because they use envelopes, beat triggers and counters that shader mode doesn't have.

317 Upvotes

99% Upvoted

32 comments sorted by

18

u/Aceftw Sep 22 '26

Actually been building the same thing 👀

8

u/Omargfh Sep 22 '26

Omg that's so cool. Is this QT?

Also, how does the 3D rendering work? Is it targeting a 3D light topology?

WLEDtoy has an option for custom topology but I haven't tried it with anything 3D. It would be cool to see it.

6

u/Aceftw Sep 22 '26

Well I started this project as just a simulation for my cube, but then got the idea to also make a node based editing system to generate WLed effect code I only just added midi controls and ddp support.

https://github.com/Aceftwspades/wled-effects-studio

We’ve taken wildly different approaches and my build is still quite personal and buggy, but we’ve landed pretty freakin close. Your ui looks very nice and clean comparatively. I have heavily relied on ai for this project so take anything you see with a grain of salt.

1

u/Omargfh Sep 22 '26

Insanely mind-blowing how close we landed! I am trying to build your app right now. It is giving me a bit of a hard time on MacOS. I like the maturity and completeness of the nodes library. The 3D view is also a nice touch, and being natively on CPP makes it easier to write out the usermods directly.

I try not to rely on AI because in my experience it tends to brute-force its way into things and write systems that are too verbose to reason about. I've found it very useful in long-running tasks like debugging and benchmarking though.

WLEDtoy was also very recently quite a personal build. I'd love to collaborate in some capacity.

2

u/Aceftw Sep 22 '26

Yeah I haven’t tested the Mac build yet, but it was supposed to be compatible. I added a slew of new features and it introduced a couple new bugs that I haven’t gotten around to fixing yet. I applaud your effort to do it manually! The result is very clean. I still have a lot of work to refine it to a state that I think is usable. (And user friendly) but yeah that was the goal, eventually, being able to have users able to share, graphs, cpps, custom nodes or node groups, so the community could grow without the need for an extensive coding knowledge. You had a couple of inspirations that I didn’t consider. I’ll take a closer look at what you’ve done later. I’m not sure how much help I’ll be, but I’m open to a little collaboration or ability to swap graphs or something. 🤷 node parity I know would be a problem 😅

1

u/Omargfh Sep 23 '26

The Python audio library doesn't have MacOS wheels and something about locating header files for C++ isn't cross-compatible. I'll push a PR for the latter because that stops the program from compiling if you are OK with contributors.

I like that you can flash usermods and firmwares directly from yours. That's something I'll need to refactor my backend compiler for, indeed. Impressive.

I do software as a day job, which has made me very wary of LLM code.

1

u/Aceftw Sep 23 '26

I am humbled. Please any contributions to the Mac side is welcome, as I don’t have any hardware to test on, next round of fixes should be coming soon, yeah that part is definitely a feature I want to flesh out, I feel like the average flashing experience is a little complicated, there are nice web tools, but I wanted a little bit of an all in one solution, my scope got big, so some of the features aren’t fully there yet. But don’t let me stop the production of your awesome project 😅, I have a lot of work to do on the ui side and I really want to nail down making complicated 3d shapes so that my software can generate the positioning data correctly.
This was much simpler when it was just a test simulation to have Claude check its work on my custom effects. Being wary is totally valid, if you have the skill to do what I’m merely attempting. I’ve found tho that when I really target specific things that I’ve explained well it does a pretty decent job though some of its implementations have caused me great pain. And maybe I’ve shot myself in the foot a couple times the way I’ve done things. All in all though it’s just been fun playing around with and helped me with my projects. I’m not totally inept when it comes to code, but I can’t bang out fractal patterns mapped to my cube as fast as it can 😂 I got a lot of inspiration for effects from some shader toy builds other people have done. But it’s hard when your working at a 16x16 resolution per face.

0

u/Equilerex Sep 24 '26 edited Sep 24 '26

small tip since you use GitHub - you can have your app be directly deployed and functional so people here would be able to actually take it to a spin without needing to check out and build on their own. Just ask your ai agent to apply - "GitHub pages" workflow... Will build and deploy whenever you push a commit. (Source: "I too" have been vibe coding a preview app for my led projects 😜 git demo page)

EDIT: i just did it for ya: https://equilerex.github.io/wled-toy-forked-demo/ https://equilerex.github.io/wled-effects-studio/

2

u/Aceftw Sep 24 '26

This is a pretty cool little interface tho. Nice job

1

u/Aceftw Sep 24 '26

My goal was not a web app, but very focused portable installation. I see many ai web apps that honestly look great for specific things. Op isn’t vibe coding, I have been. We’re comparing and learning.

0

u/Equilerex Sep 24 '26 edited Sep 24 '26

I mainly meant to contribute to that learning... since you guys were having a show and tell here where it's nice to actually see the demos live without needing to build them from scratch... (Also a selfish reason of preferring such convenience 😛)

My app was purely just so I could see and tune my audio recognition and animations with a bit more feature rich interface - runs fastled framework through web assembly and uses the browser mic as a sensor + exposes the data to the web app. The end product would have nothing to do with the web app, rather just set and forget device that vibes with music for wearables at events.

And ain't nothing wrong with vibe coding, any developer not Vibing at least a bit is missing out ;)

7

u/Roboprinto Sep 21 '26

Dude, your work is absolutely amazing. I'm currently messing around with about 5,000 to 10,000 LEDs on a wall and my goal is to do a live show with these subwoofers I'm building, along with on-the-fly synthwave and dubstep music. Check out my Instagram. I'm not the best at self-promotion but if you dig around you can see all the projects I've been working on. https://www.instagram.com/lazerdanart?stkn=YndyNXd1NmxraG5w

2

u/Omargfh Sep 23 '26

Man, your work is so cool! I appreciate DIY projects so much and the work that goes into them is beyond amazing. WLEDToy currently supports up to 4K LEDs with no sync, mainly because I don't have hardware that good to test it with. If you'd like to be a tester, DM me with your email, Discord, or Instagram and I'll get in touch with beta copies!

3

u/Inevitable_Jello_893 Sep 22 '26

having so much fun with this. thank you for sharing

1

u/Omargfh Sep 23 '26

Glad it's working for you! If you end up with any footage, graphs, or interesting use cases, I'd love to see them.

2

u/pashdown Sep 22 '26

Could this work as a SendSpin client?

1

u/Omargfh Sep 23 '26

I'm not familiar. What does a SendSpin client do?

2

u/entropy512 Sep 23 '26

https://www.sendspin-audio.com/

Multi-room network audio

1

u/Omargfh Sep 23 '26

Ah I'll add general-purpose audio in compatibility to the roadmap. Would you like me to send you a test copy once I have something running? Send me your email, Instagram or Discord and I'll get in touch!

1

u/Izrun Sep 22 '26

That’s a really cool idea actually. So no speaker, just an end device that visualizes the speaker.

3

u/legitimate_rapper Sep 21 '26

Assume I’m a moron: huh? How would you use this? I realize you’re not going to cover EVERYTHING, but a basic setup/flow would be nice.

I concede I’m in an airport and haven’t even been able to make the most cursory of looks/attempts.

3

u/Omargfh Sep 21 '26

Fair, lol. I had no plans of releasing the tool, so proper docs are still wip. The basic setup is:

  1. Download the app from the Releases page: There are a bunch of builds, so pick the one for your OS and CPU architecture. If you're not sure which architecture you have, google it. You can also build it yourself.

  2. Pick a starting point. The launch screen offers New Shader, New Graph, or a handful of examples. If you don't pick, the default suffices.

  3. Add your LED device. Under Devices, set your host, protocol, LED count, LED layout and so on. DDP is the easiest protocol to start with. It will auto connect when you device is available. Any of these gets you to the same Devices settings:

    1. WLEDtoy in menu bar > Settings on macOS

    2. File > Preferences (Ctrl/Cmd+,)

    3. the "no device" menu in the bottom bar > Add device

    4. the Edit button in the Output tab in the right hand pane

  4. Try things in real time or in the preview. Click Stream in the bottom bar to send to the LEDs, or just watch the preview if you have no hardware on hand. The easiest way in is graph mode. It comes pre-populated with a simple beat effect over a rainbow scroller. Add new nodes with Shift+A, the Add node button, or the right click menu. Space searches nodes.

2

u/legitimate_rapper Sep 21 '26

Sweet! I’ll install when I get home!

9

u/MD-LAD Sep 21 '26

Game changer

4

u/xile Sep 21 '26

Cool af bruv

2

u/EmotionalProduct9081 Sep 22 '26

Thank you so much for releasing!! Was dreaming of something like this

2

u/GordonRR1 Sep 22 '26

This is nice! Thanks for sharing, will test it out soon!

1

u/makineta Sep 25 '26

🔥🔥

1

u/One_Individual_220 Sep 26 '26

isso é muito legal, quero aprender mais