Razumijevanje shema boja i web boja

01 od 10

Razumijevanje shema boja i web boja

Postoje četiri osnovne sheme boja koje možete koristiti za web stranicu. Svaka stranica ovog članka prikazuje sliku sheme boja i kako možete generirati sličnu shemu u Photoshopu.

• monokromatskiKoristeći boje iste boje. Mogu imati različite tonove ili nijanse, ovisno o tome koliko je dodano bijelo ili crno.
• analoganOvo koristi boje koje su bliske jedna na drugoj na kotačiću u boji.
• dopunskiTo se često vidi kao "suprotno", jer dvije boje u komplementarnoj shemi boja su suprotno jedna na drugoj na kotačiću u boji.
• trijadneTe boje su ravnomjerno raspoređene na kotačiću u boji.

Sve sheme boja koristit će ovu žutu boju kao osnovnu boju.

02 od 10

Monokromatska shema boja web

Ova shema boja koristi mustardovu žutu boju moje osnovne boje i dodaje neke bijele i crne boje u boju i zasjeniti shemu u skladu s tim.

• gore lijevo - osnovna boja # ffe500
• gornji desni - dodao je punilo od 50% bijele da bi se dobio # fff280
• donji dio lijeve strane - dodana je puna 75% bijela da bi se dobio # fff8bf
• donji dio desne strane - dodao je punilo od 50% crne da bi se dobio # 7f7200

Monokromatski sheme boja često su najlakše na oči svih shema boja. Blage promjene u tonovima i sjeni čine boju da se jedna u drugu bolje struji. Upotrebljavajte ovu shemu boja kako bi se web-lokacija učinila fluidnijom i prikupljala.

03 od 10

Više monokromatska shema boja u webu

Dodano je kvadratu od 20% crne da bi dobili više boja u shemi. Dodavanje crne ili bijele bojama u boju može stvoriti novu boju u paleti bez nereda tonove stranice.

04 od 10

Analogna shema boja u webu

Ova shema boja uzima žutu osnovnu boju i dodaje i oduzima 30 stupnjeva u nijansu u paleti boja programa Photoshop.

• gore lijevo - osnovna boja # ffe500
• gornje desno - +30 stupnjeva da biste dobili # 99ff00
• donji lijevi - -30 stupnjeva da biste dobili # ff6600
• donji desni - 100% bijeli #ffffff

Analogne boje mogu raditi vrlo dobro zajedno, ali ponekad se mogu loše sukobiti. Svakako isprobajte te sheme s više ljudi od sebe, vaše obitelji i prijatelja. Kad rade, stvaraju stranice koje su šarene od monokromatskih shema, ali gotovo kao tekućine.

05 od 10

Više analognih shema web boja

Dodano je kvadratu od 20% crne da bi dobili više boja u shemi.

06 od 10

Dopunska shema boja web

Dopunske sheme boja, za razliku od ostalih shema boja obično imaju samo dvije boje. Boja baze i suprotno je na kolu boja. Photoshop olakšava dobivanje komplementarne boje - jednostavno odaberite područje boje koju želite upotpuniti i pritisnuti Ctrl-I. Photoshop će je preokrenuti za vas. Pazite da to učinite na duplikatu sloju, tako da ne izgubite boju baze.

• lijevo - osnovna boja # ffe500
• desno - dopuna # 001aff

Dopunske sheme boja često su mnogo upečatljivije od ostalih shema boja pa ih pažljivo koristite. Najčešće se koriste na komadima koji se trebaju istaknuti.

07 od 10

Dodatna shema web-boja

Da biste dobili tu verziju, dodala sam 50% bijelu boju na donju polovicu boja i 30% crnu na središnji kvadrat. Kao što možete vidjeti, to vam daje još nekoliko mogućnosti, ali je još uvijek komplementarna shema boja.

08 od 10

Triadska web shema boja

Trijadske sheme boja sastoje se od 3 boje više ili manje jednako raspoređene oko kotača u boji. Budući da je kotačić u boji 360 stupnjeva, opet sam koristio boju boja u boji za odabir boje da biste dodali i oduzeli 120 stupnjeva od osnovne boje.

• gore lijevo - osnovna boja # ffe500
• gore desno - +120 stupnjeva da biste dobili # e500ff
• donji lijevi - -120 stupnjeva da biste dobili # 00ffe6
• donji desni - 100% bijeli #ffffff

Trijadske sheme boja često proizvode vrlo živopisne web stranice. No, kao komplementarne sheme boja, one mogu utjecati na ljude drugačije. Svakako isprobajte.

Također možete izraditi tetradne ili 4-boje sheme boja, gdje su boje ravnomjerno raspoređene oko kotača boja.

09 od 10

Više triadijskih shema boja u webu

Kao i kod ostalih primjera, dodao sam 30% crnog kvadrata boje kako bih dobio dodatne nijanse.

10 od 10

Neusporediva shema boja u webu

Ljepota je u oku promatrača, ali je nesretna činjenica da sve boje ne idu zajedno. Neusklađene boje su boje koje su više od 30 stupnjeva razdvojene na kolu u boji i nisu komplementarne ili dio trojke.

Neujednačene sheme boja mogu biti vrlo šokantne i trebale bi se koristiti samo za generiranje pozornosti. Zapamtite da zbog toga što se te boje često sukobljavaju, pažnja koju dobivate možda nije baš ono što tražite.