Como Funcionam as Cores em Hexadecimal

Em algumas situações você precisa configurar uma cor personalizada para algo que você esteja fazendo, como configurar o esquema de cores no SysLinux, nos emuladores de terminal RXVT ou XTerm, e até mesmo em alguns projetos que usam o código hexadecimal para configurar as cores. Por isso é preciso entender como as cores são configuradas nesse padrão.

[ Hits: 12.249 ]

Por: Mauricio Ferrari em 13/11/2020 | Blog: https://www.youtube.com/@LinuxDicasPro


Introdução



Em muitas áreas de aplicação nós precisamos trabalhar com cores, como configurar a cor de um site ou editar uma imagem com o Photoshop ou o Gimp. Geralmente essas cores são representadas por um código de 6 caracteres hexadecimais (de 0 a F) precedido do caractere "#", por exemplo: '#68B46D'. Até mesmo em certas configurações de cor em no sistema, principalmente em distribuições Linux, em alguma configuração distinta.

De fato, muitos usuários já devem ter se deparado com um código de cores configurado de uma forma perecida com #FF000000 ou #F5F5F5. O primeiro exemplo é configurado usando 8 espaços hexadecimais e forma o preto, o segundo usa seis espaços hexadecimais e forma uma tonalidade de cinza. Os dois estão corretos. Inclusive funcionam de uma forma semelhante. Beleza, mas como saber quais são os códigos para formar um vermelho, azul, roxo, verde, amarelo, laranja, marrom etc? Para entender o funcionamento das cores em hexadecimal, é necessário entender como é feita a composição das cores pelo computador e qual foi a base para realizar essa composição no computador.

Para começar, sabe-se que na computação o sistema atual de cores utilizado pelo sistema é o padrão RGB. Para imprimir as cores utilizadas segue-se outro padrão, o CMYK, que tem relação direta com o RGB, e para formar as cores para implementar em um projeto, utiliza-se o código RGB. O padrão RGB foi criado com base em como nossos olhos enxergam o mundo e como funcionam a formação das cores no mundo.

Para entender o esquema de cores hexadecimal, é necessário entender a formação das cores em RGB e também como esse padrão surgiu, assim é possível ter uma melhor compreensão de como as coisas funcionam ao nosso redor.

Para começar com o assunto a seguir, será abordado como nossos olhos enxergam as cores, como é possível a formação das cores, como eram classificadas as cores e como elas são classificadas hoje. Será abordado também como funcionam o código RGB e como o código de cores RGB está relacionado ao código de cores hexadecimal. E por fim, será explicado a diferença entre o padrão de seis espaços hexadecimais com o de oito espaços hexadecimais, bem como os exemplos de aplicações.

    Próxima página

Páginas do artigo
   1. Introdução
   2. Formação das cores na natureza
   3. O código hexadecimal
   4. Conclusão
Outros artigos deste autor

Abrindo aplicações Java de uma vez por todas

Pendrive MultiBoot com o Ventoy Não Funcionou? Tem Solução!

Convertendo os Arquivos de Temas do Windows (.themepack) em Pacotes de Wallpapers Úteis para o Linux

Compilando um Kernel customizado a partir do código-fonte do Kernel do Debian 12

Gerando Pacote do QMPlay2 20.12.16 no Slackware Current Facilmente

Leitura recomendada

Sou advogado e consegui instalar Certificado Digital para PJe

Instalação Kickstart (revisado)

KDE em um PC "primitivo"

Suporte multimídia e dicas de uso comum para o Ubuntu 11.04

AntiX: um Sistema Operacional para computadores antigos

  
Comentários
[1] Comentário enviado por fabio em 13/11/2020 - 14:46h

Quando li o título do artigo não me animei muito, mas depois que comecei a leitura, me surpreendeu. Muita informação boa, muita coisa que eu nem sonhava em saber. Parabéns!

[2] Comentário enviado por maurixnovatrento em 13/11/2020 - 21:57h


[1] Comentário enviado por fabio em 13/11/2020 - 14:46h

Quando li o título do artigo não me animei muito, mas depois que comecei a leitura, me surpreendeu. Muita informação boa, muita coisa que eu nem sonhava em saber. Parabéns!


Obrigado.

[3] Comentário enviado por maurixnovatrento em 13/11/2020 - 22:02h


Realmente exigiu um esforço de minha parte. Quando fui pesquisar sobre isso para me ajudar com um arquivo de configuração, percebi que reunindo todas essas informações eu conseguiria criar um bom artigo. Também percebi que é muito difícil encontrar um conteúdo tão completo em relação a esses temas, o que me motivou a construir esse artigo.

___________________________________________________________
[code]Conhecimento não se Leva para o Túmulo.
https://github.com/MauricioFerrari-NovaTrento [/code]

[4] Comentário enviado por cizordj em 13/11/2020 - 23:13h

