Bibliotecas de cores W3.CSS
Bibliotecas de cores
Bibliotecas de cores são pequenos arquivos CSS que contêm valores de cores comumente usados, como padrões de segurança, cores de rodovias, cores de moda, cores de camuflagem e muito mais.
Ônibus escolar
Falcon Ridge Parkway
PARE
Como usar bibliotecas de cores
As bibliotecas de cores são fáceis de usar. Basta adicionar um link para a biblioteca de cores em sua página da web:
<link rel="stylesheet"
href="https://www.w3schools.com/lib/w3-colors-highway.css">
Em seguida, adicione um nome de classe ao elemento HTML que deseja colorir:
<div class="w3-highway-schoolbus">Schoolbus</div>
<div
class="w3-highway-green">Falcon Ridge Parkway</div>
<div
class="w3-highway-red">STOP</div>
Cores das rodovias dos EUA
w3-estrada-marrom |
w3-rodovia-vermelho |
w3-estrada-laranja |
w3-highway-schoolbus |
w3-estrada-amarelo |
w3-estrada-verde |
w3-estrada-azul |
As cores das rodovias são definidas no Federal Standard 595 .
Cores de segurança dos EUA
w3-segurança-vermelho |
w3-segurança-laranja |
w3-amarelo de segurança |
w3-segurança-verde |
w3-azul de segurança |
w3-segurança-roxo |
As cores de segurança dos EUA são definidas no Padrão Federal 595 .
Cores do Sinal Europeu
w3-sinal-amarelo |
w3-sinal-laranja |
w3-sinal-vermelho |
w3-sinal-violeta |
w3-sinal-azul |
w3-sinal-verde |
w3-sinal-cinza |
w3-sinal-marrom |
w3-sinal-branco |
w3-sinal-preto |
Exemplo
<div class="w3-signal-red">Stop</div>
<div
class="w3-signal-yellow">Wait</div>
<div class="w3-signal-green">Go</div>
Baixe o CSS »
As cores do sinal europeu são definidas no RAL Color Standard .
Cores vivas
w3-rosa-vivo |
w3-vivo-vermelho |
w3-vivo-laranja |
w3-vivo-amarelo |
w3-vivo-verde |
w3-vivo-azul |
w3-vivo-violeta |
w3-vivo-roxo |
w3-vivo-preto |
w3-vivo-branco |
w3-vivo-amarelo-rosa |
w3-vivo-laranja-avermelhado |
w3-vivo-laranja-amarelo |
w3-vivo-amarelo-esverdeado |
w3-vivo-amarelo-verde |
w3-vivo-amarelo-verde |
w3-vivo-azulado-verde |
w3-vivo-esverdeado-azul |
w3-vivo-roxo-azul |
w3-vivo-roxo-avermelhado |
w3-vivo-roxo-vermelho |
Exemplo
<div class="w3-vivid-red">
<p>London is the most populous city in the
United Kingdom,
with a metropolitan area of over 9 million
inhabitants.</p>
</div>
Baixe o CSS »
As cores vivas são definidas em ISCC-NBS .
Cores de alimentos
w3-comida-maçã |
w3-alimento-aspargos |
w3-alimento-damasco |
w3-alimento-beringela |
w3-alimento-abacate |
w3-comida-banana |
w3-food-manteiga |
w3-alimento-mirtilo |
w3-comida-cereja |
w3-food-chocolate |
w3-alimento-cranberry |
w3-comida-café |
w3-food-ovo |
w3-food-uva |
w3-comida-kiwi |
w3-alimento-limão |
w3-alimento-cal |
w3-food-manga |
w3-comida-cogumelo |
w3-alimento-mostarda |
w3-food-hortelã |
w3-food-olive |
w3-alimento-laranja |
w3-comida-ervilha |
w3-alimento-pêssego |
w3-food-pera |
w3-food-pistache |
w3-alimento-ameixa |
w3-food-framboesa |
w3-alimento-açafrão |
w3-alimento-salmão |
w3-alimento-hortelã |
w3-alimento-abóbora |
w3-comida-morango |
w3-alimento-tomate |
w3-alimento-trigo |
w3-comida-vinho |
Exemplo
<div class="w3-food-apple">Apple</div>
<div
class="w3-food-banana">Banana</div>
Baixe o CSS »
Cores de camuflagem
w3-camo-marrom |
w3-camo-vermelho |
w3-camo-azeitona |
w3-campo de camuflagem |
w3-camo-terra |
w3-camo-areia |
w3-camo-tan |
w3-camo-arenito |
w3-camo-verde-escuro |
w3-camo-floresta |
w3-camo-verde-claro |
w3-camo-verde |
w3-camo-cinza-escuro |
w3-camo-cinza |
w3-camo-preto |
Exemplo
<div class="w3-camo-earth">Camouflaged Truck</div>
<div
class="w3-camo-grey">Camouflaged Ship</div>
Baixe o CSS »
As cores da camuflagem são definidas no Federal Standard 595 .