Palet Warna Web

Apakah palet warna web?

Warna sangat penting untuk pereka web dan pereka grafik. Pereka bentuk menerangkan warna yang kami huraikan sebagai biru, merah dan hijau dalam kehidupan harian dengan kod seperti #fff002, #426215. Tidak kira apa jenis projek pengekodan yang anda lakukan, anda mungkin akan mula bekerja dengan warna pada satu ketika. Ini akan membantu terutamanya jika anda belajar kod menggunakan HTML, seperti yang dilakukan oleh ramai orang untuk mereka bentuk halaman web.

Apakah maksud kod Hex dalam warna?

Kod Hex ialah cara untuk mewakili warna dalam format RGB dengan menggabungkan tiga nilai. Kod warna ini merupakan bahagian penting HTML untuk reka bentuk web dan kekal sebagai cara penting untuk mewakili format warna secara digital.

Kod warna hex bermula dengan tanda paun atau hashtag (#) diikuti dengan enam huruf atau nombor. Dua huruf/nombor pertama sepadan dengan merah, dua seterusnya kepada hijau dan dua terakhir kepada biru. Nilai warna ditakrifkan dalam nilai antara 00 dan FF.

Nombor digunakan apabila nilainya ialah 1-9. Huruf digunakan apabila nilainya lebih besar daripada 9. Cth:

• A = 10
• B = 11
• C = 12
• D = 13
• E = 14
• F = 15

Kod warna hex dan setara RGB

Menghafal beberapa kod warna heks yang paling biasa boleh membantu anda meramalkan warna lain dengan lebih baik apabila anda melihat kod warna heks, bukan hanya apabila anda ingin menggunakan warna tepat tersebut.

• Merah = #FF0000 = RGB (255, 0, 0)
• Hijau = #008000 = RGB (1, 128, 0)v
• Biru = #0000FF = RGB (0, 0, 255)
• Putih = #FFFFFF = RGB (255,255,255)
• Gading = #FFFFF0 = RGB (255, 255, 240)
• Hitam = #000000 = RGB (0, 0, 0)
• Kelabu = #808080 = RGB (128, 128, 128)
• Perak = #C0C0C0 = RGB (192, 192, 192)
• Kuning = #FFFF00 = RGB (255, 255, 0)
• Ungu = #800080 = RGB (128, 0, 128)
• Jingga = #FFA500 = RGB (255, 165, 0)
• Burgundy = #800000 = RGB (128, 0, 0)
• Fuchsia = #FF00FF = RGB (255, 0, 255)
• Limau = #00FF00 = RGB (0, 255, 0)
• Aqua = #00FFFF = RGB (0, 255, 255)
• Teal = #008080 = RGB (0, 128, 128)
• Zaitun = #808000 = RGB (128, 128, 0)
• Biru Laut = #000080 = RGB (0, 0, 128)

Mengapa warna tapak web penting?

Anda mungkin berfikir bahawa anda tidak dipengaruhi oleh warna, tetapi menurut kajian, 85% orang mengatakan bahawa warna mempunyai kesan besar pada produk yang mereka beli. Beliau juga mengatakan bahawa apabila sesetengah syarikat menukar warna butang mereka, mereka mendapati peningkatan atau penurunan mendadak dalam penukaran mereka.

Contohnya, Beamax, sebuah syarikat yang mengeluarkan skrin unjuran, melihat peningkatan besar-besaran sebanyak 53.1% dalam klik pada pautan merah berbanding pautan biru.

Warna mempunyai impak yang besar bukan sahaja pada klik tetapi juga pada pengiktirafan jenama. Kajian tentang kesan mental warna mendapati bahawa warna meningkatkan pengecaman jenama secara purata sebanyak 80%. Sebagai contoh, apabila anda memikirkan Coca-Cola, anda mungkin akan membayangkan tin merah yang bersemangat.

Bagaimana untuk memilih skema warna untuk laman web?

Untuk menentukan warna yang perlu anda pilih pada tapak web atau aplikasi web anda, anda mesti mempunyai pemahaman yang baik tentang apa yang anda jual. Sebagai contoh, jika anda cuba mencapai imej berkualiti tinggi dan berkualiti tinggi, warna yang anda patut pilih ialah ungu. Walau bagaimanapun, jika anda ingin menjangkau khalayak yang lebih luas, biru; Ia adalah warna yang menenangkan dan lembut yang sangat sesuai untuk topik yang lebih sensitif seperti kesihatan atau kewangan.

Contoh-contoh di atas telah dibuktikan oleh banyak kajian. Tetapi warna yang anda pilih untuk tapak web anda bergantung pada kerumitan reka bentuk anda dan jenis kombinasi warna. Contohnya, jika anda menggunakan palet reka bentuk web monokrom, anda mungkin memerlukan tujuh atau lebih warna warna itu untuk mendapatkan variasi yang mencukupi pada skrin. Anda perlu menetapkan warna untuk bahagian tertentu tapak anda, seperti teks, latar belakang, pautan, warna tuding, butang CTA dan pengepala.

Sekarang "Bagaimana untuk memilih skema warna untuk tapak web dan aplikasi web?" Mari kita lihat langkah demi langkah:

1. Pilih warna utama anda.

Cara terbaik untuk memutuskan warna utama adalah dengan memeriksa warna yang sepadan dengan mood produk atau perkhidmatan anda.

Di bawah kami telah menyenaraikan beberapa contoh untuk anda:

• Merah: Ia bermaksud kegembiraan atau kebahagiaan.
• Jingga: Ia menandakan masa yang mesra dan menyeronokkan.
• Kuning bermaksud optimisme dan kebahagiaan.
• Hijau: Ia bermaksud kesegaran dan alam semula jadi.
• Biru: bermaksud kebolehpercayaan dan jaminan.
• Ungu: Mewakili jenama terkenal dengan sejarah kualiti.
• Brown: Ia bermaksud produk yang boleh dipercayai yang boleh digunakan oleh semua orang.
• Hitam bermaksud kemewahan atau keanggunan.
• Putih: Merujuk kepada produk yang bergaya dan mesra pengguna.

2. Pilih warna tambahan anda.

Pilih satu atau dua warna tambahan yang melengkapkan warna utama anda. Ini sepatutnya menjadi warna yang menjadikan warna utama anda "mempesonakan".

3. Pilih warna latar belakang.

Pilih warna latar belakang yang kurang "agresif" daripada warna utama anda.

4. Pilih warna fon.

Pilih warna untuk teks di tapak web anda. Ambil perhatian bahawa fon hitam pepejal jarang berlaku dan tidak disyorkan.

Palet warna web terbaik untuk pereka

Jika anda tidak dapat mencari warna yang anda cari dalam koleksi palet warna web Softmedal, anda boleh melihat tapak warna alternatif di bawah:

Pemilihan warna adalah proses yang panjang dan selalunya memerlukan banyak penalaan halus untuk mencari warna yang betul. Pada ketika ini, anda boleh menjimatkan masa dengan menggunakan 100% aplikasi web percuma yang mencipta skema warna yang berkaitan dari awal.

1. Paletton

Paletton ialah aplikasi web yang perlu diketahui oleh semua pereka web. Hanya masukkan warna benih dan apl melakukan yang lain untuk anda. Paletton ialah pilihan yang boleh dipercayai dan aplikasi web yang hebat untuk mereka yang tidak tahu apa-apa tentang reka bentuk dan untuk pemula.

2. Warna Selamat

Jika WCAG menjadi kebimbangan dalam proses reka bentuk anda, Color Safe ialah alat terbaik untuk digunakan. Dengan aplikasi web ini, anda boleh mencipta skema warna yang menggabungkan dengan sempurna dan menawarkan kontras yang kaya mengikut garis panduan WCAG.

Dengan menggunakan apl web Color Safe, anda memastikan tapak anda mematuhi garis panduan WCAG dan boleh diakses sepenuhnya oleh semua orang.

3. Adobe Color CC

Ia adalah salah satu alat Adobe percuma yang dicipta untuk kegunaan awam. Ia adalah aplikasi web yang rumit di mana sesiapa sahaja boleh mencipta skema warna dari awal. Ia membolehkan anda memilih daripada pelbagai model warna yang paling sesuai dengan keperluan anda. Antara muka mungkin kelihatan agak mengelirukan pada mulanya, tetapi apabila anda membiasakannya, anda sepatutnya tidak mempunyai masalah untuk memilih pilihan warna yang cantik.

4. Suasana

Ambiance, aplikasi web percuma, menawarkan palet warna web pra-dibuat daripada tapak warna lain di web. Ia berfungsi seperti apl web tradisional di mana anda boleh menyimpan warna pada profil anda dan mencipta skema anda sendiri dari awal. Semua palet warna web ini datang daripada Colorlovers. Antara muka Ambiance menjadikan penyemakan imbas lebih mudah dan memberikan lebih fokus pada interaksi warna untuk reka bentuk UI.

5. 0 hingga255

0to255 bukanlah penjana skema warna, tetapi ia boleh membantu anda memperhalusi skema warna sedia ada. Apl web menunjukkan kepada anda semua warna yang berbeza supaya anda boleh mencampur dan memadankan warna serta-merta.

Jika anda merasa sukar untuk mencipta skema warna yang boleh digunakan, anda boleh menyemak beberapa aplikasi di atas.

Palet warna web terbaik

Tapak berikut menggunakan pelbagai palet warna web untuk kesan yang hebat. Mereka dipilih dengan teliti untuk emosi yang mereka bangkitkan dan emosi yang mereka sampaikan.

1. Odopod

Odopod telah direka dengan palet warna yang membosankan, tetapi bertujuan untuk mengelakkan kelihatan membosankan dengan kecerunan pada halaman utamanya. Tipografi besar menawarkan kontras yang hebat. Ia adalah jelas di mana pelawat mahu mereka klik.

2. Mata Tori

Tori's Eye ialah contoh skema warna monokrom yang bagus. Di sini, kesan palet warna yang ringkas namun berkuasa yang berpusat di sekitar rona hijau dapat dilihat. Skema warna ini biasanya mudah ditarik keluar, kerana satu warna satu warna hampir selalu berfungsi dengan warna lain dengan warna yang sama.

3. Kit Survival Keju

Merah ialah warna yang sangat popular untuk palet warna tapak web. Ia boleh menyampaikan campuran emosi yang kaya, menjadikannya serba boleh. Seperti yang anda lihat di laman web Cheese Survival Kit, ia amat mujarab apabila digunakan dalam dos yang kecil. Merah dilembutkan dengan warna yang lebih neutral, dan biru membantu dengan CTA dan kawasan lain yang perniagaan ingin menarik perhatian pelawat.

4. Ahrefs

Ahrefs ialah contoh laman web yang menggunakan palet warna secara bebas. Biru tua bertindak sebagai warna utama, tetapi variasi wujud di seluruh tapak. Begitu juga dengan warna oren, merah jambu dan turquoise.

Soalan yang paling kerap ditanya tentang warna

1. Apakah warna terbaik untuk laman web?

Biru sememangnya pilihan paling selamat kerana ia adalah warna paling popular dengan 35%. Walau bagaimanapun, jika pesaing anda semuanya menggunakan warna biru, mungkin wajar untuk "membezakan" tawaran dan jenama anda. Tetapi anda perlu memastikan anda tidak membebankan pengunjung.

2. Berapa banyak warna yang perlu ada pada tapak web?

Pertimbangkan bahawa 51% daripada jenama mempunyai logo monokrom, 39% menggunakan dua warna, dan hanya 19% daripada syarikat memilih logo berwarna penuh. Dari sini, anda dapat melihat bahawa tapak web dengan 1, 2 dan 3 warna lebih masuk akal daripada cuba membuat tapak web dengan warna pelangi. Walau bagaimanapun, jenama seperti Microsoft dan Google percaya pada kelebihan bekerja dengan lebih banyak warna kerana mereka menggunakan sekurang-kurangnya 4 warna pepejal dalam reka bentuk mereka.

3. Di manakah saya harus menggunakan warna?

Warna yang menarik perhatian harus digunakan dengan berhati-hati, jika tidak, ia akan kehilangan kesannya. Kesan ini perlu berada dalam mata penukaran seperti butang "Beli Sekarang".