Cinquenta pares de cores para QR code, e quais deles sobrevivem à impressão

pela equipe KoloQRPesquisa

Cartões brancos com QR codes em oito cores diferentes - azul-marinho, roxo, vermelho-sangue, vinho, cinza, laranja, verde e amarelo - sobre um fundo verde vivo, com uma faixa preta arredondada cruzando o meio com os dizeres "50 QR Code Colour Pairs".

Dos cinquenta pares de código e fundo abaixo, dez passam os 7:1 e podem ser impressos com segurança, onze ficam entre 4:1 e 7:1 e pertencem às telas, e treze caem abaixo de 4:1 e não deveriam carregar QR code nenhum. O padrão das falhas é constante: cores de marca em meio-tom. Todo amarelo, todo laranja acima do Âmbar 700 e todo verde mais claro que o Verde floresta está no grupo de baixo.

Pontos principais

  • Dez dos cinquenta pares passam os 7:1, a meta de trabalho para impressão. Todos os dez são uma cor muito escura sobre branco ou sobre um tom quase branco.
  • Treze ficam abaixo de 4:1. Cada um deles é uma cor de meio-tom ou clara usada como código em vez de fundo - amarelos, laranjas, verdes médios, cianos médios.
  • A falha é sistemática, não aleatória. Uma cor escura o bastante para imprimir um QR code legível costuma ser mais escura do que a cor que a marca considera sua.
  • A razão de contraste é aritmética sobre dois valores hexadecimais, então cada número desta tabela é reproduzível em vez de relatado. Nenhum código foi impresso e lido para produzi-la.
  • A razão fala do par, não da impressão. Ganho de ponto, cor do substrato, brilho e a própria exposição da câmera ficam entre uma razão aprovada e um código que é lido no papel.
  • Inverter - código claro sobre fundo escuro - pode produzir uma razão altíssima e ainda assim falhar, porque alguns decodificadores assumem escuro sobre claro e nunca tentam a outra polaridade.

O que o número desta tabela é e o que ele não é

Uma razão de contraste é a luminância relativa da mais clara de duas cores dividida pela da mais escura, deslocada para que a escala vá de 1:1 com duas cores idênticas a 21:1 com preto sobre branco. É o mesmo número que a WCAG usa para legibilidade de texto, e ele é calculado em vez de observado: linearize cada canal sRGB, pondere 0,2126 para vermelho, 0,7152 para verde e 0,0722 para azul, e divida.

Vale enunciar essa definição com precisão, porque é a razão de cada linha abaixo ser conferível. Ninguém precisa confiar nesta tabela. Dois valores hexadecimais e a fórmula produzem o mesmo número em qualquer máquina, o que é um tipo de afirmação diferente de "testamos e funcionou".

E esse também é o limite dela. Nenhum QR code foi impresso e lido para produzir esta tabela. A coluna de veredito aplica dois limiares de design que este site já publica - em torno de 7:1 para impressão e em torno de 4:1 para tela - a uma razão calculada. É um filtro para decidir quais pares vale a pena testar, não um substituto do teste.

O motivo de esses limiares ficarem tão acima do que um decodificador precisa está em o teste de contraste mínimo: o decodificador de código aberto que dá para ler desiste perto de 1,2:1, e tudo entre esse ponto e 7:1 é margem para o que a impressão faz com um código depois de o arquivo estar correto.

Os dez pares que passam na impressão

Estes chegam a 7:1 ou mais e ainda têm margem para ganho de ponto, reflectância do papel e uma fonte de luz inconveniente. Todos são uma cor muito escura sobre branco.

ParHexRazãoSeguro para
Preto sobre branco#000000 sobre #FFFFFF21,00:1Impressão
Quase preto sobre branco#111111 sobre #FFFFFF18,88:1Impressão
Azul-marinho sobre branco#0B1F3A sobre #FFFFFF16,52:1Impressão
Roxo escuro sobre branco#581C87 sobre #FFFFFF10,88:1Impressão
Bordô sobre branco#7F1D1D sobre #FFFFFF10,02:1Impressão
Vinho sobre branco#9D174D sobre #FFFFFF7,88:1Impressão
Verde escuro sobre branco#065F46 sobre #FFFFFF7,68:1Impressão
Cinza quente sobre branco#57534E sobre #FFFFFF7,63:1Impressão
Laranja queimado sobre branco#9A3412 sobre #FFFFFF7,31:1Impressão
Verde floresta sobre branco#166534 sobre #FFFFFF7,13:1Impressão
O laranja queimado a 7,31:1 é a entrada útil aqui: é a única cor da lista que uma marca chamaria de laranja, e está vários passos mais escura que o laranja que a maioria das marcas tem.

