Tutorial ini adalah bagian dari: Matriks LED RGB ESP32-S3
Proyek keren untuk dibuat untuk bersenang-senang dan aplikasi praktis menggunakan modul matriks RGB ESP32-S3. Tautan ke video lain ada di bawah artikel ini.
Proyek Jam Internet Matriks LED RGB ESP32-S3 - 4 Warna acak
Jam Internet ESP32-S3 dengan Warna RGB Acak
Proyek ini adalah Jam Internet RGB Matrix ESP32-S3 yang terhubung ke Wi-Fi, menyinkronkan waktu lokal dari server NTP, dan menampilkan waktu berjalan dalam format HH:MM di NeoMatrix RGB 8×8 bawaan. Pada versi ini, jam, titik dua, dan menit masing-masing dirender dalam warna acak yang dipilih pada setiap siklus gulir penuh, menciptakan tampilan jam yang dinamis dan menyenangkan yang terus berubah.

Cara kerja jam ini
Setelah menyalakan board melalui USB-C, ESP32-S3 terhubung ke jaringan Wi-Fi Anda dan mengambil waktu lokal saat ini dari internet. Waktu dibagi menjadi tiga bagian—jam, titik dua, dan menit—dan setiap bagian digambar secara terpisah pada matriks RGB. Saat teks bergulir sepenuhnya keluar layar, warna acak baru dipilih untuk putaran berikutnya.
Pustaka yang digunakan
Sketsa ini menggunakan pustaka berikut:

#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>
Instal Adafruit NeoMatrix dari Arduino Library Manager. Dependensi yang diperlukan seperti Adafruit GFX Library dan Adafruit NeoPixel akan terinstal secara otomatis.

Konfigurasi pengguna yang penting
Pin data matriks (matriks RGB bawaan)
Meskipun matriks RGB terintegrasi di board, pin data tetap harus didefinisikan dalam kode:

