Yellow layout

Tags: yellow
Description:

Simple yellow layout with floating profile animation and custom online icon. Made from different pieces of code, so change it up however you'd like! Just comment if used
Preview:

click on the image for a larger preview
Code:

<!-- (c) Layout created by Sip O' Poison (https://layouts.spacehey.com/layout?id=34888) -->

<style>

.online { visibility: hidden; } .online img { content: url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/a9550e1a-5040-4dc6-a406-5e3709729d06/d3joo34-484b7ab5-19e0-412b-9a50-5641c2f65d37.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcL2E5NTUwZTFhLTUwNDAtNGRjNi1hNDA2LTVlMzcwOTcyOWQwNlwvZDNqb28zNC00ODRiN2FiNS0xOWUwLTQxMmItOWE1MC01NjQxYzJmNjVkMzcuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.JGQyheRlRMgYVqgL1bynUUnYUPSg6arwzBxjfrC0RKM');
 animation-name: none; visibility: visible; }

}

</style>


<style>
.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:url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/768df49b-9b9a-45f9-b8b9-56558c7b0cfb/d7wvsoz-f88659f7-387d-422d-b1b8-8ef036e52fd3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc2OGRmNDliLTliOWEtNDVmOS1iOGI5LTU2NTU4YzdiMGNmYlwvZDd3dnNvei1mODg2NTlmNy0zODdkLTQyMmQtYjFiOC04ZWYwMzZlNTJmZDMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.6dApEiM_2T6UbXCuAFnmNtN-zH1YTSlsNGj90t7MZ8Q')
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	/* Add to Favorites */
	content:url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/768df49b-9b9a-45f9-b8b9-56558c7b0cfb/d7wvsoz-f88659f7-387d-422d-b1b8-8ef036e52fd3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc2OGRmNDliLTliOWEtNDVmOS1iOGI5LTU2NTU4YzdiMGNmYlwvZDd3dnNvei1mODg2NTlmNy0zODdkLTQyMmQtYjFiOC04ZWYwMzZlNTJmZDMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.6dApEiM_2T6UbXCuAFnmNtN-zH1YTSlsNGj90t7MZ8Q')
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* Send Message */
	content:url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/768df49b-9b9a-45f9-b8b9-56558c7b0cfb/d7wvsoz-f88659f7-387d-422d-b1b8-8ef036e52fd3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc2OGRmNDliLTliOWEtNDVmOS1iOGI5LTU2NTU4YzdiMGNmYlwvZDd3dnNvei1mODg2NTlmNy0zODdkLTQyMmQtYjFiOC04ZWYwMzZlNTJmZDMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.6dApEiM_2T6UbXCuAFnmNtN-zH1YTSlsNGj90t7MZ8Q')
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* Forward to Friend */
	content:url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/768df49b-9b9a-45f9-b8b9-56558c7b0cfb/d7wvsoz-f88659f7-387d-422d-b1b8-8ef036e52fd3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc2OGRmNDliLTliOWEtNDVmOS1iOGI5LTU2NTU4YzdiMGNmYlwvZDd3dnNvei1mODg2NTlmNy0zODdkLTQyMmQtYjFiOC04ZWYwMzZlNTJmZDMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.6dApEiM_2T6UbXCuAFnmNtN-zH1YTSlsNGj90t7MZ8Q')
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* Instant Message */
	content:url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/768df49b-9b9a-45f9-b8b9-56558c7b0cfb/d7wvsoz-f88659f7-387d-422d-b1b8-8ef036e52fd3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc2OGRmNDliLTliOWEtNDVmOS1iOGI5LTU2NTU4YzdiMGNmYlwvZDd3dnNvei1mODg2NTlmNy0zODdkLTQyMmQtYjFiOC04ZWYwMzZlNTJmZDMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.6dApEiM_2T6UbXCuAFnmNtN-zH1YTSlsNGj90t7MZ8Q')
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* Block User */
	content:url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/768df49b-9b9a-45f9-b8b9-56558c7b0cfb/d7wvsoz-f88659f7-387d-422d-b1b8-8ef036e52fd3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc2OGRmNDliLTliOWEtNDVmOS1iOGI5LTU2NTU4YzdiMGNmYlwvZDd3dnNvei1mODg2NTlmNy0zODdkLTQyMmQtYjFiOC04ZWYwMzZlNTJmZDMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.6dApEiM_2T6UbXCuAFnmNtN-zH1YTSlsNGj90t7MZ8Q')
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* Add to Group */
	content:url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/768df49b-9b9a-45f9-b8b9-56558c7b0cfb/d7wvsoz-f88659f7-387d-422d-b1b8-8ef036e52fd3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc2OGRmNDliLTliOWEtNDVmOS1iOGI5LTU2NTU4YzdiMGNmYlwvZDd3dnNvei1mODg2NTlmNy0zODdkLTQyMmQtYjFiOC04ZWYwMzZlNTJmZDMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.6dApEiM_2T6UbXCuAFnmNtN-zH1YTSlsNGj90t7MZ8Q');
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* Report Profile */
	content:url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/768df49b-9b9a-45f9-b8b9-56558c7b0cfb/d7wvsoz-f88659f7-387d-422d-b1b8-8ef036e52fd3.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzc2OGRmNDliLTliOWEtNDVmOS1iOGI5LTU2NTU4YzdiMGNmYlwvZDd3dnNvei1mODg2NTlmNy0zODdkLTQyMmQtYjFiOC04ZWYwMzZlNTJmZDMuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.6dApEiM_2T6UbXCuAFnmNtN-zH1YTSlsNGj90t7MZ8Q');
}
</style>

