Apakah Roda warna & harmoni ini gratis?

Gratis dan tanpa akun. Simulasinya berjalan di peramban kamu; tidak ada yang dikirim ke server KelasGratis. Bila kamu masuk, KelasGratis hanya mencatat bahwa akunmu membuka lab ini (sekali sehari) untuk riwayat dan aktivitas komunitas.

Apa saja penyederhanaan modelnya?

Sudut harmoni di sini pilihan umum, bukan standar; sumber lain memakai sudut sedikit berbeda atau roda RYB pelukis. Warna OKLCH di luar gamut sRGB dikembalikan dengan menurunkan kroma, lebih sederhana daripada pemetaan gamut CSS Color 4. Kontras dihitung dengan rumus WCAG 2.x terhadap putih dan hitam saja; pasangan warna lain periksa di alat Pemeriksa Kontras.

Boleh dipasang di situs sekolah atau blog?

Boleh. Pasang iframe ke https://kelasgratis.com/lab/roda-warna-harmoni?embed=1; bingkainya menampilkan lab saja beserta tautan balik.

Seni & DesainGratis, tanpa loginberjalan di perangkatmu

Roda Warna dan Harmoni Warna: HSL, OKLCH, dan Kontras WCAG

Seret warna dasar di roda, bentuk harmoni komplementer sampai tetrad, lalu bandingkan putaran rona di HSL dan OKLCH beserta kontras WCAG-nya.

Seret titik besar. Sudut = rona, jarak pusat = saturasi.

AaDasarrona 60°#D9D926hitam 13,9:1 · AA lolos
Aa+90°rona 150°#26D980hitam 11,3:1 · AA lolos
Aa+180°rona 240°#2626D9putih 8,9:1 · AA lolos
Aa+270°rona 330°#D92680putih 4,6:1 · AA lolos

Tetrad (persegi): empat rona berjarak 90°Selisih kecerahan perseptual 42 poin

Putar rona di

HEX dasar

Rona60 °

Saturasi70 %

Kecerahan50 %

Kode warna

#D9D926 · rgb(217, 217, 38) · hsl(60, 70%, 50%) · oklch(85.8% 0.179 109.6)
#26D980 · rgb(38, 217, 128) · hsl(150, 70%, 50%) · oklch(78.1% 0.186 154.7)
#2626D9 · rgb(38, 38, 217) · hsl(240, 70%, 50%) · oklch(43.5% 0.254 269.1)
#D92680 · rgb(217, 38, 128) · hsl(330, 70%, 50%) · oklch(59.1% 0.220 356.7)

Cara hitung

Warna dasar hsl(60 70% 50%) = #D9D926.
Tetrad (persegi): rona digeser 0°, +90°, +180°, +270° lalu dibawa ke 0–359° (misalnya 60° + 180° = 240°).
Di HSL, saturasi 70% dan kecerahan 50% dipertahankan.
Kontras WCAG = (L1 + 0,05) ÷ (L2 + 0,05) dengan L luminans relatif; teks biasa butuh ≥ 4,5:1, teks besar dan ikon ≥ 3:1.

Pemeriksa Kontras Ekstrak Palet

Seret titik besar di roda, atau geser rona, saturasi, dan kecerahan.
Pilih harmoni dan amati bentuknya: garis lurus untuk komplementer, segitiga untuk triad.
Ganti HSL ke OKLCH dengan warna dasar kuning atau biru; lihat selisih kecerahan berubah.
Baca “Aa” di tiap keping: teks putih atau hitam yang menang, dan lolos AA atau tidak.