UK National Grid Display

How green is the electricity coming out of the plug right now? This little ring of 12 RGB LEDs answers that at a glance. Every five minutes it fetches live figures for Great Britain's electricity generation and shows the mix as coloured segments: green for renewables, blue for nuclear, purple for imports and other sources, orange for biomass and red for gas (and theoretically coal, though the UK no longer uses it!).

The display was inspired by Kate Morley's brilliant National Grid site, grid.iamkate.com and a previous project of mine an RGB LED Ring Clock which also uses a 12 LED ring. I wondered whether the same 12 LED ring could display Great Britains electricity generation as a glance.

Since it sits on my desk anyway, it does two more jobs. A tap on a touch sensor hidden behind the case switches between three modes:

1. National Grid – the live generation mix.
2. Clock – the same clock face as my earlier project, but the time comes from the internet, so there's no RTC module and no daylight-saving switch.
3. Pomodoro timer – one hour around the ring, split into work and break segments.

It's built around a Seeed Studio XIAO ESP32-C3 running MicroPython. I wanted it to work as a gift, so the person receiving it sets it up from their phone through a simple web page, with no coding or computer needed one the code has been loaded onto the board. The set up mode also allows you to change which LED is the “top” one so the display can sit on your desk or be attached to the side or bottom of your monitor (as mine is!).

The data covers Great Britain (England, Scotland and Wales - Northern Ireland is on a separate grid). Although inspired by Kate Morley’s site, I made some changes to how it displays electricity sources compared to her site.

1. GitHub (code): https://github.com/TellinStories/UK-National-Grid-LED-Ring
2. MakerWorld (3D printed case): https://makerworld.com/en/models/3494718-uk-national-grid-display#profileId-3991552

Supplies

1. Seeed Studio XIAO ESP32-C3. This comes with a small flat (FPC) antenna which you’ll need to connect. The code will also work with a Raspberry Pi Pico 2 W but the 3D printing files and build instructions here are for the ESP32-C3 version.
2. 12 LED WS2812B RGB ring (sometimes sold as a NeoPixel ring). Important: these come in slightly different sizes, so you will need the ones that have a 50mm outer diameter and 35mm inner diameter.
3. TTP223 capacitive touch sensor module. These are very cheap and usually come in packs of five or ten.
4. Stranded core wire, in four colours if you have them. I used 24 AWG silicone wire.
5. USB-C cable and a 5V USB power supply. Check the cable carries data as well as power, as you'll use it to load the code.
6. 3D printed case – files on MakerWorld (link above).

Tools

1. Soldering iron and solder.
2. Wire strippers.
3. A computer with Thonny installed.
4. Access to a 3D printer with white and filament and another colour of your choice.

Every five minutes the board asks the free Carbon Intensity API for the current generation mix. No account or API key is needed. It groups the fuel types into five colours and shares the 12 LEDs between them, so each LED is roughly 8% of the total.

1. Green: Renewables: wind, solar and hydro
2. Blue: Nuclear
3. Purple: Imports through the interconnectors, and other sources such as storage
4. Orange: Biomass
5. Red: Fossil fuels (which these days is only gas as we no longer use coal).

For example, 7 green, 1 blue, 1 purple, 1 orange and 2 red LEDs means roughly 58% renewables and 17% fossil fuels. The code rounds the figures so the ring always has exactly 12 LEDs lit, which means a source under about 4% may not show at all.

The segments start at the top of the ring (12 o'clock) and run clockwise in the order above. You can change the order on the setup page, and also change which LED is at the 12 o’clock position (for example in case you want to attach the display to the side or bottom of a monitor).

The figures are for the current half hour, so the ring changes gradually through the day. On a windy night it's almost all green; on a still winter evening you'll see a lot more red.

The images compare the LED ring to the same time on both websites - there are minor differences as, for example, grid.iamkate.com does not show interconnectors on the ring.

Step 2: 3D Print the Case

1. Download the case files from MakerWorld. There is a “main version” plate which is probably better but harder to insert the electronics, and an “alternative version” plate which is easier. Make sure to use white filament for the part labelled “white ring”. Thhe sliding lids have alternative versions with slightly different tolerances.
2. Print them.

There are only five connections, and they're all on the same side of the XIAO, which makes soldering much easier.

Connections Guide:

1. 5V → LED ring 5V (sometimes labelled VCC). The XIAO’s 5V pin passes power straight through from the USB-C socket, which is fine for 12 LEDs at sensible brightness.
2. GND → LED ring GND and touch sensor GND (see note below).
3. 3V3 → Touch sensor VCC.
4. D10 → LED ring DI (data in).
5. D7 → Touch sensor I/O (sometimes labelled SIG or OUT). You could also use D1–D5 (GPIO 3–7 in board.py) if you changed the code, but for various reasons you should not use any of the others.

What to do:

1. Solder about 3 cm of stranded wire to the 5V, GND and DI pads on the back of the LED ring. Leave the DO pad on the LED ring alone.
2. Solder three wires to the touch sensor: VCC, GND and I/O.
3. Solder the wires to the XIAO as in the table. The two GND wires can share the one GND pin on the XIAO OR solder a wire from the XIAO’s GND to the touch sensor’s GND and then another wire from that to the LED ring’s GND.
4. Clip the antenna's tiny connector onto the socket on the XIAO. Press it straight down until it clicks. These connectors aren't designed to be unplugged and replugged many times, so do it once and leave it.

Install Micropython:

The XIAO doesn't come with MicroPython, so it needs installing once. Thonny can do this for you.

1. Plug the XIAO into your computer with the USB-C cable.
2. In Thonny, go to Tools → Options → Interpreter and choose MicroPython (ESP32).
3. Click Install or update MicroPython (esptool) in the bottom right.
4. Choose the XIAO's port, then set MicroPython family to ESP32-C3 and the variant to Seeed Studio • XIAO ESP32-C3. Leave the version on the latest.
5. Click Install and wait for it to finish, then close the window and click OK.
6. Unplug the XIAO and plug it back in. The Shell at the bottom of Thonny should show the >>> prompt.

If Thonny can't find the board, put it into download mode: unplug it, hold the BOOT button (the small one marked B), plug it back in, then let go. Then try again from step 3. If it still isn't found, try a different USB-C cable, as some only carry power.

Step 5: Upload the Code:

1. Go to my GitHub repository https://github.com/TellinStories/UK-National-Grid-LED-Ring click the green Code button and choose Download ZIP.
2. Unzip it into a new, empty folder. Check the file names are exactly as below; if your browser has saved something like main (1).py, rename it, or the board will ignore it.
3. In Thonny, click the red Stop button so you see the >>> prompt. Thonny can't reach the board's files while a program is running.
4. Go to View → Files. The top half shows your computer and the bottom half shows the XIAO.
5. In the top half, open your folder and select all 11 .py files. Right-click and choose Upload to /.
6. In the Shell, type import urequests and press Enter. If nothing happens, you're done. If you get an ImportError, go to Tools → Manage packages, search for urequests and click Install.

The 11 files are:

1. main.py: Starts everything and switches between modes
2. board.py: Pin numbers and anything that differs between XIAO ESP32-C3 and Raspberry Pi Pico 2W boards
3. config.py: Saves and loads your settings.
4. wifi_setup.py: Connects to WiFi and runs the setup web page
5. leds.py: Drives the LED ring
6. status_light.py: The status patterns (spinner, breathing, flashes)
7. touch.py: Reads taps and holds on the touch sensor
8. timesync.py: Internet time and UK summer time
9. mode_grid.py: National Grid mode
10. mode_clock.py: Clock mode
11. mode_pomodoro.py: Pomodoro mode

Note: If you wired the ring or touch sensor to different pins, change LED_PIN or TOUCH_PIN in board.py before uploading.

Your settings are saved on the board in a file called config.json, which is created the first time you complete setup. Don't delete it unless you want to start again.

A note on security: your WiFi name and password are saved on the board in a plain text file (config.json), so anyone who can plug it into a computer could read them. The setup network is also open while you’re setting it up. If that’s a concern, connect it to a guest network if your router has one. Before giving the device away or getting rid of it, put it into setup mode and save a blank or dummy network, or delete config.json in Thonny.

At this point you may wish to skip to the “first time set up” and check everything works before assembling the case.

Note: I think the main version of the case (where the box and the ring are attached) is the better looking version, but it is trickier to assemble everything. The version on the second plate separates the ring and box so that you just slide the ring onto the box. Feel free to use that version if you prefer. The instructions and photos assume you are using the main / tricky version!

1. Peel the backing off the antenna and stick it to the bottom of the case (or just place it there without removing the backing). Alternatively there is a small cut away section in the back of the case to allow you to keep the antenna outside the case, which can be useful if the device will be in a location with poor WiFi signal. If you do this, skip the next step.
2. Place the interior plate over the antenna. This sits on top of the antenna to separate it from the ESP32, and it also helps hold the touch sensor and ESP32 in place.
3. Fix the touch sensor flat against the inside of the thin front wall, pad side facing outwards and with the soldered wires on the left (there is a cut out part of the wall to make room for the soldering).
4. Fit the XIAO so its is in the space in the interior plate and its USB-C socket fits into the hole in the bac of the case.
5. With the wires going through the hole at the bottom, push the LED ring into the back of the ring (as pictured). There are little tabs to hold it in place.
6. Slide the lid into place (it may need some work to make it loose enough to slide easily).You can remove this to access the boot button on the ESP32 if needed later.

Put the case together fully before plugging it in. The touch sensor calibrates itself when it powers up, so if it's moved afterwards it can behave oddly until it's restarted. For the same reason, don't touch the front of the case while plugging it in.

1. Plug the ring into a USB power supply. After a short rainbow, it shows a slow white breathing pattern, which means it's in setup mode. [CHECK: does the rainbow play before setup mode?]
2. On your phone, open the WiFi settings and join the network called GridRing-Setup. It has no password.
3. Open a web browser and go to http://192.168.4.1
4. Fill in the form:
5. WiFi name and password. The name is case-sensitive, and phone keyboards like to add a capital letter at the start, so check it carefully. The board only works with 2.4 GHz WiFi, not 5 GHz.
6. Brightness. Default is 30%
7. Top LED. Which LED sits at 12 o'clock. If the device will be right way up choose 6, if it will be connected to the bottom of a monitor choose 0 etc.
8. Colour order. The order of the five colours around the ring in grid mode.
9. Tap Save. The ring flashes green twice and restarts.
10. It shows a blue spinner while it joins your WiFi and fetches the first reading. This can take up to a minute. Then the generation mix appears.

If the ring flashes red three times, it couldn't connect. It goes back into setup mode so you can check the WiFi details.

Changing settings later. Press and hold the BOOT button for 3 seconds while the ring is running. It switches to the white breathing pattern, and you can repeat the steps above. Your saved settings are filled in, so you only need to change what you want. Don't hold BOOT while plugging it in, as that puts the board into firmware download mode instead.

The setup network is open (no password) so it's easy for anyone to use. It only runs during setup and switches off as soon as you save.

Tap the front of the case over the touch sensor to move to the next mode - it will show either 1, 2 or 3 white LEDs briefly to show you which mode it is entering. It remembers which mode it was in, so after a power cut it comes back the same.

National Grid mode

Shows the generation mix as described in Step 1, updated every five minutes.

Clock mode

This is the clock face from my RGB LED Ring Clock:

1. The hour hand is a blue LED.
2. The minute hand is the LED for the current five minutes. Its colour steps through red, orange, yellow, yellow-green and green, one step per minute, so you can read the time to the minute.
3. When both hands are on the same LED, it shows shades of purple instead.

The time comes from the internet and is re-checked every six hours. UK summer time is worked out in the code, so the clocks go forward and back on their own. It needs WiFi once after being plugged in to get the time, but keeps going if the WiFi drops after that. The summer time rule is for the UK; if you're elsewhere you'll need to change it in timesync.py.

Pomodoro mode

The ring is one hour, with each LED worth five minutes. Starting at 12 o'clock and going clockwise, there are 5 red LEDs (25 minutes of work), 1 green (a 5-minute break), then another 5 red and 1 green.

1. Hold for 1 second to start, pause or resume.
2. Hold for 3 seconds to reset.
3. While it's waiting to start or paused, the current LED pulses. While it's running, the LED stays steady.
4. The current LED slowly fades out over its five minutes, then the next one takes over.
5. When it moves from work to a break, or back again, the new LED blinks quickly for a few seconds. That's your cue to stop (or get back to it).
6. At the end of the hour the whole ring flashes and refills, ready to start again.
7. It keeps running in the background if you tap to another mode.

Status Lights

The grid display is always still, so anything moving on the ring is a status message.

1. Rainbow: Starting up
2. Blue spinner: Connecting to WiFi, or waiting for the first reading or the time
3. Slow white breathing: Setup mode – join GridRing-Setup on your phone
4. Three red flashes: Couldn't connect to WiFi (setup mode follows)
5. Two green flashes: Settings saved, restarting

Troubleshooting

It keeps going back to setup mode. The WiFi details are probably wrong. Check the name's capital letters, and make sure the network is 2.4 GHz. Check the antenna is clipped on.

My phone asks for a password for GridRing-Setup. Your phone may have remembered an older network with the same name. Tell it to forget the network, then join again.

It's stuck on the blue spinner. It may be struggling to reach the internet, or the data service may be down. Plug it into your computer, open Thonny and click Stop, then unplug and replug it and watch the Shell; it prints what it's doing.

The touch sensor misses taps or triggers on its own. Restart it without touching the case. Make sure the pad is flat against the wall with no gap, and that its wires aren't running alongside the LED ring's wires.

Thonny can't see the files on the board. Click Stop (or press Ctrl+C in the Shell) until you see >>>.

ImportError: no module named 'urequests'. Install it again as in Step 5, step 6. This happens if the lib folder on the board gets deleted.

1. The design is inspired by Kate Morley's grid.iamkate.com, which is brilliant.
2. The data comes from the free Carbon Intensity API. The code fetches the data only once every five minutes. Many thanks to them.
3. The code is released under the MIT licence.

The code already runs on a Raspberry Pi Pico 2 W as well, and I'll add a write-up for that version soon.

If you build one, I'd love to see a photo in the comments. And if anything in the instructions doesn't work for you, please let me know so I can fix it.