Penjana Palet Warna
Harmoni Warna
Two colors opposite on the color wheel
Palet Dijana
Pratonton Palet
Eksport Palet
:root {
--color-1: #3b82f6;
--color-2: #f6af3c;
}Butiran teknikal
Cara Penjana Palet Warna Berfungsi
Apa yang Alat Ini Lakukan
Penjana Palet Warna menghasilkan skema warna yang harmoni daripada sebarang warna asas menggunakan prinsip teori warna yang telah mantap. Pilih warna asas dan pilih daripada enam jenis harmoni — komplementari, analog, triadik, tetradik, split-komplementari, atau monokromatik — untuk menjana palet yang sepadan serta-merta. Setiap warna yang dijana memaparkan nilai HEX, RGB dan HSL yang sedia untuk disalin ke dalam CSS, alat reka bentuk atau panduan gaya anda.
Kes Penggunaan Pembangun yang Lazim
Pereka dan pembangun menggunakan penjana palet apabila memulakan projek baharu, membina sistem reka bentuk atau menyegarkan warna jenama. Senario biasa termasuk menjana warna aksen komplementari untuk warna jenama utama, mencipta skema warna analog untuk visualisasi data, membina palet triadik untuk tema UI yang bertenaga, dan meneroka variasi monokromatik untuk reka bentuk minimal. Alat ini juga berguna untuk menjana set sifat tersuai CSS dan token warna JSON untuk sistem reka bentuk.
Jenis Harmoni Warna
Harmoni warna berasaskan roda warna. Warna komplementari berada bertentangan antara satu sama lain (180°) dan menghasilkan kontras tinggi. Warna analog bersebelahan (±30°) dan terasa serasi. Warna triadik dijarakkan sama rata pada selang 120° untuk keseimbangan yang bertenaga. Tetradik (segi empat tepat) menggunakan empat warna pada selang 90°. Split-komplementari memadankan warna asas dengan dua warna yang bersebelahan dengan warna komplemennya. Monokromatik mengubah kecerahan dan ketepuan bagi satu rona untuk palet yang halus dan bersatu.
Perangkap Lazim dan Kes Tepi
Palet yang dijana ialah titik permulaan, bukan reka bentuk muktamad. Sentiasa semak nisbah kontras antara warna yang dijana untuk memastikan kebolehcapaian. Warna asas yang sangat tepu atau sangat gelap boleh menghasilkan palet dengan kebolehbacaan yang lemah. Ingat bahawa warna pada skrin kelihatan berbeza apabila dicetak. Uji palet dengan kandungan sebenar dan elemen UI, bukannya bergantung semata-mata pada pratonton swatch.
Bila Perlu Menggunakan Alat Ini Berbanding Kod
Gunakan alat pelayar ini untuk penerokaan interaktif dan penjanaan palet pantas semasa design sprint. Untuk sistem reka bentuk produksi, laksanakan penjanaan palet secara programatik menggunakan pustaka seperti chroma.js, culori atau polished yang boleh menjana harmoni, menguatkuasakan nisbah kontras dan berintegrasi dengan saluran binaan.