Dreamy Hippie

Tags: hippie, hippy, dreamy, 70s, 60s

Description:

Lowkey I fucked this code up (bad) but it was originally just for me someone just asked that I share so enjoy

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by 🕊️Hatti🕊️ (https://layouts.spacehey.com/layout?id=27945) -->

* <style>body { cursor: url('data:image/x-icon;base64,AAACAAEAICAQAAoABwDoAgAAFgAAACgAAAAgAAAAQAAAAAEABAAAAAAAAAIAAAAAAAAAAAAAEAAAAAAAAAAAAAAA////AOhmkQCcmZUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAiIiIiIgAAAAAAAAAAAAACIzMzMzIgAAAAAAAAAAAAIjERERETIgAAAAAAAAAAACMRERETMzIAAAAAAAAAAAIjERERExMyIAAAAAAAAAACMRExETMRMyAAAAAAAAAAAjETERMRMRMgAAAAAAAAAAIxEzMzETETIAAAAAAAAAACIxERMTETEyAAAAAAAAAAACIzMzExEzIgAAAAAAAAAAACIxExMxMiAAAAAAAAAAAAAiMTMRMyIAAAAAAAAAAAAAIxEyMTIgAAAAAAAAAAAAACMTIjEyAAAAAAAAAAAAAAIjEyIxMgAAAAAAAAAAAAACMRMiMTIAAAAAAAAAAAAAAjEyIjEyAAAAAAAAAAAAAAIxMgIxMgAAAAAAAAAAAAACMTICMTIAAAAAAAAAAAAAAjMyAjMyAAAAAAAAAAAAAAIiIgIiIgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD/////////////////////////////////wA///4AH//8AA///AAP//gAB//4AAf/+AAH//gAB//4AAf//AAH//4AD//+AB///gA///4Af//8AH///AB///wAf//8EH///BB///wQf//8EH////////////////////////////w=='), auto; }</style>


<style>
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Amatic+SC:wght@700&display=swap');
</style>

<style>

.blurbs {
border: 1px dashed #FFFFFF!important; 
background: rgba(190, 190, 190);
background: #f6dfd3;
border-radius: 10px;
box-shadow: 1px 1px 2px rgba(190, 190, 190,);
height: 300px!important;


}

/* colors for the table headings on the left */
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
  background-color: ;
  color: #f0bf9c;
}

.heading {
  padding: 3px 0px !important;
  margin-bottom: 5px;
  border-bottom: 2px solid ;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
}