Essa explicação do CMYK explodiu a minha mente, muito boa!

[5] Comentário enviado por -josinaldo- em 14/11/2020 - 09:02h

Excelente contribuição, muito bom mesmo.
Parabéns.

[6] Comentário enviado por maurixnovatrento em 14/11/2020 - 11:22h


Valeu o apoio pessoal.

___________________________________________________________
[code]Conhecimento não se Leva para o Túmulo.
https://github.com/MauricioFerrari-NovaTrento [/code]

[7] Comentário enviado por msoliver em 15/11/2020 - 20:28h

Muito bom o material, Mauricio.
Tenho algumas poucas ressalvas:
#FF000000 ou #F5F5F5. O primeiro exemplo é configurado usando 8 espaços hexadecimais e forma o preto.
#ff000000, é o vermelho com 0 de saturação, logo, a cor apresentada é a "branca"
#FF000000, é uma cor representada no padrão RGBA, convertida para HEX.
Isso pode ser visto no navegador, pressionando F12, aba Elements.
O CÓDIGO HEXADECIMAL:
O código RGB é representado de 0 a 255.
Isso significa que é possível obter 255 tonalidades de azul, 255 de tonalidades de verde e 255 tonalidades de vermelho (255 e não 256, o zero não conta).
São 256 combinações, de 0 a 255 temos 256: 16×16
hex={0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F}
eval echo $hex$hex|wc -w
256
Assim como no sistema decimal, temos dez combinações, de 0 a 9.
Bem interessante: https://www.w3schools.com/colors/
______________________________________________________________________
Att.: Marcelo Oliver

[8] Comentário enviado por xerxeslins em 16/11/2020 - 08:21h

Que artigo! Favoritado.


--
"There are lots of Linux users who don't care how the kernel works, but only want to use it. That is a tribute to how good Linux is." - Linus Torvalds

[9] Comentário enviado por diegomrodrigues em 16/11/2020 - 08:58h

Belo artigo. Parabéns!

Abraço,
Diego M. Rodrigues

[10] Comentário enviado por maurixnovatrento em 16/11/2020 - 13:31h


[7] Comentário enviado por msoliver em 15/11/2020 - 20:28h

Muito bom o material, Mauricio.
Tenho algumas poucas ressalvas:
#FF000000 ou #F5F5F5. O primeiro exemplo é configurado usando 8 espaços hexadecimais e forma o preto.
#ff000000, é o vermelho com 0 de saturação, logo, a cor apresentada é a "branca"
#FF000000, é uma cor representada no padrão RGBA, convertida para HEX.
Isso pode ser visto no navegador, pressionando F12, aba Elements.
O CÓDIGO HEXADECIMAL:
O código RGB é representado de 0 a 255.
Isso significa que é possível obter 255 tonalidades de azul, 255 de tonalidades de verde e 255 tonalidades de vermelho (255 e não 256, o zero não conta).
São 256 combinações, de 0 a 255 temos 256: 16×16
hex={0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F}
eval echo $hex$hex|wc -w
256
Assim como no sistema decimal, temos dez combinações, de 0 a 9.
Bem interessante: https://www.w3schools.com/colors/
______________________________________________________________________
Att.: Marcelo Oliver



sim são 256 combinações, apenas desconsiderei a cor nula. Eu deveria ter considerado de fato. Vou revisar.

#FF000000 : Eu usava como preto no syslinux, e funcionava, vai entender.

[11] Comentário enviado por maurixnovatrento em 16/11/2020 - 13:36h


[8] Comentário enviado por xerxeslins em 16/11/2020 - 08:21h

Que artigo! Favoritado.


--
"There are lots of Linux users who don't care how the kernel works, but only want to use it. That is a tribute to how good Linux is." - Linus Torvalds



valeu.

[12] Comentário enviado por maurixnovatrento em 16/11/2020 - 13:37h


[9] Comentário enviado por diegomrodrigues em 16/11/2020 - 08:58h

Belo artigo. Parabéns!

Abraço,
Diego M. Rodrigues


valeu.

[13] Comentário enviado por ederlepaus em 17/11/2020 - 10:59h

Muito bom o conteúdo, sou do segmento de impressão e gostaria de entender mais sobre o assunto voltado para Linux, ajudou muito!
Nós da www.ducoprint.com.br, buscamos entender sempre o que é o melhor para o mercado de impressão.

[14] Comentário enviado por ruankennedy em 20/11/2020 - 11:38h

Cara acompanho esse mundo do Linux para criar um servidos para o meu site https://npximports.com.br porém é meio complicado ai uso a plataforma do mercado shops, andei estudando cores mais relevantes em HEX para o meu site porém o Mercado Shops não me permite altera-las. Depois vou pesquisar alguem que faça esse trabalho aqui no grupo.


Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts