Yume Nikki - Madotsuki Icon!

Tags: #yumenikki, #madotsuki

Description:

Please comment if you are going to use it

Preview:

Code:

<!-- (c) Layout created by 𝘚𝘢𝘭𝘭𝘺𝘤𝘪𝘵𝘢 𝘍𝘢𝘤𝘦 (https://layouts.spacehey.com/layout?id=103454) --> <style> /* replace with cd image that has transparent background. must be 150px by 150px. */ :root { ---image: url(''); } .profile-pic { position: relative; width: 160px; filter: drop-shadow(0 0 0.25rem gray); } .profile-pic:after { content: ""; background: url('https://cdn271.picsart.com/ed54f591-6650-41e9-a228-258d44d857e4/450570482020211.png?to=crop&type=webp&r=1456x1456&q=85'), linear-gradient(150deg, rgba(255,255,255,0.4), rgba(255,255,255,0.2), 40%, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.6)); background-size: contain, cover; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .profile-pic:before { content: ""; background: var(--cd-image); position: absolute; top: 5px; left: -20px; width: 150px; height: 150px; background-repeat: no-repeat; z-index: -1; animation-name: spin; animation-duration: 5000ms; animation-iteration-count: infinite; animation-timing-function: linear; transition: left ease 0.5s; } .profile-pic:hover:before { left: -75px; } @keyframes spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } } .profile-pic .pfp-fallback { float: right; width: 160px; height: 160px; border: none; } .general-about .profile-pic img { max-width: inherit; } </style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.