layout for fritz

Tags: scene, rainbow, gif, music, animation, pink, blue, glitter, cute

Description:

has animations and autoplaying music!

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by ✭ Fren-z ✭ (https://layouts.spacehey.com/layout?id=28547) -->

<img src="https://i9.glitter-graphics.org/pub/1550/1550209pb7qlemgs8.gif"/>

<p>TEXT HERE</p><p></p>

<img src="https://i9.glitter-graphics.org/pub/410/410669c9hihbcsr5.gif" width="140px"/>
<img src="https://blinkies.neocities.org/b/geocities/web.archive.org---web---20090902141244---http:------www.geocities.com---lilpipkinbunny---blinkie_cutenessahead.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/s9Z_SP-yIt58Y-vlA6jpB7ek4MmjSwh5HXU3_slxJHCs=/https://i.ibb.co/3C1nWv5/SBO0SIQ.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/spU9gN7E3Hwe-zdTzq33JVXpRObSd08i05DlGtJ636YE=/https://i.ibb.co/4Y719Q7/dood.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/s33K9gGOtoQ7I_stwy8m0UhKCNTcgSSGbf05iN-hhHZM=/https://i.imgur.com/oQBpTBO.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/siDeROw_H2kPVeYEBeMokGmwWgfgzKlDlphzlu1bh94M=/https://i.imgur.com/mPGFO1Q.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/s1H8sK0jeso9HOGR2NlEokPm8F24_AICJYb3MqHI70Cs=/https://i.ibb.co/m8yYygL/ur-lovely.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/sN22sqEbcNcK0oJoktt9PHrxdc-iUcx2Qktj_WdHpuMU=/http://dl.glitter-graphics.net/pub/892/892701w3ywmqn4c6.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/srU4uhiCvxpMwmuUz6iRVV3dTp-gs6v-tRt0GNlIuMF4=/https://graphic.neocities.org/180793o6w0geqbip.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/sBYCnTNE8CNvF5N6PG9Vke-wltOTuS4hK3viimJm7wxQ=/https://plasticdino.neocities.org/blinkie/tumblr_88f976b66205eb6ca68332b1c159ae73_b18d1d7b_250.gif" width="140px"/>
<img src="https://external-media.spacehey.net/media/she61iFjV7tTOEM6_PzNeD-Su2ko_bW_uMYS9mY-3lC8=/https://64.media.tumblr.com/d4b076d00f052cecd194241310fd532d/d642e7ecfe976461-79/s250x400/3753c3b3dee76dfb04f3bdbd649e0e7fee961aa9.gifv" width="140px"/>
<img src="https://external-media.spacehey.net/media/sxAqUJ4-8sAQcT6YJgrb9rpqn0wksmPT0ggm-2-VEii0=/https://blinkies.cafe/b/display/0061-pinkcomputer.gif" width="140px"/>

<style>

@font-face {
    font-family: 'doctorpunk';
    src: url('https://dl.dropbox.com/s/ijlejkg0bo4jx8i/doctor%20punk.otf');
}

.profile .blurbs .section p, .profile .friends p, .blog-entry .comments p, .bulletin .comments p, .details-table td p, .details-table td a, .profile .contact a, h4, .edit-link, b, p, a, nav .links a{
text-shadow: 3px 0px 3px black;
}

.details-table td:first-child p{
font-family: 'doctorpunk';
text-shadow: 3px 0px 3px black;
}

.profile-info a {
font-family: 'doctorpunk';
text-shadow: 3px 0px 3px black;
font-size: 20px !important;
}

.general-about .profile-pic img, .profile .friends .person img:not(.icon), .comments-table td:first-child img{
 clip-path: polygon(50% 0%, 67% 29%, 98% 35%, 75% 58%, 79% 91%, 50% 75%, 21% 91%, 25% 58%, 2% 35%, 33% 29%)
}

.profile .friends .person img:not(.icon){
filter: sepia(100%) hue-rotate(280deg) saturate(5);
}

.comments-table td:first-child img{
filter: sepia(100%) hue-rotate(190deg) saturate(5);
}

body{background:url("https://64.media.tumblr.com/c92b182ba5055dde320d356dca2922c9/tumblr_ou0bq0qSqc1vfqyqxo1_540.gif");
}

small {
font-size:100%;
}
 
main {
background-image: url(https://i10.glitter-graphics.org/pub/2446/2446620mi8qnael8t.gif);
border: 3px dashed white;
box-shadow: 0px 0px 10px 6px black;
}

.general-about .profile-pic img {
box-shadow: 0px 0px 10px 0px black;
 }

@keyframes spin{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(-360deg); }
}
.general-about .profile-pic img:hover{
  border-radius: 50%;
  animation: spin 7s infinite linear;
}

b {
font-size: 14px;
}

time.ago {
color: white;
}

.profile .friends .inner b{
color: white;
text-shadow: 3px white;
}

p{
font-size: 16px;
}

.details-table td a {
color: white;
}

.details-table td p {
color: white;
font-size: 14px;
}

.profile .table-section .heading{
background: transparent;
}

.profile .table-section .heading h4{ 
color: transparent;
background: transparent;
}
.profile .table-section .heading:before{ content: url(https://i.ibb.co/LQgMK0R/ezgif-4-6fe0feb9cf.gif); 
}

.profile h1{
color: #2737A3 !important;
font-size: 40px;
font-family: 'doctorpunk';
text-shadow: 3px 0px 3px white;
}

.profile .blurbs .section p, .profile .friends p, .blog-entry .comments p, .bulletin .comments p {
font-size: 14px;
}

.friends p, .friends a {
color: white;
}

.profile .friends .inner{
    text-align: center;
background-image: url("https://i8.glitter-graphics.org/pub/1341/1341838sttmppj2tq.gif");
border: 3px solid white;
box-shadow: 0px 0px 10px 0px black;
background-position: center;
}

.profile .blurbs .section h4 {
text-align: center;
font-size: 18px;
color: white;
border: 3px white;
font-family: 'doctorpunk';
text-shadow: 3px 0px 3px black;
}

.profile-info{
background: transparent;
border: 3px solid white;
box-shadow: 0px 0px 15px 0px black;
}

.profile-info a{
font-size: 14px;
color:white;
}

.profile-info h3{
color:white;
}

.profile .contact .heading h4, .profile .table-section .heading h4, .profile .blurbs .heading h4, .blog-entry .comments .heading h4, .bulletin .comments .heading h4, .home-actions .heading h1, .statistics .heading h4{
display: none;
}

.profile .blurbs .heading, .profile .friends .heading {
color: white;
background-color:transparent;
}

.profile .blurbs .inner{
background: transparent;
box-shadow: 0px 0px 10px 0px black;
border: 3px solid white;
}

.profile .contact .heading, .home-actions .heading {
background-color: transparent;
color: white;
}

.contact .heading h4{
display:none !important;}


.contact .heading{ font-size:20px;}
.contact .heading:before{ content: url(https://i.ibb.co/z43Jm8g/ezgif-4-5aa335f6bc.gif); 
overflow:hidden;
}

p {
  font-family: Arial, sans-serif;
color: white;
   } 

   a {
font-size: 14px;
     color: white; 
   }


a:hover {
     color: black; 
cursor: url(http://www.rw-designer.com/cursor-extern.php?id=145905), auto;

}
    .count {
        color: #FF0F90;
    }

.profile .friends .person p {
color: white;
font-family: 'doctorpunk';
text-shadow: 3px 0px 3px black;
}
.profile .friends .person p:hover {
color: black;  
}

.blog-preview{
text-align: center;
background-image: url(https://i.ibb.co/9VPpzK9/ezgif-4-320010e8de.gif);
color: white;
border: 2px solid white;
box-shadow: 0px 0px 10px 0px black;
}

.contact .heading h4{
font-size:14px;
}

.profile .friends .person img:not(.icon) {
box-shadow: 0px 0px 19px 0px rgba(255,255,255,0.3);
}


.online {
    margin:auto;
    padding-bottom: 5px;
    content: url(https://i.ibb.co/DbVf0GC/ezgif-4-71e5f34414.gif);
}
  
.icon {
        content: url(https://external-media.spacehey.net/media/s0Jc9QpwxYeSKz6RpQDJFYEr9Xox-twHqngIhVsVAn2I=/https://i.imgur.com/lJTxdNc.gif);
        display: inline-block;
        height: 2.0em;
        width: 2.0em;
        margin: 0 .05em 0 .1em;
        vertical-align: -0.3em;
        color: rgba(0,0,0,0);
}

.profile .contact {
  font-family: Arial, sans-serif;
background: transparent;
border: 0px solid transparent;
}

.profile .contact a{
font-size: 12px;
}

.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}


.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
	/* add friend */
	content: url(https://external-media.spacehey.net/media/sOuKg7P590RcchZaJzgTcq-I6CVu8FBcjRaCeKxyRsO0=/https://i.imgur.com/fV7k7d6.gif);
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	/* add 2 fav */
	content: url(https://external-media.spacehey.net/media/sYy_GkImzcF3im4C8kCTcgzBRShqfgsJHpizry7gNLOo=/https://pixelbank.neocities.org/decome/wings/e6b9baf0.gif)
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* chat */
	content: url(https://external-media.spacehey.net/media/sPDhkQEz437hhWE1_ZAh7Rz0OidHDleXS5_ATU8mjUeQ=/https://64.media.tumblr.com/023800edf4afa16d04459a835db16a9d/cc1c5cf08c16da6b-c4/s75x75_c1/47f9e74e82a3ab7ed8b96fc7bd42c12e3224f901.gifv)
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* forward */
	content: url(https://external-media.spacehey.net/media/shDdEV8lwgSq_Hnct6BhzVFcZZHCFxJ-YliIMG1VrO_g=/https://64.media.tumblr.com/968b23ffe618c2642401f9808d69766e/cc1c5cf08c16da6b-e1/s75x75_c1/ec5a4ca138bf780ecae421fc89fa4d54e6f52a76.gifv)
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* instant msg */
	content: url(https://wilardo.crd.co/assets/images/gallery02/4eefe4cf.gif?v=07a8a49e)
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* block */
	content: url(https://wilardo.crd.co/assets/images/gallery20/26998e1e.gif?v=07a8a49e)
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* add 2 group */
	content: url(https://wilardo.crd.co/assets/images/gallery15/7e1b9252.png?v=07a8a49e)
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* report */
	content: url(https://wilardo.crd.co/assets/images/gallery15/86627b4c.gif?v=07a8a49e)
} 

.contact .inner a img {
 font-size: 0;
}
.contact .inner a img:before {
 font-size: 1em;
 display: block
}


.profile .table-section .details-table td {
background: #2737A3;
background-image: center;
border: 3px solid white;
box-shadow: 0px 0px 10px 0px black;
}


.profile .friends .comments-table td {
background: #FF0F90;
border: 2px solid white;
position: center;
}

.profile .friends .comments-table td:first-child p{
font-family: 'doctorpunk';
color: #2737A3 !important;
text-shadow: 3px 0px 3px white;
}

.profile .friends .comments-table td:first-child {
background: url(https://i9.glitter-graphics.org/pub/1126/1126699b1zlvis2kn.gif);
}

.profile .comments-table .inner {
box-shadow: 0px 0px 19px 0px rgba(255,255,255,0.3); 
}

.comment-replies{
border: 3px solid white;
color: white;
}


.general-about .details{
padding: 2px;
background: white;
border: 3px solid white;
background-image: url("https://i8.glitter-graphics.org/pub/1341/1341838sttmppj2tq.gif");
background-size:cover;
box-shadow: 0px 0px 10px 0px black;
font-family: Arial, sans-serif;
}

.general-about .details a{
  font-family: Arial, sans-serif;
color: white !important;
font-size: 14px;
}

nav .links .special a {
color: #FF0F90;
}

nav{ 
color:white;
font-size: 13px !important;
text-transform:none;
text-align: center;
    }

.links{
width=810px;
}

nav .links {
background: #2737A3;
box-shadow: 0px 0px 10px 6px black;
}

nav .links a:hover {
color: black;
}

nav .top{
background: url(https://i10.glitter-graphics.org/pub/827/827714e6q14uyxxl.jpg);
box-shadow: 0px 0px 10px 6px black;
}

nav .top a{
color: white !important;
}

nav .top label{
color: white;
}

  .search-wrapper input[type=text] {
    background: white;
  font-family: Arial, sans-serif;
    border: 3px solid white;
    

  }


.profile .url-info {
border: 0px solid transparent;
color: transparent;
font-size: 0.1px;
box-shadow: 0px 0px 10px 0px black;
}
.profile .table-section {
border: none;
}


nav .links a{
color: white;
  font-family: Arial, sans-serif;
font-size: 14px;
}

table.comments-table {
border: 2px solid black;
background: black;
}


footer p{
color: white;
font-size: 100%;
}

footer a{
color: white;
}

footer {
color: white;
box-shadow: 0px 0px 15px 6px black;
text-decoration: underline;
text-decoration-style: dotted;
background: URL(https://i1.glitter-graphics.org/pub/519/519821po41a2leng.gif);
border: 3px solid white;
}    

    </style>

<style>
    .table.comments-table:{
    border-color:black;}
</style>

<style>

h1{
animation: type 3s steps(27);
  color: white;
  font-size: 10px;
  white-space: nowrap;
  overflow: hidden;
  font-family: 'doctorpunk'
  }

@keyframes type{
  0%{
    width:0ch;
  }
  
  100%{
    width:27ch;
  }
}

@keyframes blink{
  0%{opacity:1;}
  50%{opacity:0;}
  100%{opacity:1;}
}

.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 5s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}

.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 5s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
@keyframes float {
0% { transform: translate(0, 0px);
}
50% {
transform: translate(0, 8px);
}
100% {
transform: translate(0, -0px);
}

</style>

<style>
.url-info{
    background: url(https://media.discordapp.net/attachments/1091989519395455008/1091994609867051069/be56a10c1331498868283e468fa4bc58.gif?width=500&height=500);
    background-position: center;
    height: 300px;
    width: 300px;
    background-size:cover;
}

.url-info p{
    opacity: 0.0;
}

</style>

<style>
table.comments-table{
background-color:black;
display: block;
height: 300px!important;
overflow-y: scroll;
border-width: 5px;
}
</style>

<style>
img:hover , .url-info:hover{
  animation: shake 1s;
  animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
</style>



<style>
    ::-webkit-scrollbar {
    width: 8px;
    height: 10px;}

    ::-webkit-scrollbar-thumb {
    background: #FF0F90;}

    ::-webkit-scrollbar-track {
    background: #2737A3;}
</style>

<style>
html:before {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://i.imgur.com/QpnTsrV.jpg);
  content: "";
  height: 300%;
  left: -50%;
  opacity:.3;
  position: fixed;
  top: -110%;
  width: 300%;
  pointer-events:none;
}
@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }
}

body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgb(0 0 0 / 48%) 50%, rgb(255 255 255 / 0%) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
</style>

<style>
body { cursor: url(http://www.rw-designer.com/cursor-extern.php?id=145905), auto; }
</style>

<iframe width="0" height="0" src="https://www.youtube.com/embed/4hb1s5JbbAs//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
</iframe>

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.

Comments

Displaying 20 of 51 comments ( View all | Add Comment )

Testacc	1692052565 Sooo, I have a question (and it's totally okay if you can't answer it, dw). I tried to add an intro animation along with this code, but it didn't seem to work. The intro animation itself works, but when I add it to this layout, it goes away. Do you maybe know why? Report Comment it can happen because the code becomes too long abt a part or it automatically deletes also it can happen if you don't put "" in the beggining and end of url by meatykitten; 1701166949; Report and* by meatykitten; 1701166962; Report
matt	1691163552 USING THIS IS PRETTY OMFGGGG Report Comment
KiyoKiyoTaka	1689155805 Using ^^ Report Comment
BelovedDisaster	1688873493 Using :333 Report Comment
★ KH4 🦴🐾	1688697207 using Report Comment
♡Britney♡	1688588239 Using! Report Comment
emoghxstgirl	1688332840 using Report Comment
MikaMeowification	1688314611 using!!! <3 Report Comment
Chezburgr_x3 🍔🌈	1686622766 using! x3 Report Comment
Silly (¬‿¬ )	1686516533 This is amazing!!! Is there a way I could possibly change the music tho? 0_0 Report Comment tysm! by Silly (¬‿¬ ); 1686596181; Report
Yuimiya	1686381763 Using!! I love this sm Report Comment
WitheredHound	1685826277 Question, how'd you find the badges? I have no idea where or how to find them except on people's accounts Report Comment you mean the blinkies? There's alot of places to find them! Tumblr has a giant collection, there's blinkies.cafe, basically just search up blinkies on google and you'll find some places to find them :] by Clover; 1686113528; Report
xX_TypicalToby_Xx (AUTOPLAY)	1685110542 using omg i love it so much!!!! Report Comment also i ADORE the music that autoplays, wuz gonna change 2 millionaires at first but when i listened i jammed so hard im def keeping this!!!! by xX_TypicalToby_Xx (AUTOPLAY); 1685110612; Report
.	1684810225 I LOVEZ IT !! If you dont mind can i have the code for the rainbow checker background? ^_^ Report Comment 1ts " body{background:url("https://64.media.tumblr.com/c92b182ba5055dde320d356dca2922c9/tumblr_ou0bq0qSqc1vfqyqxo1_540.gif"); } " :] by Clover; 1684935408; Report THXXX !! x3 by .; 1684936083; Report NPNP!! L0VE UR PR0F1LE BTW :3 by Clover; 1684936901; Report I LAV URZ TOO !! :D by .; 1684960881; Report
Colin	1684675358 Using!!^^ Report Comment
TechnoTeen	1682966517 oMG!!!!! SO CUTE!!!! <333333333 Report Comment
wolfangz	1682917532 Using !!:33 Report Comment
★Raygirl★	1682897324 Using! Report Comment
funfair	1682552135 using!! Report Comment