A sombra da caixa herda a cor

Infelizmente, a sombra da caixa deve ser definida como uma regra única, sem a capacidade, como a borda, de ser dividida em partes separadas para posicionamento, cor e distância.

No entanto, existe um truque para permitir que uma única definição de sombra de caixa apareça em várias cores.

A sombra da caixa herda sua cor de um local improvável se nenhum for especificado, o atributo de cor do elemento.

.widget {
-webkit-box-shadow: 0em 0.2em 0em inset;
-moz-box-shadow: 0em 0.2em 0em inset;
box
-shadow: 0em 0.2em 0em inset;
}
/* This will also have a red box shadow */
.red.widget {
color
: #FF0000;
}

Para obter mais dicas de CSS, visite Semantic UI CSS Guide