Faça diferentes itens de galeria de colors de borda

Tenho o seguinte código que funciona bem para colors de borda simples.

.gallery img { box-shadow: 0px 0px 44px #999; border: 70px solid white; border-color:#0d1c49; padding: 10px; width:500px; } 

Mas eu quero fazer colors de borda diferentes de cada item de galeria

Solutions Collecting From Web of "Faça diferentes itens de galeria de colors de borda"

no caso de você usar SASS: você pode usar este trecho e mudar de acordo

 $colors: red, orange, yellow, green, blue, purple; $repeat: 20 // How often you want the pattern to repeat. // Warning: a higher number outputs more CSS. @for $i from 1 through $repeat { .gallery img:nth-child(#{length($colors)}n+#{$i}) { border-color: lighten(nth($colors, random(length($colors))), 20%); } } .gallery img { list-style: none; padding: 1em; } 

se você não pode trabalhar com o SASS do que deve usar uma solução javascript / jquery para conseguir isso. Posteei um trecho que gera valores de colors aleatórias. agora você só precisa encontrar uma lógica para obter as colors para os itens apropriados.

 var color = "#" + Math.floor(Math.random() * 0xFFFFFF).toString(16); 

Se precisar de mais ajuda, publique mais algum código