No uso dos recursos de sintaxe do HTML5/CSS3, uma
cor pode ser especificada usando matiz, saturação e
luminosidade no formato HSL, onde matiz é um grau
entre 0 a 360, que define o padrão de cores básicas,
saturação é um valor percentual, finalizando por
luminosidade que também é expressa em porcentagem.
Nesse cenário, observe o código exemplificado a seguir.
<html> <body> <h1> Especificando cores usando padrão HSL</h1> <h2 style="background-color:hsl(0,100%,50%);"> GASOLINA</h2> <h2 style="background-color:hsl(240,100%,50%);"> DIESEL</h2> </body> </html> Na execução desse código em um browser, as palavras GASOLINA e DIESEL serão exibidas com fonte na cor preta, com fundos, respectivamente, nas cores básicas:
Nesse cenário, observe o código exemplificado a seguir.
<html> <body> <h1> Especificando cores usando padrão HSL</h1> <h2 style="background-color:hsl(0,100%,50%);"> GASOLINA</h2> <h2 style="background-color:hsl(240,100%,50%);"> DIESEL</h2> </body> </html> Na execução desse código em um browser, as palavras GASOLINA e DIESEL serão exibidas com fonte na cor preta, com fundos, respectivamente, nas cores básicas: