CONFIRA!
Lista de cores
A lista parcial seguinte contém diversas cores, individualmente associadas a seus devidos artigos.
Observe que os valores CMYK são nominais, e que não há conversão perfeita de RGB para CMYK. É recomendável a não utilização destes valores onde uma impressão de alta qualidade é necessária.
Os valores atuais das cores abaixo estão corretas, mas muitos inferem que a amostra atual de cores que são exibidas é contraditória, devido à falta de correção gama. O branco realmente é branco, e assim também o preto, mas as cores entre este intervalo, especialmente cores escuras, são mostradas de maneira incorreta. Por exemplo, 50% cinza (metade entre branco e preto) deve ser tão claro como 50% de branco, e sem a correção gama, é apenas tão claro como 18% do brilho do branco em um monitor com 2.5 de gama (0.52.5 = ~0.1768), que é o valor gama padrão para a maioria de monitores LCD e CRT. Enfim, se a proposta destas cores é mostrar como os valores realmente parecem em monitores, e não em um mundo com correção gama perfeita, este argumento não se aplica ao caso.
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Água | #00FFFF | 0 | 255 | 255 | 100 | 0 | 0 | 0 | 180 | 100 | 100 | |
Água-marinha (cor) | #7FFFD4 | 127 | 255 | 212 | 50 | 0 | 17 | 0 | 160 | 50 | 100 | |
Água-marinha média | #66CDAA | 102 | 205 | 170 | 50 | 0 | 17 | 20 | 160 | 50 | 80 | |
Amarelo | #FFFF00 | 255 | 255 | 0 | 0 | 0 | 100 | 0 | 60 | 100 | 100 | |
Amarelo claro | #FFFFE0 | 255 | 255 | 224 | 0 | 0 | 12 | 0 | 60 | 12 | 100 | |
Amarelo esverdeado | #ADFF2F | 173 | 255 | 47 | 32 | 0 | 82 | 0 | 84 | 82 | 100 | |
Amarelo ouro claro | #FAFAD2 | 250 | 250 | 210 | 0 | 0 | 16 | 2 | 60 | 16 | 98 | |
Amarelo queimado | #EEAD2D | 238 | 173 | 45 | 6 | 34 | 95 | 0 | 40 | 81 | 93 | |
Ameixa | #DDA0DD | 221 | 160 | 221 | 0 | 28 | 0 | 13 | 300 | 28 | 87 | |
Amêndoa | #FFEBCD | 255 | 235 | 205 | 0 | 8 | 20 | 0 | 36 | 20 | 100 | |
Azul | #0000FF | 0 | 0 | 255 | 100 | 100 | 0 | 0 | 240 | 100 | 100 | |
Azul aço | #4682B4 | 70 | 130 | 180 | 61 | 28 | 0 | 29 | 207 | 61 | 71 | |
Azul aço claro | #B0C4DE | 176 | 196 | 222 | 21 | 12 | 0 | 13 | 214 | 21 | 87 | |
Azul alice | #F0F8FF | 240 | 248 | 255 | 6 | 3 | 0 | 0 | 208 | 6 | 100 | |
Azul ardósia | #6A5ACD | 106 | 90 | 205 | 48 | 56 | 0 | 20 | 248 | 56 | 80 | |
Azul ardósia claro | #8470FF | 132 | 112 | 255 | 48 | 56 | 0 | 0 | 248 | 56 | 100 | |
Azul ardósia escuro | #483D8B | 72 | 61 | 139 | 48 | 56 | 0 | 45 | 248 | 56 | 55 | |
Azul ardósia médio | #7B68EE | 123 | 104 | 238 | 48 | 56 | 0 | 7 | 249 | 56 | 93 | |
Azul cadete | #5F9EA0 | 95 | 158 | 160 | 41 | 1 | 0 | 37 | 182 | 41 | 63 | |
Azul celeste | #F0FFFF | 240 | 255 | 255 | 6 | 0 | 0 | 0 | 180 | 6 | 100 | |
Azul céu | #87CEEB | 135 | 206 | 235 | 43 | 12 | 0 | 8 | 197 | 43 | 92 | |
Azul céu claro | #87CEFA | 135 | 206 | 250 | 46 | 18 | 0 | 2 | 203 | 46 | 98 | |
Azul céu profundo | #00BFFF | 0 | 191 | 255 | 100 | 25 | 0 | 0 | 195 | 100 | 100 | |
Azul claro | #ADD8E6 | 173 | 216 | 230 | 25 | 6 | 0 | 10 | 195 | 25 | 90 | |
Azul escuro | #00008B | 0 | 0 | 139 | 100 | 100 | 0 | 45 | 240 | 100 | 55 | |
Azul flor de milho | #6495ED | 100 | 149 | 237 | 58 | 37 | 0 | 7 | 219 | 58 | 93 | |
Azul furtivo | #1E90FF | 30 | 144 | 255 | 88 | 44 | 0 | 0 | 210 | 88 | 100 | |
Azul médio | #0000CD | 0 | 0 | 205 | 100 | 100 | 0 | 20 | 240 | 100 | 80 | |
Azul meia-noite | #191970 | 25 | 25 | 112 | 78 | 78 | 0 | 56 | 240 | 78 | 44 | |
Azul pólvora | #B0E0E6 | 176 | 224 | 230 | 23 | 3 | 0 | 10 | 187 | 23 | 90 | |
Azul real | #4169E1 | 65 | 105 | 225 | 71 | 53 | 0 | 12 | 225 | 71 | 88 | |
Azul violeta | #8A2BE2 | 138 | 43 | 226 | 39 | 81 | 0 | 11 | 271 | 81 | 89 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Bege | #F5F5DC | 245 | 245 | 220 | 0 | 0 | 10 | 4 | 60 | 10 | 96 | |
Branco | #FFFFFF | 255 | 255 | 255 | 0 | 0 | 0 | 0 | 0 | 0 | 1 | |
Branco antigo | #FAEBD7 | 250 | 235 | 215 | 0 | 6 | 14 | 2 | 34 | 14 | 98 | |
Branco fantasma | #F8F8FF | 248 | 248 | 255 | 3 | 3 | 0 | 0 | 240 | 3 | 100 | |
Branco floral | #FFFAF0 | 255 | 250 | 240 | 0 | 2 | 6 | 0 | 40 | 6 | 100 | |
Branco fumaça | #F5F5F5 | 245 | 245 | 245 | 0 | 0 | 0 | 4 | 0 | 0 | 1 | |
Branco navajo | #FFDEAD | 255 | 222 | 173 | 0 | 13 | 32 | 0 | 36 | 32 | 100 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Cáqui | #F0E68C | 240 | 230 | 140 | 0 | 4 | 42 | 6 | 54 | 42 | 94 | |
Cáqui escuro | #BDB76B | 189 | 183 | 107 | 0 | 3 | 43 | 26 | 56 | 43 | 74 | |
Cardo | #D8BFD8 | 216 | 191 | 216 | 0 | 12 | 0 | 15 | 300 | 12 | 85 | |
Castanho | #D2B48C | 210 | 180 | 140 | 0 | 14 | 33 | 18 | 34 | 33 | 82 | |
Chocolate | #D2691E | 210 | 105 | 30 | 0 | 50 | 86 | 18 | 25 | 86 | 82 | |
Ciano | #00FFFF | 0 | 255 | 255 | 100 | 0 | 0 | 0 | 180 | 100 | 100 | |
Ciano claro | #E0FFFF | 224 | 255 | 255 | 12 | 0 | 0 | 0 | 180 | 12 | 100 | |
Ciano escuro | #008B8B | 0 | 139 | 139 | 100 | 0 | 0 | 45 | 180 | 100 | 55 | |
Cinza | #808080 | 128 | 128 | 128 | 0 | 0 | 0 | 50 | 0 | 0 | 1 | |
Cinza ardósia | #708090 | 112 | 128 | 144 | 22 | 11 | 0 | 44 | 210 | 22 | 56 | |
Cinza ardósia claro | #778899 | 119 | 136 | 153 | 22 | 11 | 0 | 40 | 210 | 22 | 60 | |
Cinza ardósia escuro | #2F4F4F | 47 | 79 | 79 | 41 | 0 | 0 | 69 | 180 | 41 | 31 | |
Cinza claro | #D3D3D3 | 211 | 211 | 211 | 0 | 0 | 0 | 17 | 0 | 0 | 1 | |
Cinza escuro | #A9A9A9 | 169 | 169 | 169 | 0 | 0 | 0 | 34 | 0 | 0 | 1 | |
Cinza fosco | #696969 | 105 | 105 | 105 | 0 | 0 | 0 | 59 | 0 | 0 | 0 | |
Cinza médio | #DCDCDC | 220 | 220 | 220 | 0 | 0 | 0 | 14 | 0 | 0 | 1 | |
Concha | #FFF5EE | 255 | 245 | 238 | 0 | 4 | 7 | 0 | 25 | 7 | 100 | |
Coral | #FF7F50 | 255 | 127 | 80 | 0 | 50 | 69 | 0 | 16 | 69 | 100 | |
Coral claro | #F08080 | 240 | 128 | 128 | 0 | 47 | 47 | 6 | 0 | 47 | 94 | |
Creme de marisco | #FFE4C4 | 255 | 228 | 196 | 0 | 11 | 23 | 0 | 33 | 23 | 100 | |
Creme de menta | #F5FFFA | 245 | 255 | 250 | 4 | 0 | 2 | 0 | 150 | 4 | 100 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Dourado | #DAA520 | 218 | 165 | 32 | 0 | 24 | 85 | 15 | 43 | 85 | 85 | |
Dourado escuro | #B8860B | 184 | 134 | 11 | 0 | 27 | 94 | 28 | 43 | 94 | 72 | |
Dourado pálido | #EEE8AA | 238 | 232 | 170 | 0 | 3 | 29 | 7 | 55 | 29 | 93 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Esmeralda | #32CD32 | 50 | 205 | 50 | 76 | 0 | 76 | 20 | 120 | 76 | 80 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Feldspato | #D19275 | 209 | 146 | 117 | 0 | 30 | 44 | 18 | 19 | 44 | 82 | |
Ferrugem | #A0522D | 160 | 82 | 45 | 0 | 49 | 72 | 37 | 19 | 72 | 63 | |
Fúcsia | #FF00FF | 255 | 0 | 255 | 0 | 100 | 0 | 0 | 300 | 100 | 100 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Gelo | #F8F8FF | 248 | 248 | 255 | 3 | 3 | 0 | 0 | 240 | 3 | 100 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Hortelã | #2E8B57 | 46 | 139 | 87 | 67 | 0 | 37 | 45 | 146 | 67 | 55 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Índigo - Aníl | #4B0082 | 75 | 0 | 130 | 42 | 100 | 0 | 49 | 275 | 100 | 51 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Jade | #228B22 | 34 | 139 | 34 | 76 | 0 | 76 | 45 | 120 | 76 | 55 | |
Jambo | #FF4500 | 255 | 69 | 0 | 0 | 73 | 100 | 0 | 16 | 100 | 100 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Laranja | #FFA500 | 255 | 165 | 0 | 0 | 35 | 100 | 0 | 39 | 100 | 100 | |
Laranja escuro | #FF8C00 | 255 | 140 | 0 | 0 | 45 | 100 | 0 | 33 | 100 | 100 | |
Lavanda | #E6E6FA | 230 | 230 | 250 | 8 | 8 | 0 | 2 | 240 | 8 | 98 | |
Lavanda avermelhada | #FFF0F5 | 255 | 240 | 245 | 0 | 6 | 4 | 0 | 340 | 6 | 100 | |
Lima | #00FF00 | 0 | 255 | 0 | 100 | 0 | 100 | 0 | 120 | 100 | 100 | |
Linho | #FAF0E6 | 250 | 240 | 230 | 0 | 4 | 8 | 2 | 30 | 8 | 98 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Madeira | #DEB887 | 222 | 184 | 135 | 0 | 17 | 39 | 13 | 34 | 39 | 87 | |
Magenta | #FF00FF | 255 | 0 | 255 | 0 | 100 | 0 | 0 | 300 | 100 | 100 | |
Magenta escuro | #8B008B | 139 | 0 | 139 | 0 | 100 | 0 | 45 | 300 | 100 | 55 | |
Mamão batido | #FFEFD5 | 255 | 239 | 213 | 0 | 6 | 16 | 0 | 37 | 16 | 100 | |
Maná | #F0FFF0 | 240 | 255 | 240 | 6 | 0 | 6 | 0 | 120 | 6 | 100 | |
Marfim | #FFFFF0 | 255 | 243 | 208 | 0 | 0 | 6 | 0 | 60 | 6 | 100 | |
Marrom | #800000 | 128 | 0 | 0 | 0 | 100 | 100 | 50 | 0 | 100 | 50 | |
Marrom amarelado | #F4A460 | 244 | 164 | 96 | 0 | 33 | 61 | 4 | 28 | 61 | 96 | |
Marrom claro | #A52A2A | 165 | 42 | 42 | 0 | 75 | 75 | 35 | 0 | 75 | 65 | |
Marrom rosado | #BC8F8F | 188 | 143 | 143 | 0 | 24 | 24 | 26 | 0 | 24 | 74 | |
Marrom sela | #8B4513 | 139 | 69 | 19 | 0 | 50 | 86 | 45 | 25 | 86 | 55 | |
Milho | #FFF8DC | 255 | 248 | 220 | 0 | 3 | 14 | 0 | 48 | 14 | 100 | |
Mocassim | #FFE4B5 | 255 | 228 | 181 | 0 | 11 | 29 | 0 | 38 | 29 | 100 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Naval | #000080 | 0 | 0 | 128 | 100 | 100 | 0 | 50 | 240 | 100 | 50 | |
Neve | #FFFAFA | 255 | 250 | 250 | 0 | 2 | 2 | 0 | 0 | 2 | 100 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Oliva | #808000 | 128 | 128 | 0 | 0 | 0 | 100 | 50 | 60 | 100 | 50 | |
Oliva escura | #556B2F | 85 | 107 | 47 | 21 | 0 | 56 | 58 | 82 | 56 | 42 | |
Oliva parda | #6B8E23 | 107 | 142 | 35 | 25 | 0 | 75 | 44 | 80 | 75 | 56 | |
Orquídea | #DA70D6 | 218 | 112 | 214 | 0 | 49 | 2 | 15 | 302 | 49 | 85 | |
Orquídea escura | #9932CC | 153 | 50 | 204 | 25 | 75 | 0 | 20 | 280 | 75 | 80 | |
Orquídea média | #BA55D3 | 186 | 85 | 211 | 12 | 60 | 0 | 17 | 288 | 60 | 83 | |
Ouro | #FFD700 | 255 | 215 | 0 | 0 | 16 | 100 | 0 | 51 | 100 | 100 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Peru | #CD853F | 205 | 133 | 63 | 0 | 35 | 69 | 20 | 30 | 69 | 80 | |
Pêssego | #FFDAB9 | 255 | 218 | 185 | 0 | 15 | 27 | 0 | 28 | 27 | 100 | |
Prata | #C0C0C0 | 192 | 192 | 192 | 0 | 0 | 0 | 25 | 0 | 0 | 1 | |
Preto | #000000 | 0 | 0 | 0 | 0 | 0 | 0 | 100 | 0 | 0 | 0 | |
Púrpura | #800080 | 128 | 0 | 128 | 0 | 100 | 0 | 50 | 300 | 100 | 50 | |
Púrpura média | #9370DB | 147 | 112 | 219 | 33 | 49 | 0 | 14 | 260 | 49 | 86 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Renda antiga | #FDF5E6 | 253 | 245 | 230 | 0 | 3 | 9 | 1 | 39 | 9 | 99 | |
Rosa | #FFC0CB | 255 | 192 | 203 | 0 | 25 | 20 | 0 | 350 | 25 | 100 | |
Rosa claro | #FFB6C1 | 255 | 182 | 193 | 0 | 29 | 24 | 0 | 351 | 29 | 100 | |
Rosa embaçado | #FFE4E1 | 255 | 228 | 225 | 0 | 11 | 12 | 0 | 6 | 12 | 100 | |
Rosa forte | #FF69B4 | 255 | 105 | 180 | 0 | 59 | 29 | 0 | 330 | 59 | 100 | |
Rosa profundo | #FF1493 | 255 | 20 | 147 | 0 | 92 | 42 | 0 | 328 | 92 | 100 | |
Rubro | #DC143C | 220 | 20 | 60 | 0 | 91 | 73 | 14 | 348 | 91 | 86 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Salmão | #FA8072 | 250 | 128 | 114 | 0 | 49 | 54 | 2 | 6 | 54 | 98 | |||
Salmão claro | #FFA07A | 255 | 160 | 122 | 0 | 37 | 52 | 0 | 17 | 52 | 100 | |||
Salmão escuro | #E9967A | 233 | 150 | 122 | 0 | 36 | 48 | 9 | 15 | 48 | 91 | |||
Seda | #FFFACD | 255 | 250 | 205 | 0 | 2 | 20 | 0 | 54 | 20 | 100 | |||
Siena | #FF8247 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Tijolo refratário | #B22222 | 178 | 34 | 34 | 0 | 81 | 81 | 30 | 0 | 81 | 70 | |
Tomate | #FF6347 | 255 | 99 | 71 | 0 | 61 | 72 | 0 | 9 | 72 | 100 | |
Trigo | #F5DEB3 | 245 | 222 | 179 | 0 | 9 | 27 | 4 | 39 | 27 | 96 | |
Turquesa | #40E0D0 | 64 | 224 | 208 | 71 | 0 | 7 | 12 | 174 | 71 | 88 | |
Turquesa escura | #00CED1 | 0 | 206 | 209 | 100 | 1 | 0 | 18 | 181 | 100 | 82 | |
Turquesa média | #48D1CC | 72 | 209 | 204 | 66 | 0 | 2 | 18 | 178 | 66 | 82 | |
Turquesa pálida | #AFEEEE | 175 | 238 | 238 | 26 | 0 | 0 | 7 | 180 | 26 | 93 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Urucum | #EC2300 | 236 | 35 | 0 | 1 | 97 | 100 | 1 | 9 | 100 | 93 |
Nome | Amostra | Tripleto hexadecimal | RGB | CMYK | HSV | |||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Verde | #008000 | 0 | 128 | 0 | 100 | 0 | 100 | 50 | 120 | 100 | 50 | |
Verde amarelado | #9ACD32 | 154 | 205 | 50 | 25 | 0 | 76 | 20 | 80 | 76 | 80 | |
Verde azulado | #008080 | 0 | 128 | 128 | 100 | 0 | 0 | 50 | 180 | 100 | 50 | |
Verde claro | #90EE90 | 144 | 238 | 144 | 39 | 0 | 39 | 7 | 120 | 39 | 93 | |
Verde escuro | #006400 | 0 | 100 | 0 | 100 | 0 | 100 | 61 | 120 | 100 | 39 | |
Verde floresta | #228B22 | 34 | 139 | 34 | 76 | 0 | 76 | 45 | 120 | 76 | 55 | |
Verde grama | #7CFC00 | 124 | 252 | 0 | 51 | 0 | 100 | 1 | 90 | 100 | 99 | |
Verde lima | #32CD32 | 50 | 205 | 50 | 76 | 0 | 76 | 20 | 120 | 76 | 80 | |
Verde mar | #2E8B57 | 46 | 139 | 87 | 67 | 0 | 37 | 45 | 146 | 67 | 55 | |
Verde mar claro | #20B2AA | 32 | 178 | 170 | 82 | 0 | 4 | 30 | 177 | 82 | 70 | |
Verde mar escuro | #8FBC8F | 143 | 188 | 143 | 24 | 0 | 24 | 26 | 120 | 24 | 74 | |
Verde mar médio | #3CB371 | 60 | 179 | 113 | 66 | 0 | 37 | 30 | 147 | 66 | 70 | |
Verde pálido | #98FB98 | 152 | 251 | 152 | 39 | 0 | 39 | 2 | 120 | 39 | 98 | |
Verde Paris | #7FFF00 | 127 | 255 | 0 | 50 | 0 | 100 | 0 | 90 | 100 | 100 | |
Verde primavera | #00FF7F | 0 | 255 | 127 | 100 | 0 | 50 | 0 | 150 | 100 | 100 | |
Verde primavera médio | #00FA9A | 0 | 250 | 154 | 100 | 0 | 38 | 2 | 157 | 100 | 98 | |
Vermelho | #FF0000 | 255 | 0 | 0 | 0 | 100 | 100 | 0 | 0 | 100 | 100 | |
Vermelho escuro | #8B0000 | 139 | 0 | 0 | 0 | 100 | 100 | 45 | 0 | 100 | 55 | |
Vermelho indiano | #CD5C5C | 205 | 92 | 92 | 0 | 55 | 55 | 20 | 0 | 55 | 80 | |
Vermelho laranja | #FF4500 | 255 | 69 | 0 | 0 | 73 | 100 | 0 | 16 | 100 | 100 | |
Vermelho violeta | #D02090 | 208 | 32 | 144 | 0 | 85 | 31 | 18 | 322 | 85 | 82 | |
Vermelho violeta médio | #C71585 | 199 | 21 | 133 | 0 | 89 | 33 | 22 | 322 | 89 | 78 | |
Vermelho violeta pálido | #DB7093 | 219 | 112 | 147 | 0 | 49 | 33 | 14 | 340 | 49 | 86 | |
Violeta | #EE82EE | 238 | 130 | 238 | 0 | 45 | 0 | 7 | 300 | 45 | 93 | |
Violeta escuro | #9400D3 | 148 | 0 | 211 | 30 | 100 | 0 | 17 | 282 | 100 | 83 |
QUAL É O NOSSO FUTURO?
Olá pessoal, neste primeiro post inaugurarei com uma polêmica discussão sobre o texto "O divórcio entre o PSD e o HTML" que achei é bastante pretensioso, pois um não depende do outro. O texto parece voltado para programadores/front-end que tem a possibilidade de fazer a montagem e o layout sozinho. Claro que se souber fazer é uma "mão na roda" porque o tempo iria render demais. Porém o problema é querer desvincular as diversas maneiras de serem criadas as páginas de web. Eu trabalho com UI/UX e não significa que uso ou não um software gráfico para criação. Posso usar PSD, Corel, Illustrator e até PaintBrush ou o próprio desenho no papel. Acho que o futuro da melhor maneira de se construir uma interface funcional e perfeita é a comunicação entre os profissionais da área, independente da ferramenta que será feita.
O texto aborda muito a exclusão dos programas gráficos para se fazer layout, e não é bem assim. O design pode ser feito só em CSS3, mas isso é uma OPÇÃO e não um "achado dos Deuses". Tudo depende muito da ideia do projeto. Se um cliente quiser usar textura, imagem, fotografia e o que mais ele quiser para melhor apresentar seu produto, falaremos com ele que não porque é antiquado e a tendência é FLAT DESIGN? Claro que não. Tendência é tendência e não uma religião. Um bom profissional usará a sua experiência para melhor atendê-lo adequando seu trabalho à melhor qualidade do produto final.
No Design Responsivo há dificuldades para se fazer várias coisas, isso está certo, mas não é motivo para excluir todas as possibilidades de se criar uma interface. Podemos estudar caso a caso. Usar qualquer coisa, testar, entrevistar usuários e prestar bem atenção nas possibilidades para balancear o layout, a funcionalidade e o objetivo, que pra mim são os três pilares de um bom projeto. Abraço e até a próxima discussão!
DICAS PARA UMA PÁGINA DE PRODUTOS EFICIENTE
Escolha um bom endereço na web (URL).
Não escolha aqueles endereços complicados e de difícil leitura. Eles dificultam a memorização.
Não escolha aqueles endereços complicados e de difícil leitura. Eles dificultam a memorização.
A imagem está bonita e mostra exatamente como é o produto?
Uma imagem clara e verdadeira do produto a ser oferecido aumenta significativamente a decisão de escolha e compra.
Uma imagem clara e verdadeira do produto a ser oferecido aumenta significativamente a decisão de escolha e compra.
É de fácil entendimento o nome ou o título do produto?
É importante que na descrição do produto haja palavras chaves relacionadas a ele, possibilitando que seja encontrado mais facilmente no processo de busca. Tente colocar o máximo de informações, como: marca, modelo, especificações técnicas, entre outros.
É importante que na descrição do produto haja palavras chaves relacionadas a ele, possibilitando que seja encontrado mais facilmente no processo de busca. Tente colocar o máximo de informações, como: marca, modelo, especificações técnicas, entre outros.
Coloque a descrição original do produto.
Inclua as informações originais do produto, além de melhorar a posição no ranking de buscas, gera maior credibilidade e convencimento do público-alvo.
Inclua as informações originais do produto, além de melhorar a posição no ranking de buscas, gera maior credibilidade e convencimento do público-alvo.
Mostre claramente os caminhos de compra.
Uma ótima estratégia é o CTA (call-to-action), um indicador/botão de compra. É essencial que o botão esteja destacado e posicionado estrategicamente para que converta usuários em compradores.
Uma ótima estratégia é o CTA (call-to-action), um indicador/botão de compra. É essencial que o botão esteja destacado e posicionado estrategicamente para que converta usuários em compradores.
Conteúdo em vídeo.
Vídeos demonstrativos do produto e de seu funcionamento têm se revelado como uma grande tática de divulgação e de conversão em vendas.
Vídeos demonstrativos do produto e de seu funcionamento têm se revelado como uma grande tática de divulgação e de conversão em vendas.
Feedback.
Opiniões são de grande importância para os negócios, tanto para a empresa como para os próprios compradores, que se sentem mais seguros. Procure manter um espaço para esse feedback, assim terá a oportunidade de saber o que seus clientes pensam e desejam.
Opiniões são de grande importância para os negócios, tanto para a empresa como para os próprios compradores, que se sentem mais seguros. Procure manter um espaço para esse feedback, assim terá a oportunidade de saber o que seus clientes pensam e desejam.
A Experiência do Usuário e os CX Offices
O conceito de Experiência do Usuário (User Experience ou simplesmente “UX”, como é conhecido no mundo da tecnologia) é muito utilizado no desenvolvimento de programas e websites, mas pode ser aplicado à qualquer produto ou serviço, conforme as seguintes definições:
“A Experiência do Usuário (UX) está relacionada ao sentimento do indivíduo enquanto usuário de um produto, sistema ou serviço e a satisfação evocada no contato com este artefato. É preciso estar ciente, todavia, que não se projeta as experiências dos usuários propriamente, mas sim, criam-se as condições para que elas sejam evocadas (PREECE, ROGERS, SHARP, 2011)”.
“A Experiência do Usuário inclui aspectos atribuídos a uma interação humano-computador, mas também pode envolver a percepção de uma pessoa aos aspectos de usabilidade e facilidade para alcançar seus objetivos numa determinada interação. A experiência do usuário é vital para todos os tipos de produtos e serviços e se não for provida de uma maneira positiva, as pessoas certamente não os usarão mais (GARRETT, 2010)”.
Sob a ótica da Experiência do Usuário, devemos definir um cenário ideal como objetivo a ser alcançado, onde todos os percalços que prejudiquem uma “experiência perfeita” devem ser pontuados. Por exemplo, o layout de uma loja pode dificultar a locomoção dos clientes dentro dela, tornando a experiência do cliente mais complicada e ele pode deixar de consumir em tal loja... Os técnicos responsáveis pelo layout podem achar que o problema é inevitável e que os clientes se acostumarão com o passar do tempo, enquanto os vendedores percebem o volume de vendas cair.
É necessário sempre ter em mente que o importante não é provar qual o ponto de vista está certo ou errado (usuário x técnico), mas sim qual é o caminho para melhorar a experiência do cliente quando utiliza o serviço ou produto. Com uma infindável discussão sobre o certo e o errado, os problemas persistirão e nada será feito para solucioná-los. Nesse cenário do exemplo, todos serão prejudicados no curto, médio e longo prazo (clientes, vendedores e empresa).
Em empresas norte-americanas conscientes dessa necessidade de oferecer uma experiência de alta qualidade aos usuários de seus produtos/serviços, estão surgindo os chamados Customer Experience Offices (ou “CX Offices”), que são departamentos formados por equipes multidisciplinares de profissionais com o objetivo de agregar qualidade e valor à experiência do cliente/usuário.
As experiências dos clientes serão aceitas pelos mesmos como verdade, por isso, é essa percepção que você pode e deve gerenciar.
Postado por Marcos Gonçalves
Fonte: http://cxoffice.blogspot.com.br/2013/10/a-experiencia-do-usuario-e-os-cx-offices.html
Fonte: http://cxoffice.blogspot.com.br/2013/10/a-experiencia-do-usuario-e-os-cx-offices.html
As fontes nos elementos HTML
As propriedades para as fontes, definem as características (os valores na regra CSS) das letras que constituem os textos dentro dos elementos HTML.
As propriedades básicas para fontes e que abordaremos neste tutorial são as listadas abaixo:
Valores válidos para as propriedades da fonte
bold
bolder
lighter
100
200
300
400
500
600
700
800
900
Vamos a seguir analisar cada uma delas detalhadamente através de exemplos práticos.
Como estudar e entender os exemplos
Para cada propriedade apresento as regras CSS para um ou mais elementos HTML e definidas dentro de uma folha de estilos incorporada, bem como um trecho do documento HTML onde se aplicam as regras.
A seguir mostro o efeito que a regra produz. Observe a regra e o efeito e para melhor fixar seu aprendizado reproduza o código no seu editor, mude os valores e veja o resultado no browser. Esta é a melhor e mais rápida maneira de você aprender CSS. Bons estudos! E faça ótimo proveito dos tutoriais.
Fonte: www.maujor.com
Alexandre Wollner
Alexandre Wollner (São Paulo, 1928) é um designer gráfico brasileiro.
Wollner é considerado um dos principais nomes na formação do design moderno no Brasil, tendo participado de uma série de entidades importantes no fortalecimento do design brasileiro.
Wollner, quando adolescente, estudou no Instituto de Arte Contemporânea do Museu de Arte de São Paulo. Devido ao talento precoce, conseguiu uma bolsa para estudar na recém criada Escola da Forma de Ulm (sucessora da Bauhaus).
Ao voltar ao Brasil, criou, juntamente com Geraldo de Barros, Ruben Martins e Walter Macedo, a FormInform, escritório pioneiro em design no país.
Embora não tivesse o diploma de "designer gráfico" reconhecido, ganhou permissão especial do Ministério da Educação para dar aulas em cursos superiores, participando assim, da fundação da primeira escola de design do país, a Escola Superior de Desenho Industrial do Rio de Janeiro (ESDI).
Livros publicados
5 anos de design gráfico no Brasil: coletânea de portfólios. Edição Eduardo Viotti. São Paulo: Market Press, 2000.
WOLLNER, Alexandre. Alexandre Wollner. Apresentação Roberto A. Schumaker. São Paulo: Senac, 1999.
WOLLNER, Alexandre. Design visual 50 anos. São Paulo: Cosac & Naify, 2003.
Bibliografia
5 anos de design gráfico no Brasil: coletânea de portfólios. São Paulo: Market Press, 2000. 127 p., il. color.
AMARAL, Aracy (org.). Projeto construtivo brasileiro na arte: 1950-1962. Rio de Janeiro: MAM, 1977. 357 p., il. p&b.
AS BIENAIS e a abstração: a década de 50. São Paulo: Museu Lasar Segall, 1978. [60] p., il. color, p&b. (Ciclo de Exposições de Pintura Brasileira Contemporânea).
AYALA, Walmir (org.), CAVALCANTI, Carlos (org.). Dicionário brasileiro de artistas plásticos - Q - Z. Apresentação Maria Alice Barroso. Brasília: MEC: INL, 1973. v. 4, pt. 1, il. p&b. (Dicionário especializado, 5).
GULLAR, Ferreira. Arte Concreta. In: ______. Etapas da arte contemporânea: do cubismo à arte neoconcreta. 2.ed. Rio de Janeiro: Revan, 1998. 304 p., il. p&b.
NIEMEYER, Lucy. Design no Brasil. 2.ed. Rio de Janeiro: 2AB, 1998. 128 p. (Design).
Ligações externas
RedeDesign Brasil - biografia - em português
Arcoweb - entrevista - em português
www.centrocultural.sp.gov.br
Tipologia ou tipografia? Não use o termo errado.
Muita gente se engana quando usa o termo tipologia para se referir à classificação do desenho de letras do alfabeto e de caracteres usados para formar as palavras. Neste caso o tipo é outro.
Uma grande bobagem que tenho ouvido ao longo dos anos é a insistência no uso do termo tipologia a para classificação de tipos. Tipologia na verdade é um termo pertencente à taxionomia, a ciência das classificações, o estudo das características das diferenças entre objetos e seres vivos de toda espécie.
Nós temos a tipografia que, aí sim, é a arte e processo de criação de caracteres. A tipografia tem origem etimológica na implantação da impressão por tipos móveis na Europa, a partir do século XV. Portanto é a forma certa.
Muitos acadêmicos, profissionais e universitários não usam o termo correto, talvez por falta de interesse sobre o tema ou vivência no assunto. Sei disso por experiência própria, pois meu trabalho de conclusão de curso na faculdade foi sobre tipografia. Parecia um assunto simples… mas não era.
Na prática a discussão sobre qual seria o termo correto – tipografia, e não tipologia – acabou trazendo problemas do começo ao fim do projeto. Mas felizmente algo importante ficou estabelecido.
O termo tipografia foi usado em todo o trabalho, em detrimento de tipologia, apesar da insistência de muitos. Mesmo na apresentação do projeto, um célebre arquiteto que fazia parte da banca examinadora bateu o pé quanto ao termo utilizado.
Qualquer pessoa que trabalhe na criação de sites tem muito a lucrar ao aprender um pouco mais sobre tipografia. De uns anos pra cá tenho participado de uma lista de discussão sobre tipografia muito interessante. Cadastre–se e terá informações de profissionais que estudam e se dedicam a esse fascinante tema.
Só não pergunte sobre tipologia, que a Lucy Niemeyer vai puxar uma orelha e eu puxo a outra! [Webinsider]
- See more at: http://webinsider.com.br/2003/03/03/tipologia-ou-tipografia-nao-use-o-termo-errado/#sthash.AEx9KahH.dpuf
Psicologia das cores
A cor é assimilada pelo ser humano através do sentido da visão. A visão é dos cinco sentidos o que mais rapidamente conduz a informação até ao cérebro. Dessa forma os olhos são os sensores e o cérebro é o processador.
Quando escolhemos uma cor para elaborarmos nossos trabalhos devemos ter em mente que estamos lidando com um elemento de estímulo imediato, e que essa cor escolhida provocará diversas reações em seus observadores, positivas ou negativas.
A subjetividade do artista, com sua sensibilidade e memória cromática condiciona totalmente a harmonia obtida entre as cores de seu trabalho. Da mesma forma como condicionam a interpretação do espectador da obra observada. As cores influenciam o estado psicológico dos seres humanos de várias maneiras, e são mais ligadas à emoção. As pessoas se lembrarão mais facilmente das cores do que de formas.
No ocidente, as cores surtem diferentes efeitos psicológicos sobre as pessoas, como sugere a lista:
- Branco - purificador, perfeição, pureza, neutralidade, humildade, limpeza, claridade, frieza e esterilidade, pureza, inocência, reverência, paz, simplicidade, esterilidade, rendição, união;
- Preto - luto, elegância, solidez, poder, modernidade, sofisticação, formalidade, morte, medo, anonimato, raiva, mistério, azar;
- Cinza - elegância, humildade, respeito, reverência, sutileza;
- Amarelo - concentração, disciplina, comunicação, ativa o intelecto, positividade, boa sorte;
- Vermelho - paixão, entusiasmo, impacto, agressividade, força, energia, amor, liderança, masculinidade, perigo, fogo, raiva, revolução, "pare";
- Rosa - Amor, carinho, suavidade, acolhimento, romantismo;
- Azul - harmonia, confidência, conservadorismo, austeridade, monotonia, dependência, tecnologia, liberdade, saúde, purificação, amabilidade, paciência, serenidade;
- Ciano - tranquilidade, paz, sossego, limpeza, frescor;
- Verde - esperança, cura, natureza, paz, natureza, primavera, fertilidade, juventude, desenvolvimento, riqueza, dinheiro, boa sorte, ciúmes, ganância, esperança;
- Lilás - influencia emoções e humores, intuição e espiritualidade;
- Roxo - velocidade, concentração, otimismo, alegria, felicidade, idealismo, riqueza (ouro), fraqueza, dinheiro;
- Magenta - luxúria, sofisticação, sensualidade, feminilidade, desejo;
- Violeta - espiritualidade, criatividade, realeza, sabedoria, resplandecência, dor;
- Laranja - equilíbrio, generosidade, entusiasmo, alegria, aconchegante, energia, criatividade, equilíbrio, entusiasmo, ludismo;
- Castanho - sólido, seguro, calmo, natureza, rústico, estabilidade, estagnação, peso, aspereza.
Teoria das cores
A Teoria das Cores afirma que a cor é um fenômeno físico relacionado a existência da luz, ou seja, se a luz não existisse, não existiriam cores. O preto é percebido quando algo absorve praticamente toda a luz que o atinge. Já o branco é percebido em algo que reflete praticamente todas as faixas de luz. Pode-se dizer que o branco e o preto não são cores propriamente, e sim a presença ou ausência da luz.
Isaac Newton foi o primeiro a associar que a luz do Sol tinha forte relação com a existência das cores, quando dissociou a luz solar nas cores do arco-íris através de um prisma.Surgia ali o primeiro esboço do que posteriormente viria a ser chamada de Teoria das Cores.
Vários estudiosos do passado se dedicaram a entender o fenômeno das cores. Os primeiros sistemas de cores foram os de Newton e de Goethe. Estes sistemas se concentravam mais em saber como se formavam as cores. O Sistema de Chevreul, mais recente, também utiliza de um eixo vertical que indica o brilho e a saturação da cor. O sistema esférico de Otto Runge pretende descrever e encontrar harmonias cromáticas. Aqui, as cores puras e suas misturas situam-se no equador da esfera, e enquanto se aproximam do centro, pendem para a cor cinzento médio. Assim, as cores tornam-se escuras em direcção ao pólo inferior até atingir o preto, e tornam-se claras , até ao pólo superior, atingindo o branco.
Estes são sistemas de cores que visam organizar e racionalizar o estudo das cores no intuito de se constituir uma teoria das cores, no entanto a harmonia entre as cores não é assim tão objetiva. Hoje sabe-se bem que a cor é um fenômeno subjetivo, pois ela é constituída de ondas eletromagnéticas de uma faixa de frequência tal que as colocam dentro do que denomina-se espectro visível, ou seja, a faixa de frequência daquelas ondas que são captadas pela sensibilidade dos olhos humanos. Animais veem tudo de forma diferente.
Assinar:
Postagens (Atom)