Diagram your ESP32's interface.
Web page, phone app, or its own screen.
Drag modules onto a canvas. Wire them together. Click Generate and download a complete Arduino sketch or ESP-IDF project — class, callbacks, demo wiring — ready to open in the Arduino IDE or code editor of choice, or compile and flash it from here. The same diagram can serve a web page, drive the free phone app over Bluetooth, or show itself on a screen wired to the board.
What it does
Visual diagram editor
Drag pages, cards, forms, gauges, charts, sensors, storage, and more onto the canvas. Wire them together to show data flow. No coding required to design your device's interface.
One-click code generation
Click Generate and the server emits a complete Arduino sketch
folder: Notes.md, Callbacks.h,
EmbeddedSite.h, and demo.ino — all the code
for the website, the phone-app manifest or the screen, plus a demo
driver .ino and a diagram-aware library list.
Live preview
See what the ESP32 will show before you flash anything. The preview pane mirrors the web page on a phone, tablet, or desktop browser, and a Display's screen at the panel's own resolution, drawn exactly the way the board draws it.
Callback stubs
User-editable stubs for every gauge, chart, form, and WebSocket node are keyed by node ID, so renaming a module in the diagram never breaks your callback edits. A header comment shows the human-readable name above each stub.
One theme, everywhere
Pick a color palette and visual style once. The same theme flows into the live preview, the web page's CSS, the phone app, and the board's own screen — with an E-paper theme for e-paper displays.
Choose your server lib
Default to the built-in WebServer for simplicity, or
switch to ESPAsyncWebServer in Config for better
concurrency (and to unlock WebSocket support). Each generated
sketch only pulls in third-party libraries it actually uses
(WebSockets, ArduinoJson)
— a Notes tab next to the code lists
exactly which ones, and why each is there.
On the board's own screen
Add a Display node and your pages — gauges, charts, tables, text and pictures — show on a screen wired to the ESP32, with touch controls that call the same code as the web page. Cheap Yellow Display, Waveshare, M5Stack Core2 and M5Paper boards work with no wiring; SSD1306 OLEDs and ILI9341/ST7789/GC9A01/ST77916 TFTs on pins you choose. No graphics library to install.
Or the phone app, over BLE
Switch the Interface to BLE and the firmware serves no website at all: the free ESP-GenUI Android app reads the interface off the board and draws native widgets. One app for every device you build, with firmware updates over Bluetooth.
Draw with AI
Describe a picture in a sentence — "a barometer dial", "a tank that fills with the water level" — and get a detailed drawing whose needles and levels follow your sensors live, on the web page, in the app, or on the screen.
Describe it in plain English
Don't want a blank canvas? Click Describe, type what you're building — "a grow-room controller with a soil-moisture gauge, a fan slider, and a WiFi setup portal" — and AI assembles a matching diagram: pages, widgets, and the wiring between them, ready to preview and tweak.
Compile & flash over USB
Take a diagram all the way to a running device without leaving the browser: Connect an ESP32 over USB (Web Serial), Compile on the server, and Flash the merged image straight to the board. No Arduino IDE or toolchain install. Chrome or Edge on desktop.
Arduino or native ESP-IDF
Pick your target in Config. The default emits an Arduino sketch;
switch to native ESP-IDF and the same diagram becomes
a complete native project — pages, WiFi, GPIO, screens, BLE,
storage, MQTT, WebSocket, camera, and OTA — built with
idf.py, no Arduino core.
What it does not
Most embedded UI frameworks try to do everything: drag-and-drop editors, massive component libraries, complex installation steps, cloud integrations, and heavyweight runtimes. That power comes at a cost — large downloads, steep learning curves, high memory usage, and tooling that feels oversized for microcontrollers like the ESP32.
This project takes a different approach. It's a lightweight UI generator, nothing to install, no extra libraries, WYSIWYG design, and designed for users who want to build quick, clean interfaces — in a browser, in the phone app, or on the board's own screen — without pulling in an entire ecosystem or a graphics runtime.
Instead of trying to be a full enterprise design suite, it focuses on the essentials. The goal is practicality over complexity.
A glance at the editor
Three panes. Modules on the left. Canvas in the middle. Inspector and generated code on the right.
Pricing
Start building for free — no credit card, no install.
- 3 Saved Projects
- 3 Saved Drawings
- 15 Device Functions Per Diagram
- 15 Code Generations Per Day
- 10 Compiles Per Day
- 5 AI Generations Per Day
- Unlimited Saved Projects
- Unlimited Saved Drawings
- 250 Device Functions Per Diagram
- Unlimited Code Generation
- Unlimited Compiles
- 250 AI Generations Per Day
Cancel anytime — Pro runs to the end of the period you've paid for. Prices in USD.
Code you generate is for personal, non-commercial use. This one-time license adds commercial rights to everything you generate while you hold it — ship it in products you sell, with no per-device royalties.
Available on any plan, including Free. It never expires and isn't tied to a subscription — cancel Pro and you keep it.