<style>

body {
  background-color: black;
}

main{
background: rgb(176, 169, 30,0.5);
box-shadow: 0px 0px 10px #ffde82;
border: 1.5px dotted #ffde82;
}

p{
color: #ffffff;
}

nav .top{
background-color: transparent;
box-shadow: 0px 0px 10px #ffde82;
border: 1.5px dotted #ffde82;

}

nav .links{
background-color: transparent;
background-size: cover;
box-shadow: 0px 0px 10px #ffde82;
border: 1.5px dotted #ffde82;

}

.profile h1{
color: #ffffff;
text-shadow: 0px 0px 5px #ffde82;
font-size: 30px;

}

.profile .general-about{

background-color: rgba(43, 33, 3,0.5);
box-shadow: 0px 0px 10px #ffde82;
color: #ffffff;
text-shadow: 0px 0px 5px #ffde82;
border: 1.5px dotted #ffde82;

}

.profile-pic img{
border: 1.5px dashed #ffde82;
}

.general-about .profile-pic{
margin: 5;

}

footer {
color: #ffffff !important;
text-decoration: underline !important;
text-decoration-style: dotted !important;
text-shadow: 0px 0px 5px #ffde82;
background: transparent;
border: 1.5px dotted #ffde82;
}

.profile .contact .heading,
.profile .table-section .heading{
background-color: transparent;
color: #ffffff;
text-shadow: 1px 1px 0px #ffde82;
border: 1.5px dotted #ffde82;

}

.profile .contact, 
.profile .table-section,
.profile .url-info{
border: 1.5px dotted #ffde82;
background-color: rgba(43, 33, 3,0.5);
box-shadow: 0px 0px 10px #ffde82;
margin: .5em 0;


}


table.details-table td {
background-color: transparent !important;
color: #ffffff !important;
text-shadow: 0px 0px 5px #ffde82;
border: 1.5px dotted #ffde82;

}

.profile .blurbs .heading,
.profile .friends .heading{
background-color: transparent;
background-size: cover;
color: #ffffff;
text-shadow: 1px 1px 0px #ffde82;
border: 1.5px dotted #ffde82;

}

.profile .blurbs,
.profile .friends{
background-color: rgba(43, 33, 3,0.5);
box-shadow: 0px 0px 10px #ffde82;
color: #ffffff;
text-shadow: 0px 0px 5px #ffde82;
border: 1.5px dotted #ffde82;
}

.profile .blurbs .section h4{
color: #ffffff;
text-shadow: 1px 1px 0px #ffde82;
padding: 1em 0;

}

.profile .profile-info{
color: #ffffff;
text-shadow: 1px 1px 0px #ffde82;
background-color: rgba(43, 33, 3,0.5);
box-shadow: 0px 0px 10px #ffde82;
border: 1.5px dotted #ffde82;

}

.profile .blog-preview{
text-align: center;
border: none;
background-color: rgba(43, 33, 3,0.5);
box-shadow: 0px 0px 10px #ffde82;
padding: 1em 0;
color: #ffffff;
text-shadow: 0px 0px 5px #ffde82;
border: 2px dotted #ffde82;

}

.profile .friends .friends-grid p{
color: #ffffff;
text-shadow: 0px 0px 3px #ffde82;
border: 1.5px dotted #ffde82;

}

.count{
color: #ffffff;
text-shadow: 0px 0px 3px #ffde82;
}

.profile .comments-table{
color: #ffffff;
text-shadow: 0px 0px 5px #ffde82;
background-color: rgba(43, 33, 3,0.5);
box-shadow: 0px 0px 10px #ffde82;
border: 2px dotted #ffde82;

}

.profile .comments-table .comment-replies{
background-color: rgba(43, 33, 3,0.5);
box-shadow: 0px 0px 10px #ffde82;
border: 2px dotted #ffde82;
color: #ffffff;
text-shadow: 0px 0px 5px #ffde82;
}

.profile .comments-table td{
background-color: transparent;
color: #ffffff;
text-shadow: 0px 0px 5px #ffde82;
padding: .5em;
border: 1.5px dotted #ffde82;

}

a{
color: #ffffff;
text-shadow: 0px 0px 3px #ffde82;
}

a:visited {
color: #ffffff;
text-shadow: 0px 0px 3px #ffde82;
text-decoration: none;
}

a:hover {
color: #B0FDFF;
text-decoration: none;
}

a:active {
color: #ffffff;
text-decoration: none;
text-shadow: 0px 0px 3px #ffde82;
}

nav .links a:hover{
color: #B0FDFF;
text-decoration: none;
text-shadow: 0px 0px 3px #ffde82;
border: 1.5px dotted #ffde82;

}

.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}

.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

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>
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 5 of 5 comments ( View all | Add Comment )
𝐊𝐥𝐚𝐮𝐬 ᯤ	1724956673 Using Report Comment
elf_null	1711035563 using the online icon! Report Comment
doormatt	1708525192 using the online icon :D Report Comment
Nikto's Lover	1707604071 Usando Report Comment
Matteo XP	1705394010 using the online icon X3 Report Comment