01 de 10
Comprensión de esquemas de cor e cor da rede
Existen catro esquemas de cores básicos que pode usar para un sitio web. Cada páxina deste artigo mostra unha imaxe do esquema de cores e como pode xerar un esquema similar no Photoshop.
- monocromático
Usando cores do mesmo matiz. Poden ter diferentes tons ou matices dependendo da cantidade de branco ou negro que se engada. - análogo
Isto usa cores próximas entre si na roda de cor. - complementaria
Isto adoita ser visto como "oposto" xa que as dúas cores dun esquema de cores complementario son opostas na roda de cor. - triádica
Estas cores están uniformemente espaciadas na roda de cor.
Todos os esquemas de cores usaran este amarelo como a cor de base.
02 de 10
Esquema de cor web monocromática
Este esquema de cores usa a mostaza amarela da miña cor base e engade un pouco de branco e negro ao matiz e sombra o esquema en consecuencia.
- á esquerda superior: a cor base # ffe500
- á dereita superior - engadiuse un recheo do 50% branco para obter o #fff280
- na parte inferior esquerda - agregou un recheo do 75% branco para obter # fff8bf
- na parte inferior dereita - engadiu un recheo do 50% negro para obter o número 7f7200
Os esquemas de cores monocromáticos adoitan ser o máis fácil aos ollos de todos os esquemas de cores. Os suaves cambios de tonalidade e sombra fan que as cores flúen un a outro mellor. Usa este esquema de cores para facer que o teu sitio apareza máis fluído e recollido.
03 de 10
Esquema de cor web monocromática máis
Engadiuse un cadrado do 20% negro para obter máis cores no esquema. Engadindo o negro ou o branco ás túas cores pode crear unha nova cor na túa paleta sen arrincar o ton da páxina.
04 de 10
Esquema analóxico da cor web
Este esquema de cores leva a cor base amarela e engade e resta 30 graos ao ton na paleta de cores de Photoshop.
- á esquerda superior: a cor base # ffe500
- á dereita superior - +30 grados para obter # 99ff00
- inferior esquerda - -30 graos para obter # ff6600
- inferior dereita - 100% branco #ffffff
As cores análogas poden funcionar moi ben xuntos, pero ás veces poden chocar mal. Asegúrese de probar estes esquemas con máis xente que vostede, a súa familia e amigos. Cando funcionan, crean un sitio que é máis colorido que o esquema monocromático, pero case tan fluído.
05 de 10
Esquema de cores web análogo
Engadiuse un cadrado do 20% negro para obter máis cores no esquema.
06 de 10
Esquema de cores web complementario
Os esquemas de cores complementarios, a diferenza doutros esquemas de cores normalmente, só teñen dúas cores. A cor da base e é oposto na roda de cor. Photoshop facilita a obtención da cor complementaria: basta con seleccionar a área de cor que desexa e complementar a tecla Ctrl-I. Photoshop vai investir por ti. Asegúrese de facelo nunha capa duplicada, polo que non perdes a cor da base.
- esquerda - a cor de base # ffe500
- dereito - o complemento # 001aff
Os esquemas de cores complementarios adoitan ser moito máis rechamantes que outros esquemas de cores, polo que use os coidadosamente. Utilízanse máis a miúdo en pezas que precisan destacarse.
07 de 10
Esquema de cores web complementario máis
Para obter esta versión, engadín un 50% de branco á metade inferior das cores e un 30% de negro ao cadro central. Como podes ver, dáche algunhas opcións máis pero aínda é un esquema de cores complementario.
08 de 10
Esquema de cor web triádico
Os esquemas de cor triádicos están compostos por 3 cores máis ou menos espaciados ao redor da roda de cor. Porque unha roda de cor é de 360 graos, volvín a usar a caixa de tonalidade no selector de cores para engadir e restar 120 graos da cor da base.
- á esquerda superior: a cor base # ffe500
- á dereita superior - +20 grados para obter # e500ff
- inferior esquerda - -120 grados para obter # 00ffe6
- inferior dereita - 100% branco #ffffff
Os esquemas de cores triádicas adoitan producir páxinas web moi vibrantes. Pero como esquemas de cores complementarios, poden afectar ás persoas de forma diferente. Asegúrese de probar.
Tamén podes crear esquemas de cor tetradic ou de 4 cores, onde as cores están igualmente espaciadas en torno á roda de cores.
09 de 10
Esquema de cores web máis triádico
Do mesmo xeito que cos outros exemplos, engadín un cadrado negro do 30% ás cores para obter as tonalidades adicionais.
10 de 10
Esquemas de cor web discordantes
A beleza está ao ollo do espectador, pero é un feito lamentable que non todas as cores se xunten. As cores discordantes son cores que están máis preto de 30 graos de distancia na roda de cor e non son complementarias ou forman parte dunha tríade.
Os esquemas de cores discordantes poden ser moi chocantes e só deben utilizarse para xerar atención. Lembre que porque estas cores adoitan chocar, a atención que recibe pode non ser exactamente o que está a procurar.