• HTML
• CSS

HTML

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<div class="box">
    <div class="imgBx">
        <img src="image.jpg">
    </div>
    <ul class="social-icon">
        <li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
        <li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
        <li><a href="#"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
        <li><a href="#"><i class="fa fa-linkedin" aria-hidden="true"></i></a></li>
        <li><a href="#"><i class="fa fa-instagram" aria-hidden="true"></i></a></li>
    </ul>
    <div class="details">
        <h2>Someone Famous<br><span>UX/UI Designer</span></h2>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
            tempor incididunt ut labore et dolore magna aliqua.
        </p>    
    </div>
</div>

CSS

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}
body
{
    display:flex;
    justify-content:center;
    align-items:center;
    min-height:100vh;
    font-family:sans-serif;
    background:#fadbd8;
}
.box{
    width:250px;
    background:#fff;
    box-shadow:1px 1px 10px rgba(0,0,0,0.2);
}
.box .imgBx img{
    width:100%;
    height:250px;
    display:block;
}

.box .social-icon{
    display:flex;
    list-style:none;
    transition:0.5s;
    height:0;
    overflow:hidden;
}
.box:hover .social-icon{
    height:35px;
}
.box .social-icon li{
    width:100%;
    text-align:center;
    background:#fff;
    color:#262626;
}
.box .social-icon li a{
    color:#262626;
    padding:8px;
    border-left:1px solid #eee;
    display:block;
}
.box .social-icon li a .fa{
    transition:0.5s;
}
.box .social-icon li a:hover .fa{
    transform:rotateY(360deg);
}
.box .details{
    background:#fff;
    border-top:1px solid #eee;
    text-align:center;
}
.box .details h2{
    margin:10px 0 0;
    padding:0;
    font-size:20px;
}
.box .details h2 span{
    color:#bbb;
    font-size:14px;
}
.box .details p{
    padding:8px 8px 14px 8px;
}