A leitura prática deste grupo é que a paleta imprimível é estreita e profunda. Azul-marinho, bordô, vinho, verde escuro, roxo escuro - essas são as cores que funcionam, e uma marca cuja identidade vive nessa ponta da própria paleta pode imprimir um QR code colorido sem pensar duas vezes.

Os onze pares que pertencem a uma tela

Estes ficam entre 4:1 e 7:1. Numa tela, onde o contraste é perfeito, a luz é uniforme e as bordas são duras, eles vão bem. Na impressão, gastaram a margem antes de a tinta secar.

ParHexRazãoSeguro para
Roxo 700 sobre branco#7E22CE sobre #FFFFFF6,98:1Só tela
Azul royal sobre branco#1D4ED8 sobre #FFFFFF6,70:1Só tela
Vermelho 700 sobre branco#B91C1C sobre #FFFFFF6,47:1Só tela
Verde-azulado 700 sobre branco#0F766E sobre #FFFFFF5,47:1Só tela
Ciano 700 sobre branco#0E7490 sobre #FFFFFF5,36:1Só tela
Azul 600 sobre branco#2563EB sobre #FFFFFF5,17:1Só tela
Verde 700 sobre branco#15803D sobre #FFFFFF5,02:1Só tela
Âmbar 700 sobre branco#B45309 sobre #FFFFFF5,02:1Só tela
Vermelho 600 sobre branco#DC2626 sobre #FFFFFF4,83:1Só tela
Pedra 500 sobre branco#78716C sobre #FFFFFF4,80:1Só tela
Rosa 600 sobre branco#DB2777 sobre #FFFFFF4,60:1Só tela
O Roxo 700 erra o limiar da impressão por 0,02. Tratar 7:1 como um precipício seria bobagem - mas dar por resolvido um par tão colado na linha sem uma prova também seria.

Essa é a faixa em que a maioria das cores de marca realmente fica, e é a faixa que produz a falha específica do código que era lido no estúdio e não foi lido na prateleira. O teste do estúdio foi num monitor.

Os treze pares que não deveriam carregar um código

Abaixo de 4:1, um QR code depende da tolerância do decodificador em vez de ser legível. Esses pares às vezes são lidos, num celular bom, com luz boa, num tamanho generoso - o que é pior do que falhar de vez, porque passa no único teste que alguém faz.

ParHexRazãoSeguro para
Roxo 500 sobre branco#A855F7 sobre #FFFFFF3,96:1Nenhum
Vermelho 500 sobre branco#EF4444 sobre #FFFFFF3,76:1Nenhum
Azul 500 sobre branco#3B82F6 sobre #FFFFFF3,68:1Nenhum
Laranja 600 sobre branco#EA580C sobre #FFFFFF3,56:1Nenhum
Rosa 500 sobre branco#EC4899 sobre #FFFFFF3,53:1Nenhum
Âmbar 600 sobre branco#D97706 sobre #FFFFFF3,19:1Nenhum
Dourado sobre branco#CA8A04 sobre #FFFFFF2,94:1Nenhum
Laranja 500 sobre branco#F97316 sobre #FFFFFF2,80:1Nenhum
Ciano 500 sobre branco#06B6D4 sobre #FFFFFF2,43:1Nenhum
Verde 500 sobre branco#22C55E sobre #FFFFFF2,28:1Nenhum
Amarelo 500 sobre branco#EAB308 sobre #FFFFFF1,92:1Nenhum
Lima sobre branco#78D650 sobre #FFFFFF1,82:1Nenhum
Amarelo 400 sobre branco#FACC15 sobre #FFFFFF1,53:1Nenhum
Amarelo sobre branco chega a 1,53:1, perto do ponto em que um decodificador para de ver qualquer padrão em vez de ver um padrão fraco.

O padrão deste grupo é a conclusão que vale levar. Não é que alguns matizes falhem e outros passem - é que a claridade é a variável e o matiz não é. O verde aparece nas três faixas: o verde escuro passa com 7,68:1, o Verde 700 é só de tela com 5,02:1 e o Verde 500 falha com 2,28:1. A cor é a mesma ideia três vezes; só a luminância mudou.

Códigos escuros em papel colorido

