UnitConv
Desain

Generator Palet Warna

Pilih warna dasar dan hasilkan seketika harmoni teori warna — komplementer, analog, triadik, tetradik, komplementer terpisah, dan monokromatik — sebagai swatch langsung yang bisa kamu salin sebagai HEX, RGB, HSL, variabel CSS, atau konfigurasi Tailwind.

Komplementer

Warna dasar dan lawannya pada roda warna (hue + 180°) — pasangan dengan kontras tertinggi.

#3498DB
rgb(52, 152, 219)
hsl(204, 70%, 53%)
#DB7633
rgb(219, 118, 51)
hsl(24, 70%, 53%)

Analog

Warna dasar diapit dua tetangganya pada roda warna (hue ± 30°) — skema yang tenang dan padu.

#33DBCA
rgb(51, 219, 202)
hsl(174, 70%, 53%)
#3498DB
rgb(52, 152, 219)
hsl(204, 70%, 53%)
#3344DB
rgb(51, 68, 219)
hsl(234, 70%, 53%)

Triadik

Tiga warna berjarak merata 120° (hue, +120°, +240°) — semarak namun seimbang.

#3498DB
rgb(52, 152, 219)
hsl(204, 70%, 53%)
#DB3398
rgb(219, 51, 152)
hsl(324, 70%, 53%)
#98DB33
rgb(152, 219, 51)
hsl(84, 70%, 53%)

Tetradik (Persegi Panjang)

Empat warna yang membentuk persegi panjang pada roda warna (hue, +90°, +180°, +270°) — dua pasang komplementer.

#3498DB
rgb(52, 152, 219)
hsl(204, 70%, 53%)
#CA33DB
rgb(202, 51, 219)
hsl(294, 70%, 53%)
#DB7633
rgb(219, 118, 51)
hsl(24, 70%, 53%)
#44DB33
rgb(68, 219, 51)
hsl(114, 70%, 53%)

Komplementer terpisah

Warna dasar ditambah dua warna di kedua sisi komplemennya (hue +150° dan +210°) — kontras kuat yang lebih mudah diseimbangkan.

#3498DB
rgb(52, 152, 219)
hsl(204, 70%, 53%)
#DB3344
rgb(219, 51, 68)
hsl(354, 70%, 53%)
#DBCA33
rgb(219, 202, 51)
hsl(54, 70%, 53%)

Monokromatik

Satu hue yang ditampilkan sebagai gradasi lightness dari terang ke gelap — skala yang harmonis dengan mudah.

#D4E9F7
rgb(212, 233, 247)
hsl(204, 69%, 90%)
#86C2EA
rgb(134, 194, 234)
hsl(204, 70%, 72%)
#389ADC
rgb(56, 154, 220)
hsl(204, 70%, 54%)
#1C699C
rgb(28, 105, 156)
hsl(204, 70%, 36%)
#0E344E
rgb(14, 52, 78)
hsl(204, 70%, 18%)

Ekspor palet

Salin harmoni terpilih sebagai custom property CSS siap tempel atau konfigurasi warna Tailwind.

:root {
  --color-1: #3498DB;
  --color-2: #DB7633;
}

Tentang Generator Palet Warna

Generator palet warna mengubah satu warna dasar menjadi sekumpulan warna yang serasi, memakai geometri roda warna. Harmoni teori warna sebenarnya hanyalah hubungan yang terdefinisi antar-hue: warna yang saling berhadapan, bersebelahan, atau tersebar merata mengelilingi roda. Alat ini mengambil warna dasarmu, membaca hue, saturasi, dan lightness-nya (HSL), lalu memutar hue sebesar nilai tetap untuk membangun enam skema klasik — komplementer (hue + 180°), analog (hue ± 30°), triadik (berjarak 120°), tetradik atau persegi panjang (berjarak 90°), komplementer terpisah (di kedua sisi komplemen), dan monokromatik (satu hue, lightness bervariasi). Setiap palet ditampilkan sebagai swatch langsung sehingga kamu melihat hubungannya alih-alih sekadar membaca angka, dan setiap warna disertai nilai HEX, RGB, dan HSL yang siap disalin. Saat kamu punya skema yang disukai, ekspor sebagai custom property CSS atau konfigurasi warna Tailwind dan pasang langsung ke proyek. Alat ini dibuat untuk desainer, pengembang, ilustrator, dan siapa pun yang memilih warna untuk situs web, merek, bagan, dek slide, atau interior — cara cepat berpindah dari satu warna yang kamu suka ke satu palet utuh yang seimbang.

