2020. aasta 50 parimat veebisaidi värvilahendust
Kas tundub kunagi, et teatud veebisaidi värvilahendused saavad lihtsalt kogu tähelepanu? Nagu kõigi muude veebidisaini aspektide puhul, on ka värviskeeme, mis kipuvad trendima rohkem kui teised. Erksad värvid, teravad paletid ja isegi mõned mittevastavusskeemid on trendid värvi elementideks.
Siin on ülevaade mõnest 2020. aasta parimast veebisaidi värvilahendusest (mitte konkreetses järjekorras). Igaühe jaoks jagame ka värvikoode, mis moodustavad kujunduse põhielemendid, nii et nende värviskeemidega on lihtne ka ise ringi mängida!
Ükskõik, kas loote veebisaiti ise nullist või loote veebisaidi kujunduse saidi loomise tööriista abil, näiteks Wix, peate värvivalikutele hoolikalt järele mõtlema. Taustade, teksti, animatsioonide ja muu jaoks.
Siin on mõned suurepärased näited õigesti tehtud värvivalikutest, et oma järgmist projekti inspireerida.
1. Taprooti sihtasutus
# 00a9d8 # 0d9edf # 259b9aTaprooti sihtasutus kasutab seal ühte parimat kõige värvikamat veebisaidi värvilahendust. Kollase, sinise ja kelly rohelise kombinatsioon selgitab koos mittetulundusühingutele abistava rühma erinevaid tahke. See pole veebisaidi värviskeem, kus näete, et sageli on erksavärviline valge taustaga taust peamiselt trendikas suund.
2. Ennetage epideemiaid
# 292930 # 3eb650 # fcc133 # e12b38Epideemiate ennetamine kasutab võrdselt värvikat skeemi, kuid koos tumeda tausta ja rohelistega, mis kannavad kõiki kasutajaliidese elemente ja üldist kujundust, on see kõik koos. Üks trendikamaid värvipalettide valikuid on töötada välja värvikomplekt, mis oleks laiaulatuslikum kui tavaline kahe- või kolmevärviline palett.
3. Snipcart
# 7f8688 # 929d9e # f3e367Snipcart kasutab helehalli tooni peamiseks taustavärviks tooni määramiseks peenete kollaste aktsentidega. Lahendus ühendab trendikama erksavärvi peene ja neutraalse gradiendiga värvipaleti jaoks, mis julgustab kasutajat sisule järele mõtlema.
4. Mossio
# 18181e # dec79bMossio kasutab siin selle veebisaidi värviskeemis samu põhivärve - näete trendi musta / halli ja kollasega, eks? - ainult küllastuma tausta ja vähem küllastunud aktsentvärviga. Kombinatsioonil on peaaegu sama mõju kui ülaltoodud näitel värvipaletiga, mis keskendub sisule, muutes kujunduse pisut nähtamatumaks.
5. Omega pärm
# f7f7f7 # 7da2a9Omega Yeast ei näe välja nagu selle värvipalett oleks esmapilgul mustvalge kaugemale ulatuv, kuid see veebisaidi kujundus teeb midagi, mis on värvitrendides suur idee. Värviskeemi juured on põhipildil - antud juhul videol -, mitte aga taustal ega värvilistel kasutajaliidese elementidel. See värvitrend on muutumas üha tavalisemaks, kuna disainerid kasutavad brändiloo rääkimiseks täisekraanipilte.
6. Talutoit
# ffffff # a7bc5b # 8da242Talutoit kasutab tähelepanu juhtimiseks lihtsat looduslikku paletti valge minimaalse stiili taustal, millel on eredad oliivirohelised. Lisaks on palett monotoonne, koos elementide heledate ja tumedate oliividega. (Seda värvi muutust on kõige lihtsam näha nupu hõljumise olekus.) See ei pruugi olla värvipaar, kuhu esimesena kohale jõuate, kuid see on tõesti silmatorkav.
7. Jebseni karjäär
# 3fd2c7 # 99ddff # 00458bJebsen Careers kasutab summutatud siniseid ja rohelisi, et luua hämmastavaid värvikihte ja küllastunud värviga kujunduselemente. See kombinatsioon sobib suurepäraselt valgel taustal ja näitab tõesti ära, mida saate teha, kui töötate sama värvi variatsioonidega. Tekstielementide jaoks kasutatud merevägi ja logo suurendavad veelgi üldist värvikasutust.
8. IC loominguline
# fb8122 # 1d2228 # e1e2e2IC Creative kasutab kutsuva stseeni loomiseks tumedat värvi ülekattet - musta, mis pole tegelikult must - erksa aktsentvärviga ja rohkesti valget värvi. Peaaegu igas toonis olevad värvikihid on veebisaidi värvide peamine suundumus ja rikkalik must variant, nagu siin on, on kena viis anda muule sisule ekraanil palju ruumi. Pange tähele ainult liiga suurt pealkirja ja erksaid aktsente ning tegutsemiskutsusid.
9. Mangrove hotell
# d48166 # 373a36 ## e6e2ddEhkki erksavärvilised paletid on juba mõne aasta vältel veebisaidi kujundamise praktiliselt otsustanud, on mõne projekti puhul tagasi nihestatud summutatud palett. Mangrove hotelli lihav toon on soe ja komplitseerib sisu hästi. (Sama värvi on ilmunud ka mõnes Twitteri turunduskommunikatsioonis.)
10. Udus
# 051622 # 1ba098 # deb992Slumber kasutab suurepäraselt ära Pantone'i aasta värvi - klassikalist sinist - rakenduse kujutistes ning tumedates toonides taustal ja logol. Kulla ja rohelisega kõrvutamine on ülimoodsad, elegantsed ning järgib öist ja une teemat.
11. Atlanta õlletootmine
# e40c2b # 1d1d2c # f7f4e9 # 3cbcc3 # eba63f # 438945Atlanta Brewing kasutab ka domineerivat punast, millel on palju muid aktsendivärve. Pange tähele, et palett pole mitte ainult osa veebisaidi kujundamisest, vaid laieneb ka tootepakenditele. Neil on üsna lai palett, mille põhivärvid on alus ja rikkalik mustvalge taust.
12. Päikeselise tänava kohvik
# 5c6e58 # 8aa899 # f2d349Sunny Street kohvik on erksavärviline värvipaletiga, mis sobib ideaalselt kujunduses olevate piltide ja keelega. Rohelised ja kollased koos on ebatavaline kombinatsioon, kuid see tundub sõbralik ja sobib just selle hommiku- ja lõunaeine kujundusega. Värviteema toob kenasti välja ka toidupilte.
13. Eristamine
# 000000 # 181818 # 2cccc3 # facd3d # 5626c4 # e60576Eristamisel kasutatakse värvipaleti jaoks sama musta värvi alust koos aktsendvärvide vikerkaarega. Kui soovite laiaulatuslikku värvipaletti, on see viis trendide tõhusaks kasutamiseks.
14. Lucia Lash
# ffffff # 0a0a0aVärvispektri teises otsas on värvi täielik puudumine. Ainus mustvalge veebisaidi värviskeem on modi ja minimalismi kõrgus.
15. Pittori di kino
# fdd935 # 000000Minimalism võib olla ka värvikirev, nagu tõestab Pittori di Cinema. Erekollane skeem koos mustaga on tavaline kõrgvärvilise minimalismi variant. Mida heledam on selle stiili värvipalett, seda trendikam tundub.
16. Meie (süda) UX
# e1f2f7 # ef0d50 # eb3a70 # e5baceMeie (Heart) UX kasutab peamise kunstielemendi jaoks lihtsat värvipaletti helesinise taustaga - armas valik - ja roosakaspunase varjundiga. Nende värvide ühendamine funky geo-stiiliga on trendikas, moodne ja seda on lihtsalt lõbus vaadata.
17. Uhke ja rebenenud
# 1f3044 # fb9039 # 646c79Proud & Torn kasutab sama juveelitooni kontseptsiooni pisut summutatud värvikombinatsiooniga. Peenem värvipalett aitab tekitada visuaalset huvi veebisaidi kohta, kus on palju värvituid pilte.
18. Loom
# 6effc4 # 9630d8 # ffffffLoom kasutab erksamate mustvalgete taustadega kontrastiks erksaid värvielemente. Lilla ja roheline mõjuvad fantastiliselt koos, eriti siin valitud toonides. Kui te pole kindel värvivalikus, on kena puudutus ühe värviga läbipaistvuse kasutamiseks.
19. Etiya
# d56c2c # 22223aEtiya pakub veebisaidi üldises värvipaletis veel ühte populaarset ühevärvilist värvi - oranži. Erksad oranžid toonid - mida sageli kasutatakse tumedate, musta, mereväe või lilla taustaga taustal - on trendikas variant.
20. Baobla
# 56642a # 849531 # 92a332Baoblal on lõbus gradient monotoonses värviskeemis. See värvipaleti stiil sobib ideaalselt uute kaubamärkide või tooteidentiteetide jaoks või kui soovite, et julge värvitoon saaks palju mõju avaldada.
21. Naiste ja tüdrukute häirekeskus
# faf0dc # 0b4141 # ff6864Naiste ja tüdrukute hädaabikeskus valis värvipaleti, mis pole liiga naiselik, aidates julgete värvidega oma sõnumile rohkem jõudu anda. Värvivalik on kontrastiga suur ning silmadel ja loetavuse osas lihtne. Hele aktsendiga valik on trendikas ja lisab sellele elemendile rõhku.
22. Jean-Baptiste Kaloya portfell
# 150734 # 0f2557 # 28559a # 3778c2 # 4b9fe1 # 63bce5 # 7ed5eaJean-Baptiste Kaloya muudab veebisaidi kujundamisel tõenäoliselt kõige populaarsema värvi ühetooniks palett, millel on erinev sinine värv. Pange tähele ka heledama sinise värvi pehmeid kaldeid.
23. Igor
# 000000 # fefefe # fdee30Igor tutvustab, mis on tõenäoliselt 2019. aasta kõige populaarsem veebisaidi värvipalett - must, valge ja kollane. See värvipalett, kuigi erinevates toonides, on laialt levinud. See kombinatsioon on ilmselt üks ahvatlevamaid.
24. Kauboi jalgratas
# 000000 # fa255e # c39ea0 # f8e5e5Cowboy Bike kasutab musta ja erksavärvilist värvipaletti, millele on tähelepanu viivitamatult tähelepanu pöörata. Kuigi enamik saite kasutab musta teksti ainult teksti jaoks, hõlmab see kujundus selle tegelikult eredasse, ühetoonilisse paletti.
25. CEO Mindshare tippkohtumine
# 001131 # e4bf3f # fedbc4Tegevjuhi Mindshare Summiti sinise ja kollase kombinatsioon on silmatorkav. Värvipaleti üllatav element on virsiku aktsendi kasutamine. See on nii peen, et te ei pruugi seda alguses märgata. See värv annab aktsendi, mis pole nii terav ja särav kui valge, mis muudab selle suurte mõõtmete korral, näiteks pealkirjas, pisut vähem julgeks.
26. Sotsiaalmajanduse kuu
# ff4653 # f6dadf # 9b1b3bSotsiaalmajanduskuu kasutab ühetoonilisi värvipalette ühe aasta trendikaima värviga ja ootamatul viisil. Helepunast, mis on siin peamine taustvärv, kasutatakse tavaliselt aktsentvärvina musta või tumesinise vastu. Harva seisab see sel viisil üksinda ja palett paneb tänu julgetele värvivalikutele disainile vaatama.
27. Gabrielle Dolan
# e8eae3 # 373833 # fa2742Gabrielle Dolani veebisaidil on kasutatud hall-valge-erksa värvipaleti trendi. Kuna enamiku kujunduse puhul puudub selge värvipuudus, tundub, et erksavärviline ekraan ekraanilt hüppab. See loob just õige fookusala ja kontrasti suuruse, mistõttu on see trendikas värviskeemi variant.
28. Pixel sahver
# 9e15bf # 4ac6d2Pixel Pantry kasutab selle trendi - lilla ja sinise - esiletoomiseks selget värvipaari. Nende kahe värvi kombinatsioon paleti loomiseks on peaaegu ebareaalne. Selle skeemi variatsioone leiate peaaegu kõikjalt, kuhu pöördate.
29. üksteist taime
# 5daa68 # 3f6844 # faf1cfEleven Plants kasutab neutraalset värvilahendust, mis on harmooniline ja hõlpsasti vaadatav. Roheline sobib hästi sisuga ning värvikombinatsioonid on lihtsad ja võluvad.
30. Qvartz
# ee7879 # 2a3166 # f4abaa # cae7dfQvartz kasutab aasta ühte kõige ootamatumat trendivärvi viisil, mis jäljendab paljusid teisi projekte. Roosa teksti, roosade värviplokkide ja julgete ja pehmemate värvide mashupiga on see palett pisut naiselik, kuid mitte liiga palju.
31. Sheerlink RTX-i poolt
# 4a2c40 # e9bd43 # 7d3780Sheelink By RTX kasutab oma tootele tähelepanu juhtimiseks tänapäevaseid gradiente ja julget värvi. Värvid on sügavad ja tujukad ning maroon-lillal on selgelt tajutavus ja salapära.
32. Puerto Mate
# 5ce0d8 # 01345b # ffcf43Puerto Mate kasutab trendikaid värve, mis on julgeid, ilma et need ülepaisutaksid. Kuna keskpaneel on merevägi, tunnevad välised erksad värvid teie nägu pisut vähem. (Kujutage vaid ette, kuidas need toonid kujunduses eri kohtadesse libistada.)
33. Loic Sciampagna portfell
# 141824 # ffb600 # 0049ffLoic Sciampagna portfellis on kasutatud ühte parimat sinise ja kollase kombinatsiooni. Kontrastsed toonid on lihtsad, elegantsed ja köidavad heleda sinise tooni kerge puudutuse abil.
34. Canatal
# 182978 # 6688cc # acbfe6Canatal kasutab selles kujunduses hästi oma kolmekordseid siniseid kaubamärgi värve. See on näide sellest, kuidas kasutada ühetoonilist värvipaletti ilma igavaks.
35. FFWD Digital
# f1e821 # 487afa # 23c0adFFWD Digital kasutab sära stiilselt ja klassikaliselt. Paberkandjal võib selle värvikolmiku kasutamine tumedal ja heledal taustal tunduda kohmakas, kuid siin on see tegelikult õmblusteta ja armas.
36. Tappezzeria Novecento
# 191919 # fab162Tappezzeria Novecento kasutab värvilahendust, millest enamik eemale peletaks - ja see töötab. Oranži ja musta särav kombinatsioon on lihtne ja kaasahaarav. Värvid on piisavalt kontrastsed, et kõike oleks kerge lugeda. Mõnus puudutus on ka see, et brändi värvid on ka piltidel.
37. Tev
# 252669 # 4ecb4aTev on taustal ja kahevärvilisel ülekattel kõike muud kui igav. See on julge ja roheline paneb mõtlema rahale - just sellele, milleks sait on mõeldud.
38. Nišš ja kultus
# 4e3883 # ffddccNiche & Cult kasutab naiselikuma tundega ilubrändi jaoks pehmeid toone. Pehme roosa meenutab mõnda nahatooni ja tühja lõuendit meigiks, samal ajal kui erk lilla sobib saidi meeleoluga.
39. Sysdoc
# 001730 # 4ad7d1 # fe4a49Sysdoc loob punase, sinise ja rohelise põhipaleti jaoks uue keerutuse koos heledamate, vähem küllastunud võimalustega punase ja rohelise jaoks. Palett on tugev ja pehme ning sobib peaaegu kõigi muude elementide komplektiga.
40. Veneziano kohv röstijad
# f6f4f2 # 425664 # c6ad8fVeneziano Coffee Roasters ulatub tagasi summutatud paleti juurde halli-sinise ja kuldse kombinatsiooniga, mis on peen ja stiilne. Värvid sobivad hästi veebisaidi kujutistega ja loovad just õige tunde.
41. Parem energia
# 11abc1 # df3062 # f5b935 # 4bac3fParem energia kasutab loodusega seotud erksavärvilisi värve - mis on võetud vastavatest piltidest -, et luua lõbus palett, et rääkida lugu millestki, millest pole võib-olla eriti huvitav rääkida.
42. Lõhkegalaktika
# 0f0c24 # a350a3 # c1436d80-ndate paletti vaatamata ei saanud me läbi lahedate värvitrendide voorust. Kõik, mis pärineb 1980. aastatest, näib olevat trendikas ja hõlmab värve Blast Galaxy jaoks, mis on tavaliselt täheldatud sinise, lilla ja roosa kombinatsiooni neoonläikega.
43. Kyle Deckeri portfell
# f5f5f5 # 8db48e # 4d724dKyle Deckeri portfell on veel üks veebisaidi värviskeem, mis paistab silma, kuna see on nii lihtne. Kasutaja silmade fokuseerimiseks kasutab see neutraalsete ainete kombinatsiooni ja ainult ühte tõelist värvi.
44. Ärgake
# 212221 # 1181b2 # ddedf4 # 44449bAwink Websolutions kasutab ka ühetoonilisi värviskeemid, millel on erinevad sinised toonid. (Bluus on monotooniliste variantide puhul populaarne variant.) Tänu sügavamatele ja tumedamatele aktsentidele on see pisut erinev. Lisaks mängivad tumedad ja heledad ekraanipinnad peaaegu optilist illusiooni, pannes teid arvama, et siin on rohkem värve kui seal tegelikult on.
45. Archibald Microbrwery
# d81c23 # 4fa8c2 # d97441 # d29849Archibald Microbrewery kasutab värvide vikerkaart, kuid palett on üllatavalt ilus. Kuna kõik värvid on sarnastes küllastustes ja järgivad teemat visuaalselt, on see üsna sujuvalt kokku ühendatud.
46. Austraalia valitsuse ehitus- ja ehituskomisjon
# 9b3a95 # 3d7da7 # f4abaaAustraalia valitsuse, ehitus- ja ehituskomisjoni veebisait pole selline, mida arvatavasti loete suurepäraste värvilahenduste loendisse, kuid lilla, rohelise ja sinise kombinatsioon on siin hämmastav. Samuti aitab see värvikoodidega süsteemil kasutajaid disainilahenduse kaudu juhendada.
47. Indegy
# 45af2a # 3fddc1 # d56c06Indegy kasutab erkrohelist rohkete fotode ja kõrgevärviliste fotode vastu. Lihtne värv, enamasti koos halli ja valgega, lisab kujundusele moodsa vastupidavuse ja aitab kasutajaid sisu kaudu suunata. (Teistes kohtades on ka rohelised ja oranžid aktsendid peent heledate hüpikute jaoks.)
48. Seljakott
# ad4328 # b65741Seljakott kasutab erksat punast värvilahendust koos kaldega, et lisada huvi värvile, mida võib olla raske kasutada. See töötab, kuna ereda paletiga konkureerivad mitte palju energiatarbega visuaale.
49. Demisol
# 16519f # f07e74 # f8dd2e # 4fcbe9Demisol kasutab liiga palju värve ja liiga palju suuri elemente ning see on igal juhul vapustav. Mõnikord on värviga mängimine katse; katsetage ja vaadake, kas see töötab.
50. Dropbox
# 61082b # b4d0e7Dropboxil on veel üks neist värviskeemidest, mis ei peaks töötama ... kuid see on nii. Kontrastsus sügava marooni ja lapsesinise vahel loob silmade suure liikumise kogu jagatud ekraanil. Värvid toimivad võrdselt hästi ka vastasvärvi tekstielementidega. Veelkord tõestab see, et mõnikord peate lihtsalt proovima värvivalikuid ja nägema, kuidas need toimivad.