Rainbow Layout 3

Tags: rainbow, scene
Description:

Rainbow gradient layout with black background and custom online icon that you can change at the top of the code! Made with 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=34651) -->

<style>

.online { visibility: hidden; } .online img { content: url('https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/30002611-140c-433b-b288-1a7271de6ded/d9q0vqz-85ccfe6a-9425-435d-8c30-9cdfef50b88f.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzMwMDAyNjExLTE0MGMtNDMzYi1iMjg4LTFhNzI3MWRlNmRlZFwvZDlxMHZxei04NWNjZmU2YS05NDI1LTQzNWQtOGMzMC05Y2RmZWY1MGI4OGYuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.89lCW5fL0xDt9jAEw1fE61qqcksTI_UmqPgIj9mr_rY');
 animation-name: none; visibility: visible; height: 30px; width: 295px; }

}

</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/900fabe0-fe54-47e0-b23f-12fadced0d21/dd76tof-377155d1-9b80-48b7-8842-9f25fb3a7dc7.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzkwMGZhYmUwLWZlNTQtNDdlMC1iMjNmLTEyZmFkY2VkMGQyMVwvZGQ3NnRvZi0zNzcxNTVkMS05YjgwLTQ4YjctODg0Mi05ZjI1ZmIzYTdkYzcucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.D5FIg4q-2CAVnHG92YdCls9WyvG-Py2N8ITX9NwReak')
}
.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/900fabe0-fe54-47e0-b23f-12fadced0d21/dd76tof-377155d1-9b80-48b7-8842-9f25fb3a7dc7.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzkwMGZhYmUwLWZlNTQtNDdlMC1iMjNmLTEyZmFkY2VkMGQyMVwvZGQ3NnRvZi0zNzcxNTVkMS05YjgwLTQ4YjctODg0Mi05ZjI1ZmIzYTdkYzcucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.D5FIg4q-2CAVnHG92YdCls9WyvG-Py2N8ITX9NwReak')
}
.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/900fabe0-fe54-47e0-b23f-12fadced0d21/ddm4ave-5da0c7ab-6bd6-41f0-a44f-15638b666fbf.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzkwMGZhYmUwLWZlNTQtNDdlMC1iMjNmLTEyZmFkY2VkMGQyMVwvZGRtNGF2ZS01ZGEwYzdhYi02YmQ2LTQxZjAtYTQ0Zi0xNTYzOGI2NjZmYmYucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.zwU1-O4fJt2PjuSZzRcnbqv63SUh9GDtEzWAmZkH7q0')
}
.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/900fabe0-fe54-47e0-b23f-12fadced0d21/ddm4ave-5da0c7ab-6bd6-41f0-a44f-15638b666fbf.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzkwMGZhYmUwLWZlNTQtNDdlMC1iMjNmLTEyZmFkY2VkMGQyMVwvZGRtNGF2ZS01ZGEwYzdhYi02YmQ2LTQxZjAtYTQ0Zi0xNTYzOGI2NjZmYmYucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.zwU1-O4fJt2PjuSZzRcnbqv63SUh9GDtEzWAmZkH7q0')
}
.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/900fabe0-fe54-47e0-b23f-12fadced0d21/ddm4av3-c7b9d8e5-7955-4776-b3da-5602a1f87f93.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzkwMGZhYmUwLWZlNTQtNDdlMC1iMjNmLTEyZmFkY2VkMGQyMVwvZGRtNGF2My1jN2I5ZDhlNS03OTU1LTQ3NzYtYjNkYS01NjAyYTFmODdmOTMucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.vCUckWaWLxRGY-eYVT0TDTB9ZekLqWRIqT1X8b3mgIA')
}
.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/900fabe0-fe54-47e0-b23f-12fadced0d21/ddm4av3-c7b9d8e5-7955-4776-b3da-5602a1f87f93.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzkwMGZhYmUwLWZlNTQtNDdlMC1iMjNmLTEyZmFkY2VkMGQyMVwvZGRtNGF2My1jN2I5ZDhlNS03OTU1LTQ3NzYtYjNkYS01NjAyYTFmODdmOTMucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.vCUckWaWLxRGY-eYVT0TDTB9ZekLqWRIqT1X8b3mgIA')
}
.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/900fabe0-fe54-47e0-b23f-12fadced0d21/ddm4auw-3566c8c9-d7cc-4bee-9c6f-d8e1aaf2cb57.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzkwMGZhYmUwLWZlNTQtNDdlMC1iMjNmLTEyZmFkY2VkMGQyMVwvZGRtNGF1dy0zNTY2YzhjOS1kN2NjLTRiZWUtOWM2Zi1kOGUxYWFmMmNiNTcucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.RkttJnQbJcyfHE-To0ii5ZOwr1mUvQT1kVxx-AGG64E');
}
.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/900fabe0-fe54-47e0-b23f-12fadced0d21/ddm4auw-3566c8c9-d7cc-4bee-9c6f-d8e1aaf2cb57.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzkwMGZhYmUwLWZlNTQtNDdlMC1iMjNmLTEyZmFkY2VkMGQyMVwvZGRtNGF1dy0zNTY2YzhjOS1kN2NjLTRiZWUtOWM2Zi1kOGUxYWFmMmNiNTcucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.RkttJnQbJcyfHE-To0ii5ZOwr1mUvQT1kVxx-AGG64E');
}
</style>