Imprimir em qualquer coisa que não seja branco derruba a razão, porque os módulos claros do código são o papel. Kraft, creme, reciclado e papéis coloridos partem todos de mais baixo do que o arquivo sugere, e o arquivo não consegue dizer de quanto.

ParHexRazãoSeguro para
Preto sobre creme#000000 sobre #FDF6E319,47:1Impressão
Preto sobre bege#000000 sobre #F5F5DC18,98:1Impressão
Grafite sobre branco gelo#1A1A1A sobre #F7F7F516,23:1Impressão
Azul Oxford sobre quase branco#14213D sobre #FCFCFC15,57:1Impressão
Azul-marinho sobre azul claro#0B1F3A sobre #EFF6FF15,18:1Impressão
Azul Oxford sobre âmbar claro#14213D sobre #FEF3C714,35:1Impressão
Grafite sobre cinza médio#1A1A1A sobre #D4D4D811,78:1Impressão
Bordô sobre vermelho claro#7F1D1D sobre #FEF2F29,16:1Impressão
Verde floresta sobre verde claro#166534 sobre #F0FDF46,81:1Só tela
Cinza escuro sobre cinza 400#333333 sobre #9CA3AF4,98:1Só tela
Um tom pálido custa menos do que parece. Preto sobre creme perde 1,53 em relação a preto sobre branco, o que é nada. O que custa é a cor do código clarear, não o papel escurecer.

As duas últimas linhas são as instrutivas. Verde floresta sobre branco passava com 7,13:1; o mesmo verde sobre um tom verde claro cai para 6,81:1 e já não passa o limiar da impressão. Um tom que mal se vê moveu um par aprovado para a faixa marginal.

Códigos claros sobre fundos escuros são outra pergunta

Inverter um QR code - módulos claros sobre fundo escuro - produz razões altas com facilidade, e a razão não é o problema. O problema é que a fórmula da razão de contraste é simétrica e os decodificadores não são.

ParHexRazãoSeguro para
Branco sobre preto#FFFFFF sobre #00000021,00:1Teste
Branco gelo sobre quase preto#F5F5F5 sobre #11111117,32:1Teste
Branco sobre azul-marinho#FFFFFF sobre #0B1F3A16,52:1Teste
Amarelo 400 sobre quase preto#FACC15 sobre #11111112,33:1Teste
Lima sobre quase preto#78D650 sobre #11111010,38:1Teste
Azul 400 sobre azul-marinho#60A5FA sobre #0B1F3A6,50:1Teste
O amarelo chega a 12,33:1 invertido e a 1,53:1 do jeito certo. Mesma cor, mesma fórmula, resultados opostos - uma boa ilustração de por que a razão sozinha não decide nada.

Um QR code é especificado como módulos escuros sobre fundo claro, e embora muitos decodificadores tentem a polaridade invertida, nem todos tentam e nenhum promete. Isso é uma pergunta sobre o parque de leitores e não sobre cor, e razão nenhuma responde. Se um design pede um código invertido, a coluna de veredito diz teste, porque testar é o único jeito de descobrir.

O que a razão não conta

Quatro coisas ficam entre uma razão aprovada e um código que é lido no papel, e nenhuma delas aparece no arquivo.

  • Ganho de ponto. Toda máquina engorda um pouco as áreas escuras. Num QR code isso significa que os módulos claros ficam mais estreitos, o que derruba o contraste efetivo exatamente na escala em que um decodificador amostra.
  • Substrato. A razão assume que o fundo é a cor do arquivo. Em papel não revestido, reciclado ou colorido ele não é, e o papel está fazendo metade do trabalho.
  • Acabamento. Uma laminação brilhante pode colocar um reflexo especular sobre parte do símbolo por melhor que seja o par embaixo. Um código de 21:1 sob um reflexo é um código de 1:1 naquele trecho.
  • Exposição da câmera. Um celular mede a cena inteira. Um código pequeno numa superfície grande e clara é exposto para a superfície, e chega ao decodificador mais chapado do que saiu da gráfica.

É por isso que a coluna de veredito é escrita como limiar e não como promessa. Passar dos 7:1 significa que o par não é o motivo de o código falhar; não significa que o código não vai falhar.

Como conferir um par que não está nesta tabela

