LED

A glowing indicator. Show a status, a connection state, or any boolean signal at a glance. Drive its color and brightness from your sketch.

[image] LED widget on canvas, ON, brand green, halo and rays visible

What it does

LED is a single light indicator with adjustable brightness, a chosen color, and two optional effects: a soft halo ring and radiating rays. Your sketch flips it on or off, sets the brightness, changes the color any time.

When to use it

• Color-coded status — Green = OK, orange = warning, red = fault. Use setColor() from your sketch.
• Connection / heartbeat — Bright when connected, dimmed when disconnected. Use setBrightness().

Properties

The Inspector opens as a bottom sheet with a Widget ID field at the top, then these sections in order.

Widget ID

1. Essential

2. Header

3. Effects

4. LED presets

A row of clickable color pills that set the LED, halo, and rays to the same color in one tap:

5. Colors · ON state

6. Colors · OFF state

States and behavior

[image] Three states side by side: OFF, dim (50%), full brightness with halo + rays

The visual is continuous — brightness 0 is fully off, 1 is fully on. Halo and rays scale with brightness when enabled, so a dim LED has a faint halo and a bright LED has a bold one.

In code

The widget mirrors what your sketch sends. To update its color and brightness:

instant.led("status_led").setColor(0x00FF00);  // green
instant.led("status_led").setBrightness(80);

That’s the minimum — set color and brightness from your sketch. Don’t put these calls directly in loop() — Arduino’s loop() runs thousands of times per second, which would flood the link. Use a timer to push at a sensible rate (200–1000 ms is plenty).

Available methods:

• .on() / .off() / .toggle().
• .setBrightness(int 0–100).
• .setIntensity(float 0.0–1.0).
• .setColor(uint8 r, uint8 g, uint8 b) and .setColor(uint32 0xRRGGBB).
• .setState(bool on, float intensity).

See InstantIoT Library / Send Data to App.

Working Arduino code example

A complete sketch you can flash. The Widget ID status_led matches the one you set on your LED in the app.

[gif] LED widget on the dashboard changing color (green / orange / red) as the ESP32 reports its state

Direct Mode

Your phone connects directly to the ESP32’s SoftAP — no router, no server. Best for prototyping and standalone setups.

#include <InstantIoTWiFiAP.hpp>
#include <utils/InstantIoTTimer.hpp>

const char* AP_SSID = "InstantIoT-Greenhouse";
const char* AP_PASS = "12345678";

InstantIoTWiFiAP instant(AP_SSID, AP_PASS);
InstantTimer timers;

bool isError() { return false; }
bool busy()    { return millis() % 6000 < 2000; }

void pushStatus() {
  if (!instant.connected()) return;

  if (isError())   instant.led("status_led").setColor(0xFF0000); // red
  else if (busy()) instant.led("status_led").setColor(0xFFA500); // orange
  else             instant.led("status_led").setColor(0x00FF00); // green

  instant.led("status_led").setBrightness(instant.connected() ? 100 : 30);
}

void setup() {
  instant.begin();
  timers.every(500, pushStatus);
}

void loop() {
  instant.loop();
  timers.run();
}

Server Mode

The ESP32 connects to your self-hosted InstantIoT Server over WiFi. Multiple devices, persistent state, history.

#include <InstantIoTWiFiServer.hpp>
#include <utils/InstantIoTTimer.hpp>

const char*    WIFI_SSID     = "YOUR_WIFI_SSID";
const char*    WIFI_PASS     = "YOUR_WIFI_PASSWORD";
const char*    SERVER_IP     = "192.168.1.42";
const uint16_t SERVER_PORT   = 9001;
const char*    DEVICE_TOKEN  = "YOUR_DEVICE_TOKEN";

InstantIoTWiFiServer instant(SERVER_IP, SERVER_PORT, DEVICE_TOKEN);
InstantTimer timers;

bool isError() { return false; }
bool busy()    { return millis() % 6000 < 2000; }

void pushStatus() {
  if (!instant.connected()) return;

  if (isError())   instant.led("status_led").setColor(0xFF0000); // red
  else if (busy()) instant.led("status_led").setColor(0xFFA500); // orange
  else             instant.led("status_led").setColor(0x00FF00); // green

  instant.led("status_led").setBrightness(instant.connected() ? 100 : 30);
}

void setup() {
  instant.begin(WIFI_SSID, WIFI_PASS);
  timers.every(500, pushStatus);
}

void loop() {
  instant.loop();
  timers.run();
}

The widget code is identical — only the include and constructor change.

Notes

• This is a Display — no Target Devices dropdown.
• LED presets are a convenience — they set the LED, halo, and rays colors all at once.

Next

→ Metric — When the value is a number, not a status color.

→ Text — When the status is best expressed as a string.

→ Bar Chart — Multiple LEDs side by side? Consider one Bar Chart with N bars instead.