Cara memakai generator ini

  1. 1 Pilih warna dasar dengan pemilih swatch, atau ketik nilai hex apa pun (misalnya #3498DB atau #39F) ke dalam kolom.
  2. 2 Telusuri enam bagian harmoni — komplementer, analog, triadik, tetradik, komplementer terpisah, dan monokromatik — masing-masing ditampilkan sebagai swatch warna langsung.
  3. 3 Salin warna tunggal mana pun sebagai HEX lewat tombol pada setiap swatch; setiap swatch juga menampilkan nilai RGB dan HSL yang sesuai.
  4. 4 Pilih palet dan format pada kotak ekspor untuk menyalin custom property CSS atau konfigurasi warna Tailwind, lalu tempelkan ke proyekmu.

Cara kerja harmoni warna (roda warna)

Setiap harmoni adalah rotasi hue warna dasar mengelilingi roda warna 360°, dengan saturasi dan lightness tetap sama. Bekerja dalam HSL (hue, saturasi, lightness) membuatnya mudah: hanya hue yang berubah. Komplementer — hue + 180°. Kedua warna berhadapan langsung, memberi kontras terkuat. Analog — hue − 30°, hue, hue + 30°. Warna-warna bertetangga yang menyatu mulus dan terasa harmonis. Triadik — hue, hue + 120°, hue + 240°. Tiga warna di titik-titik segitiga sama sisi: hidup namun seimbang. Tetradik (persegi panjang) — hue, hue + 90°, hue + 180°, hue + 270°. Dua pasang komplementer untuk skema empat warna yang kaya. Komplementer terpisah — hue, hue + 150°, hue + 210°. Warna dasar dengan dua hue yang mengapit komplemennya — kontras hampir setara komplementer, tetapi lebih lembut. Monokromatik — satu hue pada beberapa tingkat lightness, dari tint terang hingga shade gelap. Misalnya, warna dasar #3498DB punya hue sekitar 204°. Komplemennya adalah 204° + 180° = 24° (oranye), pasangan triadiknya di 324° dan 84°, dan komplementer terpisahnya di 354° dan 54°. Perhitungan dilakukan dalam HSL dan dikonversi kembali ke HEX untuk tiap swatch.

Pertanyaan yang sering diajukan

Apa itu warna komplementer?

Warna komplementer adalah warna yang tepat berseberangan dengan warna lain pada roda warna — rotasi hue sebesar 180°. Biru dan oranye, merah dan hijau, serta kuning dan ungu adalah pasangan komplementer. Ditempatkan bersebelahan, keduanya menciptakan kontras sekuat mungkin, sehingga tiap warna tampak lebih intens; itulah sebabnya pasangan komplementer populer untuk call to action, aksen, dan apa pun yang perlu menonjol. Generator ini menemukan komplemen dengan mengambil hue warna dasarmu dan menambahkan 180°.

Bagaimana cara membuat palet warna?

Mulailah dari satu warna dasar yang kamu suka, lalu gunakan hubungan teori warna untuk menurunkan sisanya alih-alih menebak. Pilih harmoni yang sesuai suasana: skema analog atau monokromatik terasa tenang dan menyatu, sedangkan komplementer, triadik, dan komplementer terpisah menambah kontras dan energi. Jaga saturasi dan lightness tetap konsisten agar warna terasa sebagai satu set, dan batasi pada segelintir warna ditambah netral. Alat ini mengotomatiskan proses itu — masukkan warna dasar dan ia menghasilkan enam palet siap pakai yang bisa kamu salin sebagai HEX, RGB, HSL, variabel CSS, atau konfigurasi Tailwind.

Apa itu skema warna triadik?

Skema warna triadik memakai tiga warna yang tersebar merata mengelilingi roda warna, berjarak 120° — misalnya merah, biru, dan kuning. Palet triadik semarak dan penuh kontras namun tetap terasa seimbang, karena ketiga hue berjarak sama satu sama lain. Pendekatan umum adalah membiarkan satu warna mendominasi dan memakai dua lainnya sebagai aksen. Dalam generator ini, palet triadik adalah warna dasarmu ditambah hue di +120° dan +240°.

Apa itu skema warna analog?

Skema warna analog memakai warna-warna yang bersebelahan pada roda, biasanya dalam kisaran sekitar 30° dari hue dasar — seperti biru, biru-hijau, dan hijau. Karena hue-nya begitu berdekatan, palet analog tampak mulus, alami, dan harmonis, itulah sebabnya ia begitu sering muncul di alam (matahari terbenam, dedaunan, lautan). Kontrasnya lebih rendah daripada skema komplementer, jadi ada baiknya memilih satu warna dominan. Alat ini membangun palet analog dari hue di −30°, warna dasar, dan +30°.

Alat desain & warna terkait

Generator palet berpadu alami dengan konverter warna untuk menerjemahkan swatch mana pun antara HEX, RGB, HSL, HSV, dan CMYK, pemeriksa kontras untuk memastikan warna pilihanmu terbaca dan sesuai WCAG, generator gradien CSS untuk memadukan warna palet menjadi latar yang halus, dan kalkulator rasio aspek untuk sisa alur kerja desainmu.