Tranziții de culoare netedă: gradient CSS

Schema de culori naturale este de regulă uniformă. Dar chiar și pe suprafețe perfect plane, de aceeași culoare solidă, se formează tranziții de culoare naturală. Întotdeauna scăderea neintenționată a luminii solare sau a iluminatului artificial, precum și schimbarea unghiului de vedere oferă nuanțe neuniforme și unice.

Două puncte de vedere care vizează același obiect își percep culoarea în funcție de diferența dintre unghiurile lor de vizualizare și relația cu unghiurile de incidență a altor raze pe suprafața intervievată.

Efectele psihologice ale tranzițiilor de culoare

Culoarea nu provoacă numai senzații fizice și depinde nu numai de timpul și poziția din spațiu. Imaginile copacilor, caselor, munților și a altor obiecte în poziție inversată determină un sentiment de reflexie suprafața apei sau pe altă suprafață.

linii paralele Absolut negre pe pereți suprafață perfect albe, fiecare linie de-a lungul întregii creșteri de lungime proporțional cu reducerea grosimii grosimii liniei naturale atunci când sunt vizualizate pe un perete - toate acestea va provoca o senzație în privitorului că camera are un plafon orizontal.

O imagine, pe care sunt aplicate două, și fiecare dintre ele este deplasată unul față de celălalt de distanța dintre ochi, dă un efect de volum spațial dacă defocusul este defocalizat.

Dacă posterul este suficient de mare și limitele tranziției către realitatea reală sunt perfecte, atunci imaginea reprezentată pe afiș va fi percepută atât de natural încât nuanțele necesare de culoare, conștiința spectatorului se va conecta automat.

Site-ul și, mai presus de toate, designul și schema de culori sunt importante și completează logica resursei, dialogul acesteia, produc un efect psihologic adecvat asupra vizitatorului.

Smooth tranziții prin CSS

Gradiențele sunt create utilizând funcțiile gradientului liniar () și gradientului () radial. În primul caz, apare o schimbare netedă a culorii de-a lungul liniei, în al doilea caz - de-a lungul unei elipse sau a unui cerc. Gradientul CSS poate fi setat în fundal proprietăți, imagine de fundal, imagine de frontieră, imagine în stil listă. Prin impunerea elementelor reciproce, determinându-le transparența, puteți crea nuanțe uimitoare de culoare și puteți crea tranziții unice.

Ar trebui totuși să se țină seama de faptul că tranziția de culoare nu poate fi întotdeauna netedă. Unele combinații de culori, valori de transparență, design de fundal al paginii pot da efecte secundare nedorite.

CSS norme de scriere gradient

Un gradient este o trecere ușoară de la o culoare la alta. Puteți utiliza mai multe culori. Specificarea unei versiuni liniare (gradient liniar CSS) poate fi variată:

Primul parametru este unghiul de înclinare sau partea laterală a zonei, apoi culorile urmează. Nu este necesar să folosiți doar două culori, puteți desena întregul curcubeu. Utilizând proprietatea de opacitate a opacității, puteți obține efecte de amestecare.

Selectați culori, generatoare de culori

Partea creativă a lucrării designerului, dezvoltatorul site-ului în ultimii ani, a devenit mai simplă. Formele rectangulare practice și practice care conțin un minim de informații, un minim de funcții, un maxim de semnificație și un cadru psihologic pentru a vinde un produs, oferă un serviciu, în special pentru a nota reducerile, calitatea și / sau diferențe semnificative față de concurenți au devenit practice și eficiente.

Cu toate acestea, chiar și în astfel de condiții dure, reglementări și crearea de web modernă resurse este un loc pentru creativitate și o dorință clară de unii dezvoltatori pentru a face o lucrare agresiv, orientate cu culoare, reflectând sensul conținutului textului și dialogul de stil ales. Gradientul CSS a devenit mai frecvent.

Soluții de culoare „Google“ și „Skype“, în special, a avut un efect și urmașii, cu toate acestea, în ultimii doi ani, componenta activă a web design a început să caute noi forme, culori noi și discret, încercați dinamica formelor de curgere.

Pe Internet există mai multe resurse on-line (generator de gradient CSS), care simplifică foarte mult sarcina de a alege culorile potrivite :. Angrytools, flatonika, generatecass etc. Cu ajutorul lor, puteți salva într-adevăr timp la selectarea culorii dreapta, ia în considerare tranzițiile de linie și suprapunerile.

Schema de culori dinamice

Tradițiile care stau la baza creării de resurse web au făcut regula: structura, conținutul și dialogul site-ului cu clientul este competența dezvoltatorului care pune în aplicare voința proprietarului (clientului). Aspectul site-ului, designul său este, de asemenea, în mod tradițional legat de ceea ce nu este determinat de client.

Între timp, o varietate de dispozitive este în creștere, iar în familiile fiecărui tip există diferite exemplare promițătoare, cu diferențe semnificative, nu numai în reproducerea culorilor, la fel ca în rezoluția și browser-ul formează regiunea vizibilă.

Varietatea de browsere și versiuni utilizate, de asemenea, creează probleme în afișarea adecvată a capabilităților gradientului CSS.

În mod colectiv evaluarea acestor circumstanțe, și exemple ale unor lucrări promițătoare, se poate argumenta că aspectul site-ului defaultnom numai de stat - competența dezvoltator și / sau proprietarul resursei. Numai atunci când clientul vizitează prima resursă, acesta poate avea ocazia să evalueze designul site-ului. Dacă clientul a considerat oportun să-și amintească site-ul și să-l folosească în viața de zi cu zi, dorința sa de a avea instrumente pentru a controla aspectul și funcționalitatea este complet justificată.

Acest transfer al centrului de greutate este benefic pentru dezvoltator: nevoia de a face față implementării compatibilității cross-browser este pierdută, iar site-ul este testat pe diferite dispozitive în diferite sisteme de operare.

În plus, tendința va permite crearea unei baze de date comune privind implementarea efectivă a posibilităților de reguli CSS pe diverse dispozitive. Acesta este doar începutul, dar potențialul său are o mare importanță.