CSS to create overlapping profile images

Community Resources
21

image
image1746×1250 182 KB

I don’t have the right hex codes for the border here, it seems like this code is old and I can’t derive it from the site itself but you can use some trial and errors to figure out all the colors.

<pre><span><style>

.tile-inner {
padding: 5px 0px;
}

.tile-image-area {
border-radius: 50%;
box-shadow: inset 0px 0px 0px 10px white;
}

.tile-image-area:before {
    content: '';
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    z-index: -1;
    margin: -4px; 
    border-radius: inherit;
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
}
6 Likes