JSFiddle - React, Tailwind, and code Playground

HTML

<div class="avatars">
    <div class="avatars_i">
        <img class="avatars_img" src="http://autokadabra.ru/system/uploads/users/1/1938/small.png?1318258804">
    </div>
    <div class="avatars_i">
        <img class="avatars_img" src="http://autokadabra.ru/system/uploads/users/18/18340/small.png?1318432918">
    </div>
    <div class="avatars_i">
        <img class="avatars_img" src="http://autokadabra.ru/system/uploads/users/20/20303/small.png?1319912650">
    </div>
    <div class="avatars_i">
        <img class="avatars_img" src="http://autokadabra.ru/system/uploads/users/19/19506/small.png?1318360757">
    </div>
</div>

<div class="avatars avatars__big">
    <div class="avatars_i">
        <img class="avatars_img" src="http://autokadabra.ru/system/uploads/users/1/1938/small.png?1318258804">
    </div>
    <div class="avatars_i">
        <img class="avatars_img" src="http://autokadabra.ru/system/uploads/users/18/18340/small.png?1318432918">
    </div>
    <div class="avatars_i">
        <img class="avatars_img" src="http://autokadabra.ru/system/uploads/users/20/20303/small.png?1319912650">
    </div>
    <div class="avatars_i">
        <img class="avatars_img" src="http://autokadabra.ru/system/uploads/users/19/19506/small.png?1318360757">
    </div>
</div>

CSS

.avatars_i {
    overflow: hidden;
    position: relative;
    float: left;
    margin: 1px;
    padding: 9px;
    background-color:red;
    }

    .avatars_i:after {
        content: "";
        position: absolute;
        z-index: 1;
        top: 4px;
        left: 4px;
        right: 4px;
        bottom: 4px;
        
        -webkit-border-radius: 50em;
        -moz-border-radius: 50em;
        border-radius: 50em; 
    
        -webkit-box-shadow:
            inset 0 0 0 5px #fff,  
            0 0 0 1px #999,        
            0px 1px 1px 2px #bbb,  
            0 0 0 100px #fff;      
        box-shadow:
            inset 0 0 0 5px #fff,  /* inner white padding */
            0 0 0 1px #999,        /* border  */
            0px 1px 1px 2px #bbb,  /* outer shadow */
            0 0 0 100px #fff;      /* cropping image white shadow */
        pointer-events: none;
        }

    .avatars_i .avatars_img {
        display: block;
        }

.avatars__big .avatars_img {
    width: 100px;
    }