.online{content: url("https://dl.glitter-graphics.com/pub/1304/1304506azdi5re95a.gif");


</style>

<style>


  table, tr, td { 
  background-color:transparent; 
 } 

  table, tr, td { 
  background-color:transparent; 
 border:none; 
 border-width:50px; 
 } 

  table table table { 
  width:80%; max-width:600px; } table table table table { width:100%;; 
 } 

  body, .bodyContent  { 
  background-image:url(https://i.pinimg.com/564x/51/45/f1/5145f105673d0412fb02b789a15e242b.jpg); 
 background-position:fulltile; 
 background-attachment:fixed; 
 border-color:#00000000; 
 border-width:30px; 
 border-style:dotted; 
 scrollbar-face-color:#00000000; 
 scrollbar-highlight-color:#aaaaaa; 
 scrollbar-3dlight-color:000000; 
 scrollbar-shadow-color:#aaaaaa; 
 scrollbar-darkshadow-color:000000; 
 scrollbar-arrow-color:#aaaaaa; 
 scrollbar-track-color:000000; 

 } 

  table table { 
  border:0px; 
 } 

  table table table table { 
  border: #f5c3a9; 
 background-image: none; 
 background-color:transparent; 
 } 

  table table table { 
  border-style: #f5c3a9; 
 border-width:none; 
 border-color: transparent; 
 background-attachment:fixed; 
 } 

  table table table td { 
  background-color: #eb611e; 
 } 

  table, tr, td, li,.text,.redtext, .blacktext12  { 
  color:#f5c3a9; 

 } 
Table, p {
color:#f78457;
}
   .whitetext12, .orangetext15 { 
  color: #f5c3a9; 
font-family: Arial Black;
 } 

   .lightbluetext8, .blacktext10, .redbtext,.btext  { 
  color: #f5c3a9; 
font-family: Arial Black;
 
 } 

  a:active, a:visited, a:link, a.searchlinksmall:active, a.searchlinksmall:visited, a.searchlinksmall:link, a.navbar:active, a.navbar:visited, a.navbar:link, a.redlink:active, a.redlink:visited, a.redlink:link{ 
     color: ;
text-shadow: 0 0 8px; #FFF600;
font-family:  'Amatic SC', cursive;
font-size: 22px;
line-height: 18px;

 } 

  a:hover, a.searchlinksmall:hover, a.navbar:hover, a.redlink:hover  { 
  color:e9621f; 
 } 



h1 {
font-size: 40px !important;
line-height: 45px;
font-family: 'Dancing Script', cursive;
font-weight:bold;
text-transform: uppercase;
letter-spacing: -1.5px;
color:white;
text-align:center;
padding-bottom:0px;
padding-top:0px;
padding-right: 3px;
text-shadow: 0 0 5px #fff;

border-radius: 3px;
background:#f6dfd3;
background-image:url("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX");
background-position: center;
margin-top: 5px;
}


 </style>

 







<style>

nav img.logo{filter: brightness(0) saturate(100%) invert(19%) sepia(30%) saturate(102%) hue-rotate(100deg) brightness(90%) contrast(50%) !important;}

}


nav {
  overflow-x: hidden;
  position: relative;

}

nav .top {
  background: url(https://external-content.duckduckgo.com/iu/?u=http%3A%2F%2Fimg1.picmix.com%2Foutput%2Fstamp%2Fnormal%2F8%2F9%2F1%2F4%2F264198_d6166.gif&f=1&nofb=1);
}

nav .links {
  background: rgba(0, 0, 0, 0.3);
}

nav { background-image:transparent; }

body {
  /* sets background */
    background-image: transparent;
    background-repeat: repeat;
    background-attachment: fixed;
    background-size: 60% ;
   
    

  }


:root {
        --logo-blue: #F0F8FF;
        --darker-blue: #f2ddc7;
        --lighter-blue: ;
        --even-lighter-blue: #f6dfd3;
        --lightest-blue:url(https://external-content.duckduckgo.com/iu/?u=http%3A%2F%2Fimg1.picmix.com%2Foutput%2Fstamp%2Fnormal%2F8%2F9%2F1%2F4%2F264198_d6166.gif&f=1&nofb=1);
        --dark-orange:  #e9621f;
        --light-orange:url(https://external-content.duckduckgo.com/iu/?u=http%3A%2F%2Fimg1.picmix.com%2Foutput%2Fstamp%2Fnormal%2F8%2F9%2F1%2F4%2F264198_d6166.gif&f=1&nofb=1);
        --even-lighter-orange:url(https://external-content.duckduckgo.com/iu/?u=http%3A%2F%2Fimg1.picmix.com%2Foutput%2Fstamp%2Fnormal%2F8%2F9%2F1%2F4%2F264198_d6166.gif&f=1&nofb=1);!important;
 opacity: 1.0;
        --green: #fff;
    }

main {
  /* changes made to stuff outside of columns */
    background: #ffffff;
    padding: 0;
    font-size: 100%;
    color: var(--light-orange);
  }

img {
  opacity: none;
}



main {
  background-image:url(https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fi.gifer.com%2FYTiF.gif&f=1&nofb=1);
  opacity: 0.9;
  
  color: #f2693f;
}


}

.profile h1 {color: #e9621f;}
text-align:right;

body { 

font-family: monospace;

      }
    .profile-pic {
        border-radius: 500px;
        border: #90d1c7 solid 2px;
        overflow: hidden;
        margin-top: -10px!important;
        margin-left: 0px!important;
        filter:;
    }

</style>


<style>
/* profile-info */

.profile-info {
    position: fixed;
    left: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 100vw;
    border: 0;
    z-index: 20;
    -webkit-backdrop-filter: blur(20px);
}
.profile-info a {
    color: #1e0424;
}


.profile-info { border:double 0px #Ffd1dc88;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
background: transparent url(http://dl8.glitter-graphics.net/pub/1314/1314668f7r536cjyu.gif) no-repeat center center;
background-size: contain;

    </style>








<style>
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Amatic+SC:wght@700&display=swap');
</style>

<style>
.contact {

  border-radius: 25px;
  background: url(https://i.pinimg.com/564x/ba/5e/2b/ba5e2bf485ba49445f868208cbb70db3.jpg);
  background-position: bottom;
  background-repeat: repeat;
  padding: 20px;
  width: 200px;
  height: 150px;
}

.blurbs {
border: 1px dashed #FFFFFF!important; 
background: rgba(190, 190, 190);
background: #f6dfd3;
border-radius: 10px;
box-shadow: 1px 1px 2px rgba(190, 190, 190,);
height: 300px!important;



}

.heading {
  padding: 3px 0px !important;
  margin-bottom: 5px;
  border-bottom: 2px solid ;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
}

.online{content:url("http://dl5.glitter-graphics.net/pub/2369/2369525kcxz1j0mf7.gif");

</style>


<style> 
/* contact icons */
.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 to friends */
content: "🧿"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: "🌿"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: "⭐️"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: "☀️"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: "🌎"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: "🌙"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: "🌈"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: "☮️"
}
</style>
<style>body:before {
	content: " ";
	height: 100vh;
	width: 100vw;
	display: block;
	position: fixed; 
	top: 0; 
	left: 0; 
	z-index: 100;
	background-image: 
url('https://media.giphy.com/media/v1.Y2lkPTc5MGI3NjExYmU2OTdmZWJhZmY3M2EwYmEwYTE0ZDNlYThjODk4NDBmNGRhZDllYyZjdD1n/xeabwYCaXlJfkIH87B/giphy.gif');
	background-size: cover;
	background-repeat: no-repeat;
	animation: yourAnimation 4s ease 0s 1 normal forwards;
	pointer-events: none;
}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 
</style>

<style>
footer::after {
    bottom: 0;
    font-size: 0;
    left: 70%;
    position: fixed;
    pointer-events: none;
    content: url(http://dl6.glitter-graphics.net/pub/3580/3580976or4qna2h93.gif);

}
</style>
<style>
html:before {
  animation: grain 50s steps(10) infinite;
  background-image: url('http://dl5.glitter-graphics.net/pub/602/602355k2suf9v03y.gif');
  content: "";
  height: 300%;
  left: -50%;
  opacity:.2;
  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%) }
} 
{
nav, footer, .profile .contact {
display: inherit !important;
opacity: 1 !important;
border-radius: 12px;
}
</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.

Comments

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

l0veNotW4r14	1767146662 Code isnt working 4 me, any tips? Report Comment
l0veNotW4r14	1767146216 Using!! Report Comment
applesboy	1764344028 using!! Report Comment
boots	1762898524 using!! ^_^ Report Comment
lunaticlivvy	1762642027 using! tysmmm Report Comment
𝓭 𝓲 𝓼 𝓲 𝓷 𝓯 𝓮 𝓬 𝓽	1761425379 using!! Report Comment
SoraSprinklesXP	1759588897 using Report Comment
EVANgelically	1756402119 using!! Report Comment
EVANgelically	1756402117 using!! Report Comment
cam!!	1754377853 using!!!!! Report Comment
LeAnn	1752361689 using! Report Comment
𖦹•°.•⁠˖☀︎︎.Vwlerie⁠.☀︎︎⁠˖•.°•︎𖦹	1750047902 usando Report Comment
adam O_o	1746486086 using Report Comment
changelingheartzzz	1743105136 using! Report Comment
changelingheartzzz	1743105136 using! Report Comment
𝓕rancipro2011 ༝༚༝༚	1740426019 using ¡¡ Report Comment
rad	1739082647 using!! Report Comment
nanever	1738600914 using <3 Report Comment
Maya	1736907951 Using!! Report Comment
Belbiedoll	1736595986 I love it but would prefer to take out the beginning animation. Would you mind sharing? Xx THANK YOU Report Comment