Cara Praktis Memilih Gradient untuk Website
Ada kalanya ketika kita sedang membuat desain website kita merasa kebingungan dalam hal pemilihan warna, baik itu untuk background, komponen button dan lain-lain. Mungkin biasanya kita memulai dari hal yang lebih umum yaitu memilih tema / skema warna website kita, entah itu bernuansa dark, light, atau malah colorful. Dalam proses pemilihan warna tersebut, salah satu pemilihan warna yang dapat kita terapkan untuk mempercantik tampilan website kita adalah dengan menerapkan Gradient atau gradasi warna.
Gradient atau gradasi warna merupakan pola warna yang bisa dikembangkan dari dua atau lebih warna, sehingga membuat tingkatan warna tertentu dengan tidak merusak dan mengubah warna itu sendiri. Akan tetapi membuat kombinasi warna pada gradient-pun seringkali membingungkan. Bukannya mempercantik, kombinasi warna yang tidak tepat malah dapat membuat kesan kumuh ataupun norak. But behold ladies and gentlemen! as always! Hal berikut ini adalah salah satu langkah untuk membuat gradient sederhana dan tetap menarik.
Buat bentuk dasar
Buat bentuk apapun terserah anda untuk simulasi pewarnaan gradient. Disini saya memakai aplikasi Adobe XD yang biasa dipakai untuk prototyping desain untuk website ataupun mobile app. Anda juga bisa mencoba simulasi ini pada software lain seperti Photoshop, Illustrator, CorelDraw dan lain-lain.
Ganti mode warna ke linear gradient
Saya uncheck border untuk menghilangkan border dan ganti fill solid dengan linear gradient. Sekarang warna pada bentuk yang kita buat tadi menjadi gradient putih ke abu secara default.
Pilih warna yang sama pada kedua ujung gradient
Pada kedua ujung warna gradient pilih warna yang sama, sebagai patokan warna dasar untuk gradient yang kita kehendaki sesuai selera. Disini saya pilih warna yang agak kebiruan.
Ganti mode pemilihan warna dengan HSB
Pada mode Hex, ganti mode pemilihan warna dengan HSB. Kemudian akan ada 3 parameter secara berurutan yaitu H (Hue), S (Saturation) dan B (Brightness). Disinilah kita mulai eksperimen secara sederhana. Pilih salah satu ujung warna pada gradient tersebut, kemudian cobalah naikkan ataupun turunkan H (Hue) sebanyak sekitar 10 sampai 25. Dengan mengubah nilai H (Hue) tersebut, gradient yang warna yang dihasilkan akan tetap natural dan halus. Sudah terlihat bedanya? 😊
Anda juga dapat bereksperimen dengan menaikkan atau menurunkan nilai B (Brightness) sebanyak sekitar 5 sampai 15. Dengan ini dapat mempertegas ataupun memperhalus warna gradient yang dihasilkan.
Arah kemiringan gradient
Kemiringan gradient juga dapat kita coba eksperimen untuk menghasilkan gradient yang keren. Biasanya saya akan miringkan 20–45 degree sudah cukup.
Demikian cara singkat untuk menghasilkan paduan warna gradient yang sederhana tapi keren dan enak dilihat. Anda juga bisa bereksperimen dengan warna dasar yang lain sesuai selera. Dibawah ini contoh eksperimen warna dasar lain yang dibuat gradient dengan metode yang sama. 😊
Thanks for reading, keep experimenting!