<style>

body { 
background-color: black;
}

main{
background: rgb(255,251,113);
background: linear-gradient(180deg, rgba(0, 255, 234) 0%, rgba(111, 255, 0) 34%, rgba(255, 225, 0) 48%, rgba(255, 179, 0) 75%, rgba(255, 0, 0) 90%);
box-shadow: 0px 0px 10px #2d006b;
}

p{
color: white;
}

nav .top{
background-color: transparent;
box-shadow: 0px 0px 10px #2d006b;
border: 2px dotted white;

}

nav .links{
background-color: transparent;
background-size: cover;
text-align: center;
box-shadow: 0px 0px 10px #2d006b;
border: 2px dotted white;

}

.profile h1{
font-family: 'Exo 2', sans-serif;
color: white;
text-shadow: 0px 0px 5px #6a00ff;
font-size: 30px;
text-align: center;
}

.profile .general-about{
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 1em;
text-align: center;
background-color: rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px #2d006b;

color: white;

border: 2px dotted white;

}

.profile-pic img{
border: 2px dashed white;
border-radius: 100%;
}

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

}


footer {
background-color: transparent;

border: 2px dotted white;

}

.profile .contact .heading,
.profile .table-section .heading{
background-color: black;
text-align: center;
color: white;
text-shadow: 1px 1px 0px #6a00ff;

border: 2px dotted white;

}

.profile .contact, 
.profile .table-section,
.profile .url-info{
border: 2px dotted white;
background-color: rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px #2d006b;
margin: .5em 0;

}

.url-info{
    background: url('https://media.tenor.com/dgpsy_qfjwcAAAAd/aesthetic-anime.gif');
    background-position: center;
    height: 77px;
    background-size:cover;
}

.url-info p{
    opacity: 0.0;
}


table.details-table td {
background-color: transparent !important;
color: white !important;

border: 1.5px dotted white;

}

.profile .blurbs .heading,
.profile .friends .heading{
background-color: black;
background-size: cover;
text-align: center;
color: white;
text-shadow: 1px 1px 0px #6a00ff;

border: 1.5px dotted white;

}

.profile .blurbs,
.profile .friends{
border: none;
background-color: rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px #2d006b;
text-align: center;
color: white;

border: 2px dotted white;

}

.profile .blurbs .section h4{
color: white;
text-shadow: 1px 1px 0px #6a00ff;
padding: 1em 0;

border: 1.5px dotted white;

}

.profile .profile-info{
color: white;
text-shadow: text-shadow: 1px 1px 0px #6a00ff;
background-color: rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px #2d006b;
border: 1.5px dotted white;

}

.profile .blog-preview{
text-align: center;
border: none;
background-color: rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px #2d006b;
padding: 1em 0;
color: white;

border: 2px dotted white;

}

.profile .friends .friends-grid p{
color: white;
text-shadow: 0px 0px 3px #6a00ff;

border: 1.5px dotted white;

}

.count{
color: white;
text-shadow: 0px 0px 3px #6a00ff;
}

.profile .comments-table{
color: white;
text-align: center;
background-color: rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px #2d006b;
border: 2px dotted white;

}

.profile .comments-table .comment-replies{
background-color: rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px #2d006b;
border: 2px dotted white;
color: white;
}

.profile .comments-table td{
background-color: transparent;
color: white;
padding: .5em;

border: 2px dotted white;

}

a{
color: white;
text-shadow: 0px 0px 3px #6a00ff;
}

a:visited {
color: white;
text-shadow: 0px 0px 3px #6a00ff;
text-decoration: none;
}

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

a:active {
color: white;
text-decoration: none;
text-shadow: 0px 0px 3px #6a00ff;
}

nav .links a:hover{
color: #B0FDFF;
text-decoration: none;
text-shadow: 0px 0px 3px #6a00ff;

border: 2px dotted white;

}

.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 )
jamie009_1	1696577411 usinv!! Report Comment
sereny	1691174230 using >3 Report Comment
☆ subsp	1690952309 USING! Report Comment
Jordylew	1689850500 Usinngg :D !! Report Comment