#define MATRIX_PIN 14
GPIO 14 umumnya digunakan pada board matriks RGB ESP32-S3. Jika varian board Anda menggunakan pin yang berbeda, perbarui nilai ini sesuai.
SSID dan kata sandi Wi-Fi (peka huruf besar/kecil)
Ganti kredensial Wi-Fi dengan detail jaringan Anda sendiri:
const char* WIFI_SSID = "SSID WiFi Anda";
const char* WIFI_PASSWORD = "kataSandi";
Penting: SSID Wi-Fi bersifat peka huruf besar/kecil. SSID bernama "Book" tidak sama dengan "book". Jika kapitalisasi tidak cocok persis, ESP32-S3 akan gagal terhubung.
Server NTP, zona waktu, dan waktu musim panas
Sinkronisasi waktu dilakukan menggunakan server NTP internet:
const char* ntpServer = "pool.ntp.org";
Waktu lokal dihitung menggunakan offset UTC dan waktu musim panas:
// Seperti Toronto: UTC-5, ditambah 1 jam DST
const long gmtOffset_sec = -5 * 3600;
const int daylightOffset_sec = 3600;
gmtOffset_sec: Offset UTC dalam detik (sesuaikan dengan lokasi Anda)daylightOffset_sec: Gunakan3600saat DST aktif, atau0jika tidak
Pengaturan ini diterapkan menggunakan:
configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);
Kecerahan siang / malam otomatis
Jam secara otomatis menyesuaikan kecerahan berdasarkan jam saat ini:
const int DAY_BRIGHTNESS = 40;
const int NIGHT_BRIGHTNESS = 5;
const int NIGHT_START_HOUR = 22;
const int NIGHT_END_HOUR = 6;
Antara pukul 10 malam dan 6 pagi, tampilan meredup untuk mengurangi silau di lingkungan gelap. Selama jam siang, matriks kembali ke kecerahan normal.
Perilaku warna RGB acak
Daftar warna RGB yang telah ditentukan disimpan dalam array, di mana setiap warna didefinisikan menggunakan nilai Merah, Hijau, dan Biru mulai dari 0 hingga 255:
uint8_t userColors[][3] = {
{255, 0, 0}, // Merah
{0, 255, 0}, // Hijau
{0, 0, 255}, // Biru
{255, 165, 0}, // Oranye
{255, 0, 255}, // Magenta
{0, 255, 255}, // Cyan
{255, 255, 0} // Kuning
};
Pada setiap siklus gulir penuh:
- Digit jam diberi warna acak
- Titik dua menerima warna acak yang berbeda
- Digit menit menerima warna acak lainnya
Ini menghasilkan kombinasi warna yang terus berubah yang membuat jam tetap menarik secara visual. Untuk membuat warna khusus Anda sendiri, Anda dapat menggunakan alat RGB Color Picker: RGB Color Picker.
Logika rendering waktu
Waktu dibagi menjadi tiga komponen:
- Jam:
HH - Titik dua:
: - Menit:
MM
Setiap bagian digambar secara individual sehingga dapat memiliki warnanya sendiri, sementara semua bagian bergerak bersama untuk membentuk animasi gulir yang halus di layar 8×8.
Generasi warna acak
Untuk memastikan keacakan warna, sketsa menginisialisasi generator angka acak saat startup menggunakan pin analog yang tidak terhubung:
randomSeed(analogRead(0));
Ini memastikan bahwa kombinasi warna berbeda pada setiap penyalaan dan setiap siklus gulir.
Demonstrasi
Setelah mengunggah sketsa dan menyalakan board melalui USB-C:
- ESP32-S3 terhubung ke jaringan Wi-Fi Anda
- Waktu disinkronkan dari internet
- Waktu bergulir dalam format
HH:MM - Jam, titik dua, dan menit berubah menjadi warna acak setiap siklus
- Tampilan secara otomatis meredup di malam hari
Unduhan dan tautan
Kode sumber lengkap disediakan di bawah artikel ini. Alat dan referensi yang berguna ditautkan di bawah artikel ini.
Tutorial ini adalah bagian dari: Matriks LED RGB ESP32-S3
- Proyek Matriks LED RGB ESP32-S3 1- Titik Dasar
- Proyek Matriks LED RGB ESP32-S3 2 - Teks Berjalan
- Proyek Matriks LED RGB ESP32-S3 3 - Teks dari ponsel
- Proyek Matriks LED RGB ESP32-S3 4 - Titik miring
- Proyek Matriks LED RGB ESP32-S3 5 - Panah selalu ke atas
- Proyek Matriks LED RGB ESP32-S3 6 - Permainan Cible
- Proyek Jam Wi-Fi + NTP dengan Matriks LED RGB ESP32-S3 -1 Jam Dasar
- Proyek Jam Internet Matriks LED RGB ESP32-S3 - 2 Jam Tampilan Waktu & Tanggal Multi Warna
- Proyek Jam Internet Matriks LED RGB ESP32-S3 - 3 Warna Malam dengan Tanggal
- Proyek Jam Internet Matriks LED RGB ESP32-S3 - 5 Warna Pelangi
- ESP32-S3 RGB LED Matrix test for RGB, GRB setting
/*
* =====================================================================================
* ESP32-S3 INTERNET RGB CLOCK (8x8 Matrix) - Project 4- Random Color
* =====================================================================================
watch video https://youtube.com/shorts/4iWjLiD7fS8
📚⬇️ Download and resource page https://robojax.com/RJT843
* Author: Gemini (AI Thought Partner) & Ahmad Shamshiri (Robojax.com)
* Date: 07 Jan 2026
* * FEATURES:
* 1. WiFi/NTP Time: Syncs automatically with internet time servers.
* 2. Cycle-Based Color: Color changes ONLY after the time finishes a full scroll.
* 3. Auto-Brightness: Dims the LEDs during night hours (User-configurable).
* =====================================================================================
*/
/*
* =====================================================================================
* ESP32-S3 INTERNET CLOCK - MULTI-COLOR ELEMENTS
* =====================================================================================
* Each part of the time (HH : MM) gets a different random color from your list.
* Colors only change once the full scroll cycle is finished.
* =====================================================================================
*/
#include <WiFi.h>
#include "time.h"
#include <Adafruit_GFX.h>
#include <Adafruit_NeoMatrix.h>
#include <Adafruit_NeoPixel.h>
#define MATRIX_PIN 14
// --- CONFIGURATION ---
const int DAY_BRIGHTNESS = 40;
const int NIGHT_BRIGHTNESS = 5;
const int NIGHT_START_HOUR = 22;
const int NIGHT_END_HOUR = 6;
uint8_t userColors[][3] = {
{255, 0, 0}, // Red
{0, 255, 0}, // Green
{0, 0, 255}, // Blue
{255, 165, 0}, // Orange
{255, 0, 255}, // Magenta
{0, 255, 255}, // Cyan
{255, 255, 0} // Yellow
};
int totalColors = sizeof(userColors) / sizeof(userColors[0]);
// Variables to store the current random color indices
int hourColorIdx = 0;
int colonColorIdx = 1;
int minColorIdx = 2;
// --- GLOBALS ---
Adafruit_NeoMatrix matrix(8, 8, MATRIX_PIN,
NEO_MATRIX_TOP + NEO_MATRIX_LEFT +
NEO_MATRIX_ROWS + NEO_MATRIX_PROGRESSIVE,
NEO_RGB + NEO_KHZ800);
char hourText[3], minText[3];
int16_t scrollX = 8;
unsigned long lastScrollMs = 0;
const uint16_t scrollIntervalMs = 100;
// 👇 REPLACE these with your real home WiFi name & password
const char* WIFI_SSID = "your WiFi SSID";
const char* WIFI_PASSWORD = "passW0rd";
// NTP (time) server
const char* ntpServer = "pool.ntp.org";
// Toronto-ish: UTC-5, plus 1 hour DST
const long gmtOffset_sec = -5 * 3600; // -5 hours
const int daylightOffset_sec = 3600; // +1 hour for DST
void updateTimeParts() {
struct tm timeinfo;
if (!getLocalTime(&timeinfo)) return;
snprintf(hourText, sizeof(hourText), "%02d", timeinfo.tm_hour);
snprintf(minText, sizeof(minText), "%02d", timeinfo.tm_min);
if (timeinfo.tm_hour >= NIGHT_START_HOUR || timeinfo.tm_hour < NIGHT_END_HOUR) {
matrix.setBrightness(NIGHT_BRIGHTNESS);
} else {
matrix.setBrightness(DAY_BRIGHTNESS);
}
}
void scrollTime() {
matrix.fillScreen(0);
int x = scrollX;
// 1. Draw Hours
matrix.setTextColor(matrix.Color(userColors[hourColorIdx][0], userColors[hourColorIdx][1], userColors[hourColorIdx][2]));
matrix.setCursor(x, 0);
matrix.print(hourText);
x += 12; // Move 12 pixels (2 digits * 6px)
// 2. Draw Colon
matrix.setTextColor(matrix.Color(userColors[colonColorIdx][0], userColors[colonColorIdx][1], userColors[colonColorIdx][2]));
matrix.setCursor(x, 0);
matrix.print(":");
x += 6; // Move 6 pixels
// 3. Draw Minutes
matrix.setTextColor(matrix.Color(userColors[minColorIdx][0], userColors[minColorIdx][1], userColors[minColorIdx][2]));
matrix.setCursor(x, 0);
matrix.print(minText);
matrix.show();
scrollX--;
// Total width is roughly 30 pixels (HH=12, :=6, MM=12)
if (scrollX < -30) {
scrollX = matrix.width();
// Pick NEW random colors for the next cycle
hourColorIdx = random(0, totalColors);
colonColorIdx = random(0, totalColors);
minColorIdx = random(0, totalColors);
}
}
void setup() {
Serial.begin(115200);
// Seed the random generator using an unconnected analog pin
randomSeed(analogRead(0));
WiFi.begin(WIFI_SSID, WIFI_PASSWORD);
while (WiFi.status() != WL_CONNECTED) delay(500);
// Configure time via NTP
configTime(gmtOffset_sec, daylightOffset_sec, ntpServer);
Serial.println("Waiting for time...");
delay(2000); // small wait for initial sync
matrix.begin();
matrix.setTextWrap(false);
matrix.setBrightness(DAY_BRIGHTNESS);
}
void loop() {
if (millis() % 1000 == 0) updateTimeParts();
if (millis() - lastScrollMs >= scrollIntervalMs) {
lastScrollMs = millis();
scrollTime();
}
}
Sumber daya & referensi
-
Video
-
Internal🎨 Color picker Toolrobojax.com
Berkas📁
File Fritzing
-
esp32-S3-supermini-tht fritzing part
esp32-S3-supermini-tht.fzpz0.02 MB