Web-värijärjestelmän luominen

01/10

Väri- ja Web-värijärjestelmien ymmärtäminen

Perusväri - sinappiokeri. Kuva J Kyrnin

Verkkosivustossa on neljä perusväriohjelmaa. Jokainen tämän artikkelin sivu näyttää kuvan värimaailmaa ja kuinka voit luoda vastaavan mallin Photoshopissa.

Kaikki värimallit käyttävät tätä keltaista perusväriä.

02/10

Monokromaattinen Web-värijärjestelmä

Monokromaattinen Web-värijärjestelmä. Kuva J Kyrnin

Tämä värijärjestelmä käyttää mustanväristä keltaista perusväriäni ja lisää valkoisen ja mustan sävyä sävyksi ja sävyttää suunnitelmaa sen mukaisesti.

Monokromaattiset värimallit ovat usein helpoin kaikkien värimallien silmissä. Sävyjen ja sävyjen hellävaraiset muutokset tekevät väreistä virtaavan toisiinsa paremmin. Käytä tätä värimallia, jotta sivustosi näyttäisi olevan enemmän nestemäisiä ja kerättyjä.

03/10

Lisää monokromaattista Web-värijärjestelmää

Monokromaattinen Web-värijärjestelmä. Kuva J Kyrnin

Lisätty neliö 20% musta saadaksesi lisää värejä järjestelmään. Mustavalkoisen värin lisääminen väriisi voi luoda uuden värin paletille ilman, että sivun sävy sekaantuu.

04/10

Analoginen Web-värimalli

Analoginen Web-värimalli. Kuva J Kyrnin

Tämä värimaailma ottaa keltaisen perusvärin ja lisää ja vähentää 30 astetta Photoshop-väripaletin sävyyn.

Analogiset värit voivat toimia hyvin yhdessä, mutta joskus ne voivat pahasti törmätä. Muista kokeilla näitä järjestelmiä enemmän ihmisiä kuin itseäsi, perhettäsi ja ystäviäsi. Kun he työskentelevät, he luovat sivuston, joka on värikkäämpi kuin monokromaattinen järjestelmä, mutta lähes yhtä nestettä.

05/10

Lisää analogista Web-värijärjestelmää

Analoginen Web-värimalli. Kuva J Kyrnin

Lisätty neliö 20% musta saadaksesi lisää värejä järjestelmään.

06/10

Täydentävä Web-värijärjestelmä

Täydentävä Web-värijärjestelmä. Kuva J Kyrnin

Täydentävät värimallit, toisin kuin muut värimallit, ovat tyypillisesti vain kaksi väriä. Perusväri ja se on vastakkainen värirenkaaseen. Photoshopin avulla on helppo saada täydentävä väri - valitse vain värialue, jonka haluat täydentää ja paina Ctrl-I. Photoshop kääntää sen puolestasi. Varmista, että teet tämän päälle kaksoiskerroksella, joten et menetä perusväriäsi.

Täydentävät värimallit ovat usein paljon iskeämpiä kuin muut värimallit, joten käytä niitä huolella. Niitä käytetään useimmiten paloina, jotka täytyy erottua.

07/10

Lisää täydentävä Web-värimalli

Täydentävä Web-värijärjestelmä. Kuva J Kyrnin

Tämän version hankkimiseksi lisäsin 50% valkoisen värin alareunasta ja 30% mustasta keskusta-aukiolle. Kuten näet, se antaa sinulle muutamia vaihtoehtoja, mutta se on edelleen täydentävä väriteema.

08 of 10

Triadic-Web-värijärjestelmä

Triadic-Web-värijärjestelmä. Kuva J Kyrnin

Kolmiulotteiset värimallit koostuvat kolmesta väristä, jotka ovat enemmän tai vähemmän tasaisesti värialueen ympärillä. Koska värirengas on 360 astetta, käytin jälleen värisäiliön värisävyä lisäämään ja vähentämään astetta 120 astetta perusväristä.

Kolmiulotteiset värimallit tuottavat usein erittäin vilkkaita verkkosivuja. Mutta kuten täydentävät värimallit, ne voivat vaikuttaa ihmisiin eri tavoin. Muista testata.

Voit myös luoda tetradisia tai 4-värejä värimalleja, joissa värit ovat tasaisesti värialueen ympärillä.

09/10

Lisää kolmiulotteista Web-värijärjestelmää

Triadic-Web-värijärjestelmä. Kuva J Kyrnin

Kuten muissa esimerkeissä, lisäsin 30% mustan neliön väreihin saadakseni lisää sävyjä.

10/10

Säröjävät Web-värimallit

Säröjävät Web-värimallit. Kuva J Kyrnin

Kauneus on katsojan silmissä, mutta on valitettavaa, etteivät kaikki värit mene yhteen. Epäsäännölliset värit ovat värejä, jotka ovat väritreunassa kauempana kuin noin 30 astetta, eivätkä ne ole toisiaan täydentäviä tai osa kolmia.

Ristiriitaiset värimallit voivat olla hyvin järkyttäviä, ja niitä tulisi käyttää vain huomion tuottamiseen. Muista, että koska nämä värit usein ristiriidassa, saatat saattavat olla tarkalleen mitä etsit.