If you’ve tried the HTML Widget for web dashboards we shipped in September, you can now enjoy the same features in the Blynk IoT app on iOS and Android. The custom widgets you build for the web can sit on your users’ phones too.
It’s the same widget on both: the app loads the same .html file and gives it the same BlynkBridge API, so a widget you’ve already built for a web dashboard runs in the app without changes to its code. The video below walks through the whole flow on a phone, and this post covers the same steps plus a few things that only apply on mobile.
Our standard widgets already cover most needs brilliantly. But every product has that one screen that makes it feel like yours, and that’s where HTML comes in:
If you can sketch it, you can probably build it. And it works on the web dashboard and the phone from one file.
In edit mode, tap +, add an HTML Widget and open its settings. Pick a file from our presets, your Widget Library or your phone, then add datastreams in the order the HTML expects (they're read by position, starting from 0).
That's it: live data, on your phone. Presets are copied into your Widget Library, so you can customize your copy in the console anytime.
Write your widget where it's comfortable, in the console's Code Editor or your own editor, then pick the file on your phone. There's no code editor in the app on purpose: nobody wants to write HTML on a phone keyboard.
Files already on your phone upload straight from the file picker and land in your Assets, like the home battery panel in the video.
Prefer not to code? Our blynk-html-widget Agent Skill teaches AI coding assistants how the BlynkBridge works. Describe the widget in plain words, like "a card that turns red when the compressor overheats", tweak the result in the console and select it in the app.
HTML widgets sit right next to regular ones. In the video, two HTML widgets lead the dashboard, followed by Value Displays, a Switch and a SuperChart. Configure it once on the template, and every user of that device type gets it.
Most of the bridge works the same on both, but it exposes a few capabilities only on the phone. The main one is page navigation: a widget can open other dashboard pages with showPage(index), go back with closePage(), or return to the main dashboard with closeAllPages(). You choose which pages a widget can open in the Pages section of its settings on the phone.
A few other capabilities differ by host, for instance the date range picker is web only. The HTML Widget developer guide lists them, along with the check functions you can use so one file works in both places.
The HTML Widget is available on all plans, with the same limits as on web. You can use 1 HTML widget per template on Free, 3 on Starter, 10 on Prototype and 20 on Production, and each widget can hold up to 100,000 characters of code. Files you upload count toward your Assets storage. The full breakdown is on the pricing page.
To get it, update the Blynk IoT app. On iOS it arrived in version 1.71.
If you’re starting from scratch, any ESP32 sending values to a few datastreams is enough to try it: get started free, add a preset to the mobile dashboard, and connect the datastreams. The mobile HTML Widget docs cover each setting in more detail.
.png)