A maioria das paletas de marca tem uma cor que não está entre as cinquenta. A conferência leva segundos e é a mesma usada para montar a tabela.

  1. Pegue a razão dos dois valores hexadecimais. Coloque a cor do código e a do fundo no verificador de contraste QR. Ele devolve o mesmo número que esta tabela usa, para qualquer par.
  2. Compare com o trabalho, não com um número único. Em torno de 7:1 para qualquer coisa impressa, em torno de 4:1 para um código que só será exibido em tela. Abaixo de 4:1, mude a cor em vez do tamanho.
  3. Se falhar, escureça em vez de trocar o matiz. As falhas desta tabela são um problema de claridade. Um laranja de marca que falha em 2,80:1 normalmente tem um irmão mais escuro na mesma paleta que passa dos 7:1 e continua lendo como a marca.
  4. Meça o arquivo exportado, não a amostra de cor. O validador de QR code lê a exportação pronta e informa o contraste que ela realmente contém, junto com a zona de silêncio e o tamanho de módulo. Um degradê ou um fundo suave muda a resposta que as amostras deram.
  5. Rode a escada antes de uma tiragem grande. A escada de contraste de o teste de contraste mínimo produz um limiar para os seus próprios celulares e o seu próprio material, que é o único número que descreve o seu trabalho em vez do caso geral.

Para o lado de design da mesma decisão - que partes de um código aceitam cor e onde entra um acento - QR codes coloridos cobrem o posicionamento em vez da aritmética.

Crie seu QR code

Grátis, sem conta e sem marca d'água. Escolha uma forma, adicione um logo, confira o contraste e exporte SVG, PDF, EPS ou PNG: um código estático sem assinatura por trás.

Gerar QR code

Questions? Answered

Projete para cerca de 7:1 na impressão e cerca de 4:1 na tela. Decodificadores aceitam muito menos - o de código aberto que dá para ler desiste perto de 1,2:1 -, mas tudo entre esse ponto e 7:1 é margem para ganho de ponto, papel, reflexo e exposição da câmera. Um par abaixo de 4:1 depende de tolerância em vez de legibilidade.

Não como o código em si. Amarelo 400 sobre branco mede 1,53:1 e Amarelo 500 mede 1,92:1, os dois muito abaixo de qualquer limiar utilizável. O amarelo funciona como fundo com um código bem escuro em cima, e funciona invertido sobre quase preto a 12,33:1 - mas um código amarelo sobre fundo claro, não.

A maioria das cores de marca fica entre 4:1 e 7:1, o que basta numa tela e não basta no papel. Uma tela dá contraste perfeito, luz uniforme e bordas duras; a impressão gasta os três em ganho de ponto, reflectância e reflexo. O teste do monitor foi o mais fácil.

Ele mede 21:1, o mesmo que preto sobre branco, e mesmo assim precisa de teste. A norma QR especifica módulos escuros sobre fundo claro. Muitos decodificadores tentam a polaridade invertida e alguns não, então um código invertido é uma pergunta sobre o parque de leitores que número de contraste nenhum responde.

Não por si só. Preto sobre creme mede 19,47:1 e preto sobre bege 18,98:1, os dois bem acima do limiar de impressão. O que quebra códigos é a cor do padrão clarear, não o papel escurecer. A combinação a evitar é um código escuro sobre um material de meio-tom.

Não, e a tabela não afirma isso. Cada razão é calculada a partir dos dois valores hexadecimais com a fórmula padrão de luminância relativa, o que torna cada número reproduzível em vez de relatado. A coluna de veredito aplica limiares de design publicados a esse número. Se um par específico sobrevive a uma máquina específica é prova, não cálculo.

Linearize cada canal sRGB das duas cores, pondere 0,2126 para vermelho, 0,7152 para verde e 0,0722 para azul para obter a luminância relativa, e divida a maior pela menor somando 0,05 a cada uma. Qualquer calculadora de contraste WCAG faz a mesma aritmética, inclusive a deste site.

Só até certo ponto, e é a alavanca errada. O tamanho ajuda o decodificador a resolver os módulos; o contraste é o que deixa ele distinguir um do outro. Um código a 2:1 impresso a 10 cm é um padrão grande e chapado. Mude a cor primeiro e depois dimensione para a distância de leitura.

Por que a KoloQR?

  • Crie QR codes para sites, cardápios, Wi-Fi, PDFs e cartões de visita
  • Personalize cores, logos e formas únicas
  • Baixe arquivos PNG e SVG de alta qualidade
  • Feito tanto para impressão quanto para o digital
Gerar QR code
Um QR code preto simples ao lado do mesmo código redesenhado como um círculo com as cores da marca