ESP8266 - TM1637 4-Digit 7-Segment Display
Let's get your ESP8266 up and running with a TM1637 4-digit 7-segment display. The ESP8266 is a compact, affordable Wi-Fi microcontroller - perfect for lightweight IoT projects that need a simple numeric output.
Here is what we will cover:
- Wiring the TM1637 module to the ESP8266.
- Displaying integers, text strings, and temperature.
- Showing time in HH:MM format with a blinking colon.
- Setting individual digits and controlling brightness.
Hardware Preparation
Or you can buy the following kits:
| 1 | × | DIYables Sensor Kit (18 sensors/displays) |
Disclosure: Some of the links provided in this section are Amazon affiliate links. We may receive a commission for any purchases made through these links at no additional cost to you.
Additionally, some of these links are for products from our own brand, DIYables .
Additionally, some of these links are for products from our own brand, DIYables .
Getting to Know the TM1637 Display Module
The TM1637 is a dedicated driver IC for 7-segment LED displays. It talks to the microcontroller through a 2-wire serial link (CLK and DIO) and handles all the LED multiplexing internally. Once you send data to the TM1637, the display keeps showing it until you change it.
What the module offers:
- 4 digits, 7 segments plus decimal point each
- Colon separator between digit 1 and 2
- 8 brightness levels, software-controllable
- Works at 3.3V - perfect for the ESP8266's logic level
- No continuous refresh needed
| Function | Pin |
|---|---|
| CLK | Clock signal |
| DIO | Data I/O |
| VCC | 3.3V or 5V |
| GND | Ground |
Connect CLK and DIO to any available GPIO pins on the ESP8266. Avoid GPIO0, GPIO2, and GPIO15 since those affect boot mode.
Wiring Diagram
Connect the TM1637 to the ESP8266 NodeMCU:
- CLK to D2
- DIO to D1
- VCC to 3.3V
- GND to GND
This image is created using Fritzing. Click to enlarge image
See more in ESP8266's pinout and how to supply power to the ESP8266 and other components.
Adding the Library
- Connect the ESP8266 to your computer with a USB cable.
- Open Arduino IDE. Select NodeMCU 1.0 (ESP-12E Module) as the board and pick the right port.
- Head to the Libraries section on the left.
- Look up "DIYables_4Digit7Segment_TM1637" and find the DIYables library.
- Tap Install.
The library ships with everything it needs - no extra dependencies.
Quick Start Code
The shortest sketch to see results:
#include <DIYables_4Digit7Segment_TM1637.h>
#define CLK_PIN D2
#define DIO_PIN D1
DIYables_4Digit7Segment_TM1637 display(CLK_PIN, DIO_PIN);
void setup() {
display.begin();
display.print(1234);
}
void loop() {
}
Create the display with the GPIO numbers for CLK and DIO, call begin(), and start displaying data right away.
Try It Out - Integer Display
Displays a series of integers including negative numbers and zero-padded values.
/*
* This ESP8266 NodeMCU code was developed by newbiely.com
*
* This ESP8266 NodeMCU code is made available for public use without any restriction
*
* For comprehensive instructions and wiring diagrams, please visit:
* https://newbiely.com/tutorials/esp8266/esp8266-tm1637-4-digit-7-segment-display
*/
/*
* DIYables_4Digit7Segment_TM1637 - Integer Example
*
* Displays various integer values on a 4-digit 7-segment display
* with TM1637 driver, including zero-padded numbers.
*
* Tutorial: https://diyables.io/products/4-digit-7-segment-display-led-tm1637-with-colon
*
* TESTED HARDWARE:
* - Arduino Uno R3
* - Arduino Uno R4 WiFi
* - Arduino Uno R4 Minima
* - Arduino Mega
* - Arduino Due
* - Arduino Giga
* - DIYables STEM V3: https://diyables.io/stem-v3
* - DIYables STEM V4 IoT: https://diyables.io/stem-v4-iot
* - DIYables STEM V4B IoT: https://diyables.io/stem-v4b-iot
* - DIYables STEM V4B Edu: https://diyables.io/stem-v4-edu
* - DIYables MEGA2560 R3: https://diyables.io/atmega2560-board
* - DIYables Nano R3: https://diyables.io/nano-board
* - DIYables ESP32 Board: https://diyables.io/esp32-board
* - DIYables ESP32 S3, Uno-form factor: https://diyables.io/esp32-s3-uno
* - It is expected to work with other boards
*/
#include <DIYables_4Digit7Segment_TM1637.h>
// Pin configuration - change to match your wiring
#define CLK_PIN D2
#define DIO_PIN D1
DIYables_4Digit7Segment_TM1637 display(CLK_PIN, DIO_PIN);
void setup() {
Serial.begin(9600);
display.begin();
Serial.println("TM1637 Integer Example");
}
void loop() {
// Display various integers
int numbers[] = {0, 42, 1234, -5, -123, 9999};
int count = sizeof(numbers) / sizeof(numbers[0]);
for (int i = 0; i < count; i++) {
display.print(numbers[i]);
Serial.print("Displaying: ");
Serial.println(numbers[i]);
delay(2000);
}
// Display with zero padding
display.print(42, true); // Shows "0042"
Serial.println("Displaying: 0042 (zero-padded)");
delay(2000);
}
Run the Code
- Wire the TM1637 module to the ESP8266 as described above.
- Plug the ESP8266 into your computer via USB.
- In Arduino IDE, pick the board and port, paste the code, and press Upload.
- Open the Serial Monitor to check the output.
The display cycles through 0, 42, 1234, -5, -123, 9999, and then "0042" zero-padded.
Handy Methods
| Method | Purpose | How to Call |
|---|---|---|
| print(int) | Show an integer | display.print(1234) |
| print(int, true) | Show with leading zeros | display.print(42, true) |
| clear() | Clear the display | display.clear() |
Try It Out - Text and Temperature
Shows text strings and formatted temperature with the degree symbol.
/*
* This ESP8266 NodeMCU code was developed by newbiely.com
*
* This ESP8266 NodeMCU code is made available for public use without any restriction
*
* For comprehensive instructions and wiring diagrams, please visit:
* https://newbiely.com/tutorials/esp8266/esp8266-tm1637-4-digit-7-segment-display
*/
/*
* DIYables_4Digit7Segment_TM1637 - TextAndDegree Example
*
* Displays text strings, special characters, and temperature
* on a 4-digit 7-segment display with TM1637 driver.
*
* Tutorial: https://diyables.io/products/4-digit-7-segment-display-led-tm1637-with-colon
*
* TESTED HARDWARE:
* - Arduino Uno R3
* - Arduino Uno R4 WiFi
* - Arduino Uno R4 Minima
* - Arduino Mega
* - Arduino Due
* - Arduino Giga
* - DIYables STEM V3: https://diyables.io/stem-v3
* - DIYables STEM V4 IoT: https://diyables.io/stem-v4-iot
* - DIYables STEM V4B IoT: https://diyables.io/stem-v4b-iot
* - DIYables STEM V4B Edu: https://diyables.io/stem-v4-edu
* - DIYables MEGA2560 R3: https://diyables.io/atmega2560-board
* - DIYables Nano R3: https://diyables.io/nano-board
* - DIYables ESP32 Board: https://diyables.io/esp32-board
* - DIYables ESP32 S3, Uno-form factor: https://diyables.io/esp32-s3-uno
* - It is expected to work with other boards
*/
#include <DIYables_4Digit7Segment_TM1637.h>
// Pin configuration - change to match your wiring
#define CLK_PIN D2
#define DIO_PIN D1
DIYables_4Digit7Segment_TM1637 display(CLK_PIN, DIO_PIN);
void setup() {
Serial.begin(9600);
display.begin();
Serial.println("TM1637 Text and Degree Example");
}
void loop() {
// Display text strings
const char* texts[] = {"HELP", "Hi", "COOL", "done"};
for (int i = 0; i < 4; i++) {
display.print(texts[i]);
Serial.print("Displaying: ");
Serial.println(texts[i]);
delay(2000);
}
// Display temperature with degree symbol
display.printTemperature(25, 'C'); // Shows "25°C"
Serial.println("Displaying: 25 degrees C");
delay(2000);
display.printTemperature(72, 'F'); // Shows "72°F"
Serial.println("Displaying: 72 degrees F");
delay(2000);
// Display string with degree constant
char buf[5];
buf[0] = '2';
buf[1] = '5';
buf[2] = DIYables_4Digit7Segment_TM1637::DEGREE;
buf[3] = 'C';
buf[4] = '\0';
display.print(buf); // Same as printTemperature(25, 'C')
Serial.println("Displaying: 25 degrees C (via print)");
delay(2000);
}
Run the Code
- Wire and upload. Open the Serial Monitor.
Shows "HELP", "Hi", "COOL", "done", then "25°C" and "72°F".
Handy Methods
| Method | Purpose | How to Call |
|---|---|---|
| print(const char*) | Display text | display.print("HELP") |
| printTemperature(int, char) | Show temperature | display.printTemperature(25, 'C') |
| DEGREE | Degree character | display.DEGREE |
Try It Out - Time with Colon
Shows time in HH:MM format with the colon blinking every 500ms.
/*
* This ESP8266 NodeMCU code was developed by newbiely.com
*
* This ESP8266 NodeMCU code is made available for public use without any restriction
*
* For comprehensive instructions and wiring diagrams, please visit:
* https://newbiely.com/tutorials/esp8266/esp8266-tm1637-4-digit-7-segment-display
*/
/*
* DIYables_4Digit7Segment_TM1637 - Time Example
*
* Displays time in HH:MM format with blinking colon separator
* on a 4-digit 7-segment display with TM1637 driver.
*
* Tutorial: https://diyables.io/products/4-digit-7-segment-display-led-tm1637-with-colon
*
* TESTED HARDWARE:
* - Arduino Uno R3
* - Arduino Uno R4 WiFi
* - Arduino Uno R4 Minima
* - Arduino Mega
* - Arduino Due
* - Arduino Giga
* - DIYables STEM V3: https://diyables.io/stem-v3
* - DIYables STEM V4 IoT: https://diyables.io/stem-v4-iot
* - DIYables STEM V4B IoT: https://diyables.io/stem-v4b-iot
* - DIYables STEM V4B Edu: https://diyables.io/stem-v4-edu
* - DIYables MEGA2560 R3: https://diyables.io/atmega2560-board
* - DIYables Nano R3: https://diyables.io/nano-board
* - DIYables ESP32 Board: https://diyables.io/esp32-board
* - DIYables ESP32 S3, Uno-form factor: https://diyables.io/esp32-s3-uno
* - It is expected to work with other boards
*/
#include <DIYables_4Digit7Segment_TM1637.h>
// Pin configuration - change to match your wiring
#define CLK_PIN D2
#define DIO_PIN D1
DIYables_4Digit7Segment_TM1637 display(CLK_PIN, DIO_PIN);
int hours = 12;
int minutes = 30;
bool colonOn = true;
void setup() {
Serial.begin(9600);
display.begin();
Serial.println("TM1637 Time Example");
Serial.println("Displaying 12:30 with blinking colon");
}
void loop() {
display.printTime(hours, minutes, colonOn);
delay(500); // Toggle colon every 500ms for blinking effect
colonOn = !colonOn;
}
Run the Code
- Upload and watch "12:30" with the blinking colon.
Handy Methods
| Method | Purpose | How to Call | |
|---|---|---|---|
| printTime(int, int) | Display HH | MM | display.printTime(12, 30) |
| printTime(int, int, bool) | Control colon | display.printTime(12, 30, false) |
Try It Out - Blink Effect
Blinks the display using off() and on() while preserving content.
/*
* This ESP8266 NodeMCU code was developed by newbiely.com
*
* This ESP8266 NodeMCU code is made available for public use without any restriction
*
* For comprehensive instructions and wiring diagrams, please visit:
* https://newbiely.com/tutorials/esp8266/esp8266-tm1637-4-digit-7-segment-display
*/
/*
* DIYables_4Digit7Segment_TM1637 - Blink Example
*
* Blinks integer and text on a 4-digit 7-segment display
* using off() and on() to toggle the display.
*
* Tutorial: https://diyables.io/products/4-digit-7-segment-display-led-tm1637-with-colon
*
* TESTED HARDWARE:
* - Arduino Uno R3
* - Arduino Uno R4 WiFi
* - Arduino Uno R4 Minima
* - Arduino Mega
* - Arduino Due
* - Arduino Giga
* - DIYables STEM V3: https://diyables.io/stem-v3
* - DIYables STEM V4 IoT: https://diyables.io/stem-v4-iot
* - DIYables STEM V4B IoT: https://diyables.io/stem-v4b-iot
* - DIYables STEM V4B Edu: https://diyables.io/stem-v4-edu
* - DIYables MEGA2560 R3: https://diyables.io/atmega2560-board
* - DIYables Nano R3: https://diyables.io/nano-board
* - DIYables ESP32 Board: https://diyables.io/esp32-board
* - DIYables ESP32 S3, Uno-form factor: https://diyables.io/esp32-s3-uno
* - It is expected to work with other boards
*/
#include <DIYables_4Digit7Segment_TM1637.h>
// Pin configuration - change to match your wiring
#define CLK_PIN D2
#define DIO_PIN D1
DIYables_4Digit7Segment_TM1637 display(CLK_PIN, DIO_PIN);
void setup() {
Serial.begin(9600);
display.begin();
Serial.println("TM1637 Blink Example");
}
void loop() {
// Blink an integer
display.print(1234);
Serial.println("Blinking: 1234");
for (int i = 0; i < 5; i++) {
display.off();
delay(300);
display.on();
delay(300);
}
delay(1000);
// Blink text
display.print("HELP");
Serial.println("Blinking: HELP");
for (int i = 0; i < 5; i++) {
display.off();
delay(300);
display.on();
delay(300);
}
delay(1000);
}
Run the Code
- Upload and observe "1234" blinking, then "HELP" blinking.
Handy Methods
| Method | Purpose | How to Call |
|---|---|---|
| off() | Turn display off | display.off() |
| on() | Turn display on | display.on() |
| setBrightness(int) | Set brightness 0-7 | display.setBrightness(4) |
Try It Out - Individual Digits
Sets each digit independently with numbers, characters, and the colon.
/*
* This ESP8266 NodeMCU code was developed by newbiely.com
*
* This ESP8266 NodeMCU code is made available for public use without any restriction
*
* For comprehensive instructions and wiring diagrams, please visit:
* https://newbiely.com/tutorials/esp8266/esp8266-tm1637-4-digit-7-segment-display
*/
/*
* DIYables_4Digit7Segment_TM1637 - IndividualDigits Example
*
* Sets individual digits, characters, and colon on a 4-digit
* 7-segment display with TM1637 driver.
*
* Tutorial: https://diyables.io/products/4-digit-7-segment-display-led-tm1637-with-colon
*
* TESTED HARDWARE:
* - Arduino Uno R3
* - Arduino Uno R4 WiFi
* - Arduino Uno R4 Minima
* - Arduino Mega
* - Arduino Due
* - Arduino Giga
* - DIYables STEM V3: https://diyables.io/stem-v3
* - DIYables STEM V4 IoT: https://diyables.io/stem-v4-iot
* - DIYables STEM V4B IoT: https://diyables.io/stem-v4b-iot
* - DIYables STEM V4B Edu: https://diyables.io/stem-v4-edu
* - DIYables MEGA2560 R3: https://diyables.io/atmega2560-board
* - DIYables Nano R3: https://diyables.io/nano-board
* - DIYables ESP32 Board: https://diyables.io/esp32-board
* - DIYables ESP32 S3, Uno-form factor: https://diyables.io/esp32-s3-uno
* - It is expected to work with other boards
*/
#include <DIYables_4Digit7Segment_TM1637.h>
// Pin configuration - change to match your wiring
#define CLK_PIN D2
#define DIO_PIN D1
DIYables_4Digit7Segment_TM1637 display(CLK_PIN, DIO_PIN);
void setup() {
Serial.begin(9600);
display.begin();
Serial.println("TM1637 Individual Digits Example");
}
void loop() {
// Set individual numbers on each digit position
display.clear();
display.setNumber(0, 1);
display.setNumber(1, 2);
display.setNumber(2, 3);
display.setNumber(3, 4);
Serial.println("Displaying: 1234");
delay(2000);
// Turn colon on
display.setColon(true);
Serial.println("Displaying: 12:34");
delay(2000);
// Turn colon off
display.setColon(false);
Serial.println("Displaying: 1234");
delay(2000);
// Set individual characters
display.clear();
display.setChar(0, 'H');
display.setChar(1, 'E');
display.setChar(2, 'L');
display.setChar(3, 'P');
Serial.println("Displaying: HELP");
delay(2000);
// Mix characters and numbers with colon
display.clear();
display.setChar(0, 'A');
display.setNumber(1, 3);
display.setChar(2, 'b');
display.setNumber(3, 7);
display.setColon(true);
Serial.println("Displaying: A3:b7");
delay(2000);
// Blinking colon effect
display.clear();
display.setNumber(0, 1);
display.setNumber(1, 2);
display.setNumber(2, 3);
display.setNumber(3, 0);
Serial.println("Blinking colon: 12:30");
for (int i = 0; i < 5; i++) {
display.setColon(true);
delay(500);
display.setColon(false);
delay(500);
}
delay(1000);
}
Run the Code
- Upload and see the digit combinations change.
Handy Methods
| Method | Purpose | How to Call |
|---|---|---|
| setNumber(int, int) | Set digit 0-9 | display.setNumber(0, 1) |
| setChar(int, char) | Set character | display.setChar(0, 'H') |
| setColon(bool) | Control colon | display.setColon(true) |
| setSegments(int, uint8_t) | Raw segments | display.setSegments(0, 0x76) |
If Something Is Not Working
- Display is blank: Double-check all four wires. Verify CLK and DIO GPIO numbers match between the code and the physical wiring.
- Wrong output: CLK and DIO may be swapped. Switch the two signal wires.
- Dim display: Call setBrightness(7) for full brightness.
- Upload fails: Some ESP8266 boards need you to press FLASH during upload. Also check that the correct board and port are selected.
Tip: The ESP8266 has limited GPIO pins. Double-check that none of the pins you are using conflict with boot modes (GPIO0, GPIO2, GPIO15).
Platform Support
The library uses only Arduino standard APIs and runs on all Arduino-compatible platforms including ESP8266.