Layout Preview | FriendRewind

Name: FriendRewind
Author: FriendRewind
FriendRewind
← Back to Layouts
Ok

Author: ♪
Category: Dark
Created: March 4, 2026
Ok
Comments (0)

No comments yet. Be the first!
You must log in to comment.
CSS Code

<style>
<style>

/* replace with cd image that has transparent background. must be 150px by 150px. */

:root {

--cd-image: url('https://fluorescent-lights.neocities.org/Digital-CD-Disk-Vector-Transparent-PNG.png');

}

.profile-pic {

position: relative;

width: 183px;

filter: drop-shadow(0 0 0.25rem gray);

}

.profile-pic:after {

content: "";

background: url('https://fluorescent-lights.neocities.org/f0rzNHe.png'), 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: 163px;

height: 160px;

border: none;

}

.general-about .profile-pic img {

max-width: inherit;

}

</style>

<style>* {cursor: url(https://cur.cursors-4u.net/holidays/hol-4/hol335.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2009/10/14/thick-skeleton-skull.html" target="_blank" title="Thick Skeleton Skull"><img src="https://cur.cursors-4u.net/cursor.png" alt="Thick Skeleton Skull" style="position:absolute; top: 0px; right: 0px;"/></a>

<style>

.profile .url-info p:last-child:after {content: ""; display: block; background-image: url('http://dl.glitter-graphics.net/pub/157/157641b27q8mcaol.gif');  width: auto; height: 90px; background-position: top center; background-size: 50%; background-repeat: no-repeat;}

.profile .url-info p {text-align: center;}

</style>

<p>

</p>

<!--------- DOKIA --------->

<style>

/* the image displayed ! place an url inside the parentheses. */

:root {

    --image: url(https://i.postimg.cc/jL8xPc1v/ok.jpg);

}

/* wall of code itself ! */

#dokia a:hover{background:transparent!important;}#dokia *{text-shadow:none;}#dokia #keyboard p{margin:0px!important;}#front:after,#front:before{width:7px;background:#2b2442;top:-3px;outline:black solid 2px;content:"";display:block}#front,#topscreen{width:calc(100% - 10px)}#keyboard,.openphone{z-index:999;position:absolute}#keyboard,.openopen:not(:target){visibility:hidden}#keyboard,#topscreen{background:linear-gradient(30deg,var(--dokiasteel) 40%,var(--dokiablue) 200%);outline:2px solid var(--dokiablue);transform:perspective(300px) rotateX(10deg) scale(.95);box-shadow:2px 3px 5px 3px #000}#front .labelidk:before,.screenframe:before{height:20px;background:url(data:image/png;base64,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) center/contain no-repeat}:root{--dokiablue:#040011;--dokiasteel:#323238}#dokia{z-index:999999;box-sizing:border-box;width:100px;height:340px;position:fixed;bottom:20px;right:40px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;color:red;gap:10px;border-radius:30px}#dokia *{box-sizing:content-box}#front{height:165px;margin-bottom:2px;background:#fff;border-radius:5px 5px 30px 30px;box-shadow:2px 3px 5px 3px #000,0 40px 20px -2px var(--dokiablue) inset,0 -2px 5px 2px var(--dokiablue) inset;outline:2px solid var(--dokiablue);border:3px solid #fff;position:relative;transform:perspective(300px) rotateX(10deg) scale(.95);transform-origin:top center;visibility:visible}#front:before{height:20px;position:absolute;left:-3px;border:2px solid #fff;border-bottom:1px solid #fff;border-radius:5px 0 0 2px;box-shadow:0 12px 6px -4px #fff inset,2px 3px 0 0 #fff}#front:after{height:20px;position:absolute;right:-3px;border:2px solid #fff;border-bottom:1px solid #fff;border-radius:0 5px 2px 0;box-shadow:0 12px 6px -4px #fff inset,-2px 3px 0 0 #fff}#front .labelidk{height:82%;width:82%;margin:auto;border-radius:0 0 30px 30px;border:1px solid #fff;border-top:5px solid var(--dokiablue);box-shadow:0 10px 5px -5px rgba(255,255,255,.522) inset;background:var(--dokiablue);position:relative;top:-6px;z-index:2}#front .labelidk:after,#front .labelidk:before,#topscreen:before{position:absolute;left:0;right:0}#front .labelidk:before{content:"";display:block;top:0;bottom:50px;margin:auto;width:44px}#front .labelidk:after,.screenframe:before{width:45px;display:block;content:"";margin:auto}#front .labelidk:after{top:0;bottom:20px;height:4px;background:#cb0c2d;border-radius:5px;border:1px inset #a9a9a9;box-shadow:-1px 1px 2px var(--dokiablue) inset}#topscreen{height:150px;border-radius:30px 30px 5px 5px;border-top:2px solid gray;border-right:1px solid gray;border-bottom:2px solid #1f1f23;border-left:1px solid #1f1f23;position:relative;transform-origin:top center;z-index:99999}#topscreen:before{content:"_";top:10px;margin:auto;color:transparent;text-shadow:0 -3px 0 #000;font-family:arial;white-space:nowrap;font-size:10px;text-align:left;text-indent:13px;line-height:0;background:#fff;border-radius:5px;display:block;width:20px;height:3px;border:2px solid gray;box-shadow:0 3px 2px #d3d3d3 inset;outline:white solid 1px}.openopen:target{visibility:visible}:has(:target:is(#topscreen)) #front{visibility:hidden}:has(:target:is(#topscreen)) #keyboard{visibility:visible}#antenna{width:13px;height:48px;background:var(--dokiasteel);position:absolute!important;bottom:172px;right:12px;border-radius:5px 5px 0;box-shadow:2px 3px 5px 3px #000,0 -10px 10px -10px #fff inset,0 10px 10px -6px #fff inset,0 20px 20px 0 var(--dokiablue) inset;outline:2px solid var(--dokiablue);border:2px solid var(--dokiasteel);transform:perspective(150px) rotateX(40deg);z-index:-1}.openphone{display:block;height:103%;background:0 0;width:106%;top:-6px;right:-3px;margin:0;padding:0;text-decoration:none;border-radius:0 0 30px 30px}#keyboard{height:165px;margin-bottom:4px;width:calc(100% - 8px);border-radius:5px 5px 30px 30px;border:2px solid #1f1f23;transform-origin:top center}.screenframe{width:88%;height:80%;background:var(--dokiablue);margin:30px auto;border-radius:20px 20px 15px 15px;box-shadow:3px 0 15px -5px #4e4e5a inset;border-inline:1px inset var(--dokiasteel)}.screenframe:before{padding-top:10px;text-align:center}.screenframe p{background:#000;box-shadow:2px -2px 10px rgba(255,255,255,.8) inset;width:63px;height:68px;border:1px outset gray;margin:auto!important;padding:2px;border-radius:5px}.screenframe img{width:100%!important;height:100%!important;object-fit:cover;border-radius:2px;position:relative}.screenframe img::before{content:"";position:absolute;top:0;left:0;bottom:0;right:0;height:100%;width:100%;background:url(https://images2.imgbox.com/90/69/pI2sVOjT_o.png) center center/contain no-repeat #fff}.screenframe:after{display:block;position:relative;content:"";width:92%;margin:auto;height:10px;background:var(--dokiasteel);bottom:-5px;border-radius:8px 8px 0 0;border-bottom:solid var(--dokiablue) 8px;outline:black solid 1px}.divisorsor:after,.divisorsor:before{content:"";width:10px;height:20px;background:#2b2442;top:-3px;border-bottom:1px solid #000;position:absolute;outline:black solid 1px;display:block}.divisorsor{width:100%;height:5px;border-bottom:solid var(--dokiablue) 12px}.divisorsor:before{left:-3px;border:1px solid #000;border-radius:5px 0 0 2px;box-shadow:0 12px 6px -4px #fff inset,1px 6px 0 0 var(--dokiablue)}.divisorsor:after{right:-3px;border:1px solid #000;border-radius:0 5px 2px 0;box-shadow:0 12px 6px -4px #fff inset,-1px 6px 0 0 var(--dokiablue)}#dokia .screenframe img{content:var(--image)}.sillyring{height:32px;width:44px;background:linear-gradient(40deg,#fff 0,#282828 40%,#fff 60%,#fff 100%);outline:black solid 1px;border:1px solid #fff;border-radius:20px;margin:33px auto;padding:6px;position:absolute;inset:0}.sillyring div{width:95%;height:calc(95% - 8px);border-top:1px solid #fff;background:linear-gradient(30deg,var(--dokiablue) 50%,#fff 120%);border-radius:14px;padding-top:10px}.sillyring div span{display:block;width:calc(60% - 10px);height:50%;margin:auto;background:silver;border-radius:4px;outline:gray solid 3px;box-shadow:-1px 1px 1px 1px #000 inset,0 0 0 3.5px #fff}.decoratione{width:105%;max-width:105%!important;height:30px;background:0 0;position:absolute;margin-top:9px;left:-2px;border-top:1px solid var(--dokiablue);border-bottom:2px solid var(--dokiablue);text-align:center;white-space:nowrap;word-spacing:35px;font-size:26px!important;font-weight:700;color:#599399}.decoratione p:last-child:first-letter{color:#1d6145}.decoratione p{text-shadow:none!important;position:relative;margin:0!important;line-height:30px;font-family:arial;font-size:26px!important}.decoratione p:last-child{line-height:30px;color:#893728}.decoratione p:last-child:after{content:".";font-size:15px;position:absolute;right:10px;bottom:2px}.decoratione p:last-child:before{content:"O";font-size:7px;position:absolute;right:6px;bottom:7px}.rowrowro{width:90%;margin:auto auto 3px;height:11px;background:#fff;display:flex;padding:1px;padding-inline:2px;border-radius:5px 5px 10px 10px;outline:black solid 1px}.rowrowro#thefirsty{margin-top:70px;padding-top:2px}.rowrowro p{width:20px;background:var(--dokiasteel);display:inline-block;flex:1;margin:0!important;text-align:center;color:#fff;font-family:Calibri;font-size:8px!important;line-height:6px;box-shadow:0 1px 2px #000 inset}.rowrowro:nth-child(4) p:first-child:after{content:" o_o";color:#fff;font-size:5px;letter-spacing:-1px;margin-left:3px}.rowrowro:nth-child(4) p:nth-child(2):after{content:" abc";color:#fff;font-size:5px;margin-left:3px}.rowrowro:nth-child(4) p:last-child:before{content:"def ";color:#fff;font-size:5px;margin-right:3px}.rowrowro:nth-child(5) p:first-child:after{content:" ghi";color:#fff;font-size:5px;margin-left:3px}.rowrowro:nth-child(5) p:nth-child(2):after{content:" jkl";color:#fff;font-size:5px;margin-left:3px}.rowrowro:nth-child(5) p:last-child:before{content:"mno ";color:#fff;font-size:5px;margin-right:3px}.rowrowro:nth-child(6) p:first-child:after{content:"pqrs";color:#fff;font-size:5px}.rowrowro:nth-child(6) p:nth-child(2):after{content:" tuv";color:#fff;font-size:5px;margin-left:3px}.rowrowro:nth-child(6) p:last-child:before{content:"wxyz ";color:#fff;font-size:5px;margin-right:2px}.rowrowro:nth-child(7) p:first-child:after{content:" +";color:#fff;font-size:5px;margin-left:1px}.rowrowro:nth-child(7) p:nth-child(2):after{display:inline-block;content:"⏘";color:#fff;font-size:5px;margin-left:3px;transform:translateY(1px)}.rowrowro:nth-child(7) p:last-child:before{content:"⌂ ";color:#fff;font-size:4px;margin-right:3px}.rowrowro p:nth-child(2){border-radius:0;border:1px solid var(--dokiablue);border-block:2px solid var(--dokiablue)}.rowrowro p:first-child{border-radius:5px 0 0 10px;border:2px solid var(--dokiablue);border-right:0px solid var(--dokiablue)}.rowrowro p:last-child{border-radius:0 5px 10px 0;border:2px solid var(--dokiablue);border-left:0 solid var(--dokiablue)}#keyboard:after{content:"ˊˋ";display:block;color:var(--dokiasteel);text-align:left;width:100%;margin-top:-27px;font-family:Arial;font-size:35px!important;transform:scale(-1) translateX(6px);letter-spacing:55px;text-shadow:0 0 1px var(--dokiablue),0 0 1px var(--dokiablue),0 0 1px var(--dokiablue),0 0 1px var(--dokiablue),0 0 1px var(--dokiablue),0 0 1px var(--dokiablue),0 0 1px var(--dokiablue)}</style><div id="dokia"><div class="openopen" id="topscreen"><a class="openphone" href="#front"></a><div class="screenframe"><p><img src=""/></p></div></div><div id="keyboard"><div class="divisorsor"></div><a class="openphone" href="#front"></a><div class="decoratione"><p>◜ ◝</p><p>◟ ◞</p></div><div class="rowrowro" id="thefirsty"><p>1</p><p>2</p><p>3</p></div><div class="rowrowro"><p>4</p><p>5</p><p>6</p></div><div class="rowrowro"><p>7</p><p>8</p><p>9</p></div><div class="rowrowro"><p>*</p><p>0</p><p>#</p></div><div class="sillyring"><div><span></span></div></div></div><div class="openopen" id="front"><a class="openphone" href="#topscreen"></a><div class="labelidk"></div></div><div id="antenna"></div></div>

<!--------- DOKIA end --------->

<iframe width="0" height="0" src="https://www.youtube.com/embed/[LCaNDUcqHlQ]?loop=1&autoplay=1&controls=0&start=0&playlist=[PLACE ID HERE]&”title=" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="””">

</iframe>

<style>

}

/*these are ur color settings*/

:root {

  --text: white;

  --links: rgb(48, 25, 52);

  --shift: rgb(48, 25, 52);

  --borders: rgba(48, 25, 52);

  --background: white;

  --shadow: rgb(48, 25, 52)

}</style>

<style>

@

@import url('https://fonts.googleapis.com/css2?family=Ballet:opsz@16..72&display=swap');

.profile h1 { font-family: 'Ballet'; text-align: center; font-size: xx-large; color: white; text-shadow: 2px 2px black; }

body{

background: url(https://i.postimg.cc/JhPpyz31/9374ba1f1ad5842d5ffa46bc2dd01787.jpg) no-repeat fixed;

background-size: cover;

text-transform: lowercase;

}

nav .top{

margin-top: 10px;

background: url(https://i.postimg.cc/4x88y3Qn/134ef31a60309f9d4196aa787ce35962.jpg);

background-size: cover;

    background-position-y: center;

border: 1px solid white;

border-radius: 5px;

box-shadow: 0 0 8px white;

}

nav .top .left .logo {

    width: 165px;

    height: 42px;

    filter: drop-shadow(2px 4px 6px black);

}

button, input {

    overflow: visible;

    background: white;

    color: black;

    border: none;

    box-shadow: 0 0 5px white;

    border-radius: 5px;

}

nav .links {

    background-color: transparent;

    padding: 3.5px 16px;

    text-align: center;

    margin-top: 10px!important;

    margin-bottom: 10px!important;

}

nav .links a {

    text-decoration: none;

    color: white;

    text-shadow: 0 0 2px #000000, 0 0 2px #000000, 0 0 2px #000000, 0 0 2px #000000, 0 0 2px #000000, 0 0 2px #000000;

    font-size: max(0.98em, 12px);

}

nav .links .special a {

    color:#6da5ac;

}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {

    content: " | ";

    color: white;

}

main{

background: url(https://i.postimg.cc/T1z6Z9p8/080c1562343e3ff7816757f265d67d02.jpg);

    border: 1px solid white;

    box-shadow: 0 0 10px white;

    border-radius: 8px;

    color: white;

    text-shadow: 1px 1px black;

}

footer {

    text-align: center;

    font-size: 70%;

    margin: 10px 0 10px;

    padding: 10px 5px;

    background-color: transparent;

    color: white;

}

a {

    color: white;

    text-decoration: none;

}

a:hover, a:active, .blog-entry .kudos-btn:hover, .blog-entry .kudos-btn:active {

    color: #6da5ac;

    text-decoration: none;

    font-style: italic;

}

.comments-table td:first-child, .music-table td:first-child {

    background: #29282b;

    text-align: center;

    font-weight: bold;

    width: 38%;

}

.comments-table td, .music-table td {

    background: #403f43;

    vertical-align: top;

}

.profile .blurbs .heading, .profile .friends .heading {

    background: white;

    color: black;

    border-radius: 8px;

    padding: 2px 7px;

    box-shadow: 0 0 10px white, 0 0 5px white;

}

.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {

    width: 100%;

    border: none;</style>