Want this ?
NOTES:
ANY WRITING LIKE THIS / *BLANK* / EXPLAINS WHAT THE CODE IS FOR
ALL ADD-ONS ARE ANIMATED GIFS
BORDER & PFP INCLUDED & CAN BE REMOVED/CHANGED
TO REMOVE BORDER DELETE ( border: double ; border-radius: 10px;) IT'S FOUND AFTER THE PFP'S URL
TEARDROP GIF
<style>
.general-about{
position: relative;
margin-top: 15px;
}
.general-about .profile-pic::before{
content: '';
background: url('https://media2.giphy.com/media/gv1RoyU1t7GvwaK69O/giphy.gif?cid=6c09b952xnt5511mgtlfhe1j8cb0jlvnfkul5eimr3kxjj0x&ep=v1_stickers_search&rid=giphy.gif&ct=s') no-repeat; /* TEAR DROP GIF */
background-size: cover;
display: block;
width: 30px;
height: 35px;
z-index: 99;
position: absolute;
top: 70px; /* MOVE GIF ^ & v */
left: 19px; /* MOVE GIF R & L */
rotate: 7deg; /* ROTATE GIF */
</style>
<style>
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url("https://i.pinimg.com/736x/35/fa/55/35fa55157fe2de11f9d505c23d9b5d2e.jpg"); display: inline-block; border: double ; border-radius: 10px ; content:"" } /* CHANGE URL 2 PFP U WANT */
.blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; } /* blogs, bulletins */
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; } /* PROFILE */
</style>
CIG GIF
<style>
.general-about{
position: relative;
margin-top: 15px;
}
.general-about .profile-pic::before{
content: '';
background: url('https://media2.giphy.com/media/xT0xeoWXk2oHyatPZS/200w.gif?cid=6c09b952q0ngjgexrzdub4civ4dk4l0z61vdz6mmwcw73dnh&ep=v1_stickers_search&rid=200w.gif&ct=s') no-repeat; /* CIG GIF */
background-size: cover;
display: block;
width: 60px;
height: 60px; /* SIZE GIF */
z-index: 99;
position: absolute;
top: 57px; /* MOVE GIF ^ & v */
left: 15px; /* MOVE GIF R & L */
rotate: -10deg; /* ROTATE GIF */
</style>
<style>
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url("https://i.pinimg.com/736x/3a/ee/18/3aee1846e0039a3dc89d6d0cd2c288e7.jpg"); display: inline-block; border: double ; border-radius: 10px ; content:"" } /* CHANGE URL 2 PFP U WANT */
.blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; } /* blogs, bulletins */
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; } /* PROFILE */
</style>
GLASSES GIF
<style>
.general-about{
position: relative;
margin-top: 15px;
}
.general-about .profile-pic::before{
content: '';
background: url('https://media0.giphy.com/media/LOujFRz0ynuMaNeNn2/giphy.gif?cid=6c09b952tx744nm0wupvemszpzvziqoj681yg0us7ciyejxa&ep=v1_internal_gif_by_id&rid=giphy.gif&ct=s') no-repeat; /* GLASSES GIF */
background-size: cover;
display: block;
width: 116px;
height: 100px; /* SIZE GIF */
z-index: 99;
position: absolute;
top: 20px; /* MOVE GIF ^ & v */
left:24px; /* MOVE GIF R & L */
rotate: -2deg; /* ROTATE GIF */
</style>
<style>
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url("https://i.pinimg.com/736x/6f/39/aa/6f39aaf1e44acdde17a0525d0d7dc0cf.jpg"); display: inline-block; border: double ; border-radius: 10px ; content:"" } /* CHANGE URL 2 PFP U WANT */
.blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; } /* blogs, bulletins */
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; } /* PROFILE */
</style>
HAT GIF
<style>
.general-about{
position: relative;
margin-top: 15px;
}
.general-about .profile-pic::before{
content: '';
background: url('https://media4.giphy.com/media/Jmfw7RIWM89yh40EAo/giphy.gif?cid=6c09b952ax9dbnlq95wyt141gj3907mi9zhvcrb4ihp2orxr&ep=v1_internal_gif_by_id&rid=giphy.gif&ct=s') no-repeat; /* HAT GIF */
background-size: cover;
display: block;
width: 109px;
height: 95px; /* SIZE GIF */
z-index: 99;
position: absolute;
top: -60px; /* MOVE GIF ^ & v */
left:89px; /* MOVE GIF R & L */
rotate: 29deg; /* ROTATE GIF */
</style>
<style>
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url("https://i.pinimg.com/736x/f4/cf/ba/f4cfba719f5d4999774ac37b22c06b46.jpg"); display: inline-block; border: double ; border-radius: 10px ; content:"" } /* CHANGE URL 2 PFP U WANT */
.blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; } /* blogs, bulletins */
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; } /* PROFILE */
</style>
BUBBLEGUM GIF
<style>
.general-about{
position: relative;
margin-top: 15px;
}
.general-about .profile-pic::before{
content: '';
background: url('https://media0.giphy.com/media/2YoRN8dIxQ579zHQaP/200w.gif?cid=6c09b9525uy41ohlrrgeyxgva7icfglxxeuj6eqal0i8q1xg&ep=v1_stickers_search&rid=200w.gif&ct=s') no-repeat; /* BBG GIF */
background-size: cover;
display: block;
width: 54px; /* SIZE GIF */
height: 60px; /* SIZE GIF */
z-index: 99;
position: absolute;
top: 58px; /* MOVE GIF ^ & v */
left:60px; /* MOVE GIF R & L */
rotate: 0deg; /* ROTATE GIF */
</style>
<style>
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url("https://i.pinimg.com/474x/24/63/4e/24634e34e33a6fad98940c2537df1e66.jpg"); display: inline-block; border: double ; border-radius: 10px ; content:"" } /* CHANGE URL 2 PFP U WANT */
.blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; } /* blogs, bulletins */
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; } /* PROFILE */
</style>
do leave Kudos if you end up using any of these !! Comments are also appreciated ^^
Comments
Displaying 0 of 0 comments ( View all | Add Comment )