Quadrados Coloridos
.container {
display: flex;
gap: 10px;
}
.quadrado {
width: 50px;
height: 50px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
.quadrado::before {
content: attr(data-label);
position: absolute;
color: #fff;
font-size: 10px;
font-weight: bold;
opacity: 0;
transition: opacity 0.3s;
text-align: center;
}
.quadrado:hover::before {
opacity: 0.8;
}
.quadrado.cinza {
background-color: #A5A5A5;
}
.quadrado.amarelo {
background-color: #F4C300;
}
.quadrado.laranja {
background-color: #F44611;
}
.quadrado.azul {
background-color: #017B92;
}
.nota {
margin-top: 20px;
font-size: 12px;
color: #333;
}
.nota ol {
padding-left: 20px;
}
- Reservamos o direito a alterações por motivos técnicos ou comerciais sem aviso prévio.
- As cores aqui apresentadas são meramente representativas e não dispensam a consulta da tabela RAL.