Mga Palette Ng Kulay Sa Web

Ano ang mga web color palette?

Napakahalaga ng mga kulay para sa mga web designer at graphic designer. Inilalarawan ng mga designer ang mga kulay na inilalarawan namin bilang asul, pula at berde sa pang-araw-araw na buhay gamit ang mga code gaya ng #fff002, #426215. Anuman ang uri ng proyekto ng coding na iyong ginagawa, malamang na magsisimula kang magtrabaho sa mga kulay sa isang punto. Makakatulong ito lalo na kung matututo kang mag-code gamit ang HTML, tulad ng ginagawa ng maraming tao sa pagdidisenyo ng mga web page.

Ano ang ibig sabihin ng Hex code sa mga kulay?

Ang hex code ay isang paraan upang kumatawan sa isang kulay sa RGB na format sa pamamagitan ng pagsasama-sama ng tatlong value. Ang mga color code na ito ay isang mahalagang bahagi ng HTML para sa disenyo ng web at nananatiling isang mahalagang paraan upang kumatawan sa mga format ng kulay sa digital.

Ang mga code ng kulay ng hex ay nagsisimula sa pound sign o hashtag (#) na sinusundan ng anim na letra o numero. Ang unang dalawang titik/numero ay tumutugma sa pula, ang susunod na dalawa sa berde at ang huling dalawa sa asul. Ang mga halaga ng kulay ay tinukoy sa mga halaga sa pagitan ng 00 at FF.

Ang mga numero ay ginagamit kapag ang halaga ay 1-9. Ang mga titik ay ginagamit kapag ang halaga ay higit sa 9. Hal:

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

Mga code ng kulay ng hex at katumbas ng RGB

Ang pagsasaulo ng ilan sa mga pinakakaraniwang hex na color code ay maaaring makatulong upang matulungan kang mas mahulaan kung ano ang iba pang mga kulay kapag nakita mo ang hex na color code, hindi lamang kapag gusto mong gamitin ang mga eksaktong kulay na iyon.

• Pula = #FF0000 = RGB (255, 0, 0)
• Berde = #008000 = RGB (1, 128, 0)v
• Asul = #0000FF = RGB (0, 0, 255)
• Puti = #FFFFFF = RGB (255,255,255)
• Ivory = #FFFFF0 = RGB (255, 255, 240)
• Itim = #000000 = RGB (0, 0, 0)
• Gray = #808080 = RGB (128, 128, 128)
• Pilak = #C0C0C0 = RGB (192, 192, 192)
• Dilaw = #FFFF00 = RGB (255, 255, 0)
• Lila = #800080 = RGB (128, 0, 128)
• Orange = #FFA500 = RGB (255, 165, 0)
• Burgundy = #800000 = RGB (128, 0, 0)
• Fuchsia = #FF00FF = RGB (255, 0, 255)
• Lime = #00FF00 = RGB (0, 255, 0)
• Aqua = #00FFFF = RGB (0, 255, 255)
• Teal = #008080 = RGB (0, 128, 128)
• Olive = #808000 = RGB (128, 128, 0)
• Navy Blue = #000080 = RGB (0, 0, 128)

Bakit mahalaga ang mga kulay ng website?

Maaari mong isipin na hindi ka apektado ng mga kulay, ngunit ayon sa isang pag-aaral, 85% ng mga tao ang nagsasabi na ang kulay ay may malaking epekto sa produkto na kanilang binibili. Sinabi rin niya na kapag binago ng ilang kumpanya ang kanilang mga kulay ng button, napansin nila ang matinding pagtaas o pagbaba sa kanilang mga conversion.

Halimbawa, ang Beamax, isang kumpanyang gumagawa ng mga projection screen, ay nakapansin ng napakalaking 53.1% na pagtaas sa mga pag-click sa mga pulang link kumpara sa mga asul na link.

Ang mga kulay ay may malaking epekto hindi lamang sa mga pag-click kundi pati na rin sa pagkilala sa tatak. Ang isang pag-aaral sa mental na epekto ng mga kulay ay natagpuan na ang mga kulay ay nagpapataas ng pagkilala sa tatak ng average na 80%. Halimbawa, kapag iniisip mo ang Coca-Cola, malamang na maiisip mo ang makulay na pulang lata.

Paano pumili ng scheme ng kulay para sa mga website?

Upang makapagpasya kung aling mga kulay ang dapat mong piliin sa iyong website o web application, kailangan mo munang magkaroon ng isang mahusay na pag-unawa sa kung ano ang iyong ibinebenta. Halimbawa, kung sinusubukan mong makamit ang isang mas mataas na kalidad, high-end na imahe, ang kulay na dapat mong piliin ay purple. Gayunpaman, kung gusto mong maabot ang mas malawak na madla, asul; Ito ay isang nakakapanatag at malambot na kulay na angkop para sa mas sensitibong mga paksa gaya ng kalusugan o pananalapi.

Ang mga halimbawa sa itaas ay napatunayan ng maraming pag-aaral. Ngunit ang kulay na pipiliin mo para sa iyong website ay nakadepende sa pagiging kumplikado ng iyong disenyo at sa mga uri ng mga kumbinasyon ng kulay. Halimbawa, kung gumagamit ka ng monochrome web design palette, maaaring kailanganin mo ng pito o higit pang mga shade ng kulay na iyon upang makakuha ng sapat na pagkakaiba-iba sa screen. Kailangan mong magtakda ng mga kulay para sa ilang partikular na bahagi ng iyong site, tulad ng teksto, mga background, mga link, mga kulay ng hover, mga pindutan ng CTA, at mga header.

Ngayon "Paano pumili ng scheme ng kulay para sa mga website at web application?" Tingnan natin ito nang sunud-sunod:

1. Piliin ang iyong mga pangunahing kulay.

Ang pinakamahusay na paraan upang magpasya sa isang pangunahing kulay ay upang suriin ang mga kulay na tumutugma sa mood ng iyong produkto o serbisyo.

Sa ibaba ay naglista kami ng ilang halimbawa para sa iyo:

• Pula: Nangangahulugan ito ng kaguluhan o kaligayahan.
• Orange: Ito ay nagpapahiwatig ng isang palakaibigan, masaya na oras.
• Ang dilaw ay nangangahulugang optimismo at kaligayahan.
• Berde: Nangangahulugan ito ng pagiging bago at kalikasan.
• Asul: nangangahulugang pagiging maaasahan at katiyakan.
• Lila: Kumakatawan sa isang kilalang tatak na may kasaysayan ng kalidad.
• Brown: Ang ibig sabihin nito ay isang maaasahang produkto na magagamit ng lahat.
• Ang itim ay nangangahulugang luho o gilas.
• Puti: Tumutukoy sa mga naka-istilong produkto na madaling gamitin.

2. Piliin ang iyong mga karagdagang kulay.

Pumili ng isa o dalawang karagdagang mga kulay na umakma sa iyong pangunahing kulay. Ang mga ito ay dapat na ang mga kulay na ginagawang "nakamamanghang" ang iyong pangunahing kulay.

3. Pumili ng kulay ng background.

Pumili ng kulay ng background na hindi gaanong "agresibo" kaysa sa iyong pangunahing kulay.

4. Piliin ang kulay ng font.

Pumili ng kulay para sa teksto sa iyong website. Tandaan na ang isang solid na itim na font ay bihira at hindi inirerekomenda.

Ang pinakamahusay na mga web color palette para sa mga designer

Kung hindi mo mahanap ang kulay na iyong hinahanap sa koleksyon ng Softmedal web color palettes, maaari mong tingnan ang mga alternatibong color sites sa ibaba:

Ang pagpili ng kulay ay isang mahabang proseso at kadalasan ay nangangailangan ng maraming fine-tuning upang mahanap ang mga tamang kulay. Sa puntong ito, makakatipid ka ng oras sa pamamagitan ng paggamit ng 100% libreng web application na lumikha ng mga nauugnay na scheme ng kulay mula sa simula.

1. Paletton

Ang Paletton ay isang web application na dapat malaman ng lahat ng web designer. Maglagay lamang ng kulay ng binhi at gagawin ng app ang natitira para sa iyo. Ang Paletton ay isang maaasahang pagpipilian at isang mahusay na web app para sa mga walang alam tungkol sa disenyo at para sa mga nagsisimula.

2. Color Safe

Kung ang WCAG ay anumang alalahanin sa iyong proseso ng disenyo, ang Color Safe ang pinakamahusay na tool na gagamitin. Gamit ang web application na ito, maaari kang lumikha ng mga scheme ng kulay na perpektong pinaghalong at nag-aalok ng malaking kaibahan ayon sa mga alituntunin ng WCAG.

Sa pamamagitan ng paggamit ng Color Safe web app, tinitiyak mong sumusunod ang iyong site sa mga alituntunin ng WCAG at ganap na naa-access ng lahat.

3. Adobe Color CC

Ito ay isa sa mga libreng tool ng Adobe na nilikha para sa pampublikong paggamit. Ito ay isang detalyadong web application kung saan sinuman ay maaaring lumikha ng mga scheme ng kulay mula sa simula. Pinapayagan ka nitong pumili mula sa maraming iba't ibang mga modelo ng kulay na pinakaangkop sa iyong mga pangangailangan. Ang interface ay maaaring mukhang medyo nakakalito sa simula, ngunit kapag nasanay ka na, wala kang problema sa pagpili ng magagandang pagpipilian sa kulay.

4. Ambiance

Ang ambiance, isang libreng web application, ay nag-aalok ng mga pre-made na web color palette mula sa iba pang mga color site sa web. Gumagana ito tulad ng isang tradisyonal na web app kung saan maaari kang mag-save ng mga kulay sa iyong profile at lumikha ng iyong sariling mga scheme mula sa simula. Lahat ng mga web color palette na ito ay nagmula sa Colorlovers. Ang interface ng Ambiance ay nagpapadali sa pagba-browse at naglalagay ng higit na pagtuon sa color interplay para sa disenyo ng UI.

5. 0to255

Ang 0to255 ay hindi eksaktong generator ng scheme ng kulay, ngunit makakatulong ito sa iyong ayusin ang mga kasalukuyang color scheme. Ipinapakita sa iyo ng web app ang lahat ng iba't ibang kulay upang agad mong maihalo at itugma ang mga kulay.

Kung nahihirapan kang lumikha ng magagamit na scheme ng kulay, maaari mong suriin ang ilan sa mga application sa itaas.

Ang pinakamahusay na mga palette ng kulay ng web

Gumagamit ang mga sumusunod na site ng iba't ibang mga palette ng kulay ng web para sa mahusay na epekto. Maingat na pinipili ang mga ito para sa mga emosyon na kanilang pinupukaw at sa mga emosyon na kanilang ipinapahayag.

1. Odopod

Ang Odopod ay idinisenyo gamit ang isang monotonous na paleta ng kulay, ngunit naglalayong maiwasang magmukhang boring na may gradient sa homepage nito. Ang malaking palalimbagan ay nag-aalok ng mahusay na kaibahan. Malinaw kung saan gustong mag-click ng mga bisita.

2. Mata ni Tori

Ang Tori's Eye ay isang magandang halimbawa ng isang monochrome color scheme. Dito, makikita ang mga epekto ng isang simple ngunit malakas na paleta ng kulay na nakasentro sa mga lilim ng berde. Ang scheme ng kulay na ito ay kadalasang madaling makuha, dahil ang isang lilim ng isang kulay ay halos palaging gagana sa isa pang lilim ng parehong kulay.

3. Cheese Survival Kit

Ang pula ay isang napakasikat na kulay para sa isang paleta ng kulay ng website. Maaari itong maghatid ng masaganang halo ng mga emosyon, na ginagawa itong maraming nalalaman. Gaya ng makikita mo sa website ng Cheese Survival Kit, lalo itong mabisa kapag ginamit sa maliliit na dosis. Ang pula ay pinalambot ng mas neutral na mga kulay, at ang asul ay nakakatulong sa mga CTA at iba pang lugar kung saan gustong makuha ng negosyo ang atensyon ng bisita.

4. Ahrefs

Ang Ahrefs ay isang halimbawa ng isang website na malayang gumagamit ng color palette. Ang madilim na asul ay gumaganap bilang pangunahing kulay, ngunit ang mga pagkakaiba-iba ay umiiral sa buong site. Ganun din sa mga kulay orange, pink at turquoise.

Karamihan sa mga madalas itanong tungkol sa mga kulay

1. Ano ang pinakamagandang kulay para sa isang website?

Ang asul ay talagang ang pinakaligtas na pagpipilian dahil ito ang pinakasikat na kulay na may 35%. Gayunpaman, kung lahat ng iyong mga kakumpitensya ay gumagamit ng asul, maaaring makatuwirang "ibahin" ang iyong alok at brand. Ngunit kailangan mong tiyakin na hindi mo matabunan ang mga bisita.

2. Ilang kulay ang dapat mayroon ang website?

Isaalang-alang na 51% ng mga brand ay may mga monochrome na logo, 39% ay gumagamit ng dalawang kulay, at 19% lamang ng mga kumpanya ang mas gusto ang buong kulay na mga logo. Mula dito, makikita mo na ang mga website na may 1, 2 at 3 kulay ay mas may katuturan kaysa sa pagsubok na gumawa ng website na may mga kulay na bahaghari. Gayunpaman, naniniwala ang mga brand tulad ng Microsoft at Google sa bentahe ng pagtatrabaho sa mas maraming kulay dahil gumagamit sila ng hindi bababa sa 4 na solid na kulay sa kanilang mga disenyo.

3. Saan ko dapat gamitin ang mga kulay?

Ang mga kapansin-pansing kulay ay dapat gamitin nang matipid, kung hindi, mawawala ang epekto nito. Ang epektong ito ay kailangang nasa mga punto ng conversion tulad ng mga button na "Buy Now."