Branco total
Existe uma quantidade enorme de sites na internet e, se você reservar um tempo para percorrê-los, vai notar que a porcentagem com fundo branco é altíssima. As razões variam, mas sem dúvida houve gente que escolheu um fundo branco liso simplesmente porque sua onipresença e popularidade fazem parecer que ele é automaticamente o melhor para qualquer projeto, e nem sempre é o caso.
Por isso, aqui destrinchamos algumas das razões (simples e complexas) de o design web gravitar tanto para o pano de fundo branco. Entender essas motivações pode ajudar você a decidir se o branco total é o certo ou o errado para o seu projeto.
Códigos da cor Branco
Galeria
Uma amostra de fundos brancos prontos para usar. Passe o cursor sobre qualquer imagem e clique no botão de download para baixar a versão em resolução completa.
Como usar um fundo branco
Papel de parede: um fundo branco limpo mantém o computador ou o celular calmo e legível; cada imagem acima baixa em resolução completa.
Liso e sólido: o padrão atrás de fotos de produto, fotos de documento e anúncios; copie um tom exato mais abaixo.
Web e design: o branco é o espaço em branco: é o que faz layouts minimalistas parecerem sem esforço e o conteúdo parecer organizado.
Tons de branco
O branco puro é só o começo: a neve, o marfim, o linho e a pérola carregam cada um uma temperatura diferente. Os brancos quentes (creme, branco-antigo) parecem macios e orgânicos; os frios (branco-fantasma, névoa-celeste) parecem nítidos e técnicos. Lado a lado as diferenças são óbvias; sozinhos, cada um continua se lendo branco.
Clique em um tom para copiar o código hex, ou baixe como um fundo pronto para usar:
Fundos brancos em degradê
Um degradê dá a um fundo branco a profundidade exata para ele não parecer chapado. Aqui estão seis degradês brancos prontos para usar. Copie o CSS direto para a sua folha de estilos, ou baixe a imagem em resolução completa. Quer criar o seu? Abra o CSS Gradient e monte um branco do seu jeito.
O que significa o branco
O branco parece simples até você colocá-lo para trabalhar. Acessibilidade, legibilidade e cultura entram todas em jogo.
Questões de acessibilidade
Possivelmente a explicação mais simples de tantos sites se apoiarem em um fundo branco é algo chamado «efeito padrão»: quando uma opção é a predefinida, a maioria das pessoas a escolhe acima de todas as outras. As razões são muitas: há quem presuma que ser a opção padrão equivale a uma recomendação, há quem se sobrecarregue e prefira não gastar energia mental decidindo quando já existe um valor predefinido, e a lista continua. Os desenvolvedores sabem que os estilos de CSS e HTML nos navegadores vêm com branco por padrão, então tendem a ficar com ele. É como colocar papel de parede branco sobre uma parede já pintada de branco.
Legibilidade
Um tema recorrente nas discussões sobre por que o fundo branco liso é a regra no design web é que fundo branco com texto preto é o auge da legibilidade. A ideia dominante é que, para um site ser fácil de ler, o contraste é a chave, e o contraste costuma vir do pareamento dos dois extremos opostos do espectro.
E por que texto preto sobre fundo branco, e não o contrário? Há uma teoria interessante: desde os primeiros dias da escrita usamos tinta escura sobre papel claro (ou pergaminho, ou papiro), e isso persiste até hoje: quem cresceu com livros antes de haver computador em casa precisaria desse lembrete visual dos livros. A teoria não se sustenta muito se você viveu os dias do texto verde brilhante sobre o fundo preto opaco do Apple IIc da família. Se a legibilidade é a sua única razão para escolher um fundo branco liso sob texto preto, ela é totalmente válida. Mas texto preto sobre pano de fundo branco não é a única opção legível que existe.
Considerações culturais do branco
A psicologia das cores estuda como as cores podem influenciar o comportamento humano, até inconscientemente. É uma ferramenta valiosíssima em marketing e branding, porque a reação de um público a certas cores ou combinações tem efeito muito direto em como um produto é percebido. Logotipos e embalagens impactam diretamente as vendas, então não é exagero dizer que as cores do seu site podem ser a chave para atrair (ou repelir) públicos. Saber um pouco de psicologia das cores ajuda a não ofender clientes em potencial sem querer.
Tem gente que pensa no branco como uma cor neutra. Pode ser verdade no design de interiores, mas não necessariamente na web: o seu site pode alcançar pessoas do mundo inteiro, então vale pensar em como suas escolhas de cor são percebidas em culturas diferentes da sua.
Na maioria das culturas ocidentais, o branco significa pureza e paz: por isso você encontra vestidos brancos e pombas brancas nos casamentos. Mas em vários países asiáticos, incluindo China e Coreia, o branco simboliza a morte, o luto e o azar. Enquanto no Ocidente se veste preto nos funerais, onde o branco significa morte os enlutados tradicionalmente vestem branco. À parte: na Itália costumam deixar crisântemos brancos nos túmulos; o crisântemo é flor de luto em muitos países europeus, então o crisântemo branco carrega simbolismo em dobro.
As cores também se sobrepõem entre culturas: uma bandeira branca é símbolo de trégua no mundo inteiro. E enquanto umas culturas veem no branco limpeza, outras veem esterilidade: parecem sinônimos, mas a limpeza carrega uma associação bem mais positiva. A lição é ter presente quem é o seu público e se as associações dele com o branco tendem ao positivo ou ao negativo, e planejar de acordo.
Faça o branco trabalhar para você
Agora que você leu por que as pessoas gravitam para o branco e conhece seus componentes culturais, psicológicos e de design, explore a cor no seu site, nas redes ou nos papéis de parede. No fim, design é sobre a sua estética. Se você busca um clima clean e minimalista, um fundo branco liso é uma ótima escolha. E ele segue sendo o padrão-ouro para blogs e sites com muito texto, pelo fator legibilidade.
Um fundo branco liso não é sua única opção. Você pode brincar com a nossa ferramenta Trianglify e criar um fundo branco com textura, com tons variados de branco e off-white, para um efeito sutil de branco sobre branco. Um papel de parede de degradê CSS com brancos e cinzas claros é outra virada divertida, porque adiciona dimensionalidade sem ofuscar o conteúdo do site. Dá até para canalizar o seu Mondrian interior e explorar formas geométricas num fundo branco abstrato, brincando com o branco como cor de contraste. Como já vimos, o branco não é neutro, então não tenha medo de usá-lo para se expressar como faria com qualquer outra cor.
Significado histórico na arte
O design web é uma arte em si, então faz sentido olhar como o branco foi usado na arte ao longo dos anos em busca de inspiração. (Vale notar que muitos museus e galerias usam paredes brancas como pano de fundo para as peças que exibem, o que pode servir de metáfora para o seu site se o projeto for pesado em imagens.)
As cavernas de Lascaux, na França, guardam desenhos de uns 17 000 anos atrás, feitos principalmente com carvão e ferro que os próprios artistas pré-históricos preparavam. Eles também usaram calcita e giz para criar panos de fundo brancos ou marcar brilhos contra o pigmento escuro. Há vários milênios, nossos antecessores já sabiam o que seguimos sabendo: para causar impacto, o contraste é a chave. E não estavam sozinhos: na Grécia antiga se via o mundo em escuridão e luz, e a arte de lá carregava forte o contraste entre preto e branco (embora, com só quatro cores em uso, talvez não tenha sido uma decisão inteiramente de design).
Talvez o uso mais interessante do branco na arte tenha vindo do pintor holandês Piet Mondrian, pioneiro da abstração do século XX. Ao pensar nele, você provavelmente lembra de obras como a Composição com grande plano vermelho, amarelo, preto, cinza e azul, de 1921, parte da série definitivamente abstrata que mudou o mundo da arte. Ele limitou a paleta às três cores primárias, mais preto, branco e cinza. Com certeza você consegue imaginar as linhas pretas austeras que dividem o quadro em retângulos, e até os grandes quadrados de um vermelho decidido e os menores de amarelo-manteiga. Mas, olhando de novo, você vê quanto trabalho o branco faz na peça. O fundo branco é o que traz o contraste e o drama.
Colofão
Embora o Cool Backgrounds seja um ótimo recurso para gerar imagens a partir de bibliotecas populares de JavaScript, o trabalho pesado de verdade fica por conta dos próprios autores das bibliotecas. No quesito atendimento, Quinn Rohlf, do Trianglify.js, responde com uma rapidez incrível e ainda por cima é um cara muito inteligente. O Particle.js é desenvolvido por Marc Brüderlin, com uma API excelente, e segue em manutenção ativa. O Gradient Topography é um projeto recém-criado por mim em resposta ao trabalho incrível da equipe do Codrops. E, claro, o Unsplash é um dos maiores tesouros da internet de todos os tempos, criado pela antiga equipe do Crew como projeto paralelo.
Ah, sim, e não posso esquecer o CSS Gradient e o Rellax.js, que é o «cool background» por trás daquelas formas deslizantes de paralaxe na seção de conteúdo deste site.