Dark mode (modo escuro)

Tema de interface com fundo escuro e conteúdo claro, oferecido como opção pra quem usa.

Hard

O que é

Dark mode inverte o padrão clássico de fundo claro com texto escuro, porque usa superfícies escuras como base e elementos claros pra conteúdo e controles. Hoje ele já virou expectativa comum em sistema operacional, app e site.

Os benefícios mais citados são o conforto em ambiente de pouca luz e a economia de bateria em telas OLED, onde o preto desliga o pixel. Os estudos divergem sobre o efeito na vista, mas muita gente relata um uso mais confortável à noite.

No fundo, a questão é escolha, já que as pessoas percebem conforto de jeitos diferentes e algumas leem melhor no claro. Por isso, oferecer dark mode opcional e fácil de alternar é mais um respeito por essa diferença do que uma obrigação de estilo.

Em uma frase

No dark mode aquele azul some no fundo escuro, então a gente precisa de uma paleta própria pro tema, não dá pra reaproveitar.

A pergunta que ele responde

Vale a pena oferecer modo escuro, e o que muda além de só inverter as cores?

Quando usar

Ajuda quando o produto tem uso prolongado ou noturno e dá pra manter contraste e legibilidade nos dois temas.

Como não usar

O cuidado é não inverter as cores no automático e dar por pronto, porque sem ajuste de contraste e paleta o escuro fica ilegível e ainda quebra a acessibilidade.

Na prática

Pense num time que ativa o dark mode e descobre que o azul do botão some no fundo escuro. A solução não é reaproveitar a mesma cor, e sim ter uma paleta específica pro tema.

Não confunda com

Vale lembrar que dark mode não é só trocar as cores. O contraste precisa ser recalibrado, e cores de destaque que funcionam no claro costumam falhar no escuro, por isso os dois temas pedem teste separado.

Design

Em inglês

Dark Mode

Pronúncia

dârk moud

Também chamado de

modo escuro, tema escuro, dark theme

Origem

n/a

Fonte

Saiba mais

Nielsen Norman Group, artigo sobre dark mode pros and cons