ESP32-S3 RGB LED Matrix Internet Clock Project

This tutorial is part of: ESP32-S3 RGB LED Matrix

Cool project to create for fun and practical applications using ESP32-S3 RGB Matrix module.

ESP32-S3 RGB LED Matrix Internet Clock Project - 3 Night Color with Date

ESP32-S3 RGB NeoMatrix Internet Clock with Auto Day/Night Brightness

This project is an ESP32-S3 RGB Matrix Internet Clock that automatically adjusts brightness during the day and night. The ESP32-S3 connects to Wi-Fi, synchronizes the current time from an NTP server, and scrolls the time in HH:MM format across an 8×8 RGB NeoMatrix. The clock also supports fixed or cycling RGB colors for the display text.

What this clock does

After powering up, the ESP32-S3 connects to your Wi-Fi network and retrieves the current local time from the internet. The time scrolls smoothly across the LED matrix. During nighttime hours, the display automatically dims to a lower brightness, while during the day it switches back to a brighter level.

Libraries used

This sketch uses the following libraries:

#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>

Install Adafruit NeoMatrix from the Arduino Library Manager. All required dependencies such as Adafruit GFX Library and Adafruit NeoPixel will be installed automatically.

Important user configuration

Wi-Fi SSID and password (case-sensitive)

Replace the following values with your own Wi-Fi credentials:

const char* WIFI_SSID     = "WiFi";
const char* WIFI_PASSWORD = "passW0rd";

Important: Wi-Fi SSIDs are case-sensitive. An SSID named "Book" is not the same as "book". If the capitalization does not match exactly, the ESP32 will fail to connect.

NTP server, time zone, and daylight saving

The clock synchronizes time using the following NTP server:

const char* ntpServer = "pool.ntp.org";

Local time is calculated using these offsets:

const long  gmtOffset_sec     = -5 * 3600; 
const int   daylightOffset_sec = 3600;

gmtOffset_sec defines your UTC offset in seconds
daylightOffset_sec adds one hour when daylight saving time is active (use 0 if not needed)

These values are applied with:

configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);

Automatic day / night brightness

The display brightness changes automatically based on the current hour:

const int DAY_BRIGHTNESS = 40;
const int NIGHT_BRIGHTNESS = 5;
const int NIGHT_START_HOUR = 22; // 10 PM
const int NIGHT_END_HOUR = 6;    // 6 AM

Between 10 PM and 6 AM, the matrix brightness is reduced to make it comfortable in dark environments. Outside of those hours, full daytime brightness is restored. You can adjust these values to suit your room lighting.

RGB color configuration

The clock text color is defined using RGB (Red, Green, Blue) values, where each channel ranges from 0 to 255. Multiple colors can be stored in an array and automatically cycled:

uint8_t userColors[][3] = {
  {17, 43, 171},  // Light Blue
  {255, 0, 0},    // Red
  {0, 255, 0},    // Green
  {255, 165, 0},  // Orange
  {255, 0, 255}   // Magenta
};

If useFixedColor is set to true, the clock always uses one color. If set to false, the color automatically changes after each full scroll of the time.

To quickly find the exact RGB values for any color, use the RGB Color Picker tool: Color Picker .

Time display and scrolling

The current time is formatted as HH:MM and stored in a small character buffer. Because the display is only 8 pixels wide, the text scrolls smoothly from right to left. Once the time fully leaves the display, the next color (if enabled) is selected for the next pass.