This is my Layout that I coded ppl rly wanted me to release it if you use it pls comment on my profile so I can see it!!! Also everything should be explained by these notations */*/
https://layouts.spacehey.com/layout?id=27743 This layout was my original inspiration and I still have the huge lain gif on my profile go show love to this person
About me:
CSS <style>
/* SPACEHEY LAYOUT MADE BY ROBOT @hell3a ON TIK TOK GIVE CREDIT OR ADD ME
About me section
*/
:root {
}
</style>
<span style="color: white;">SUP YALL MY PROFILE IS HELLA BUGGY ALLLWAYS CUZ IM SITLL CODING IT AND IM REAL LAZY SO EVERYTHING MIGHT NOT LOAD PROPERLY SRY!!!!</span>
<style>
.profile-wrapper {
display: inline-block;
width: 800px; /* Adjusted for scaling */
height: 500px; /* Adjusted for scaling */
transform: scale(); /* Change this value to make it bigger or smaller */
transform-origin: center center;
background-color: rgba(0, 0, 0, 0) !important;
border: none !important;
}
/* Used to PSP frame and profile picture are placed correctly. */
.profile-pic {
position: relative;
width: 200px;
height: 135px;
margin: 0 auto;
top: -20px; /* Move the PSP up */
left: -25px; /* Move the PSP to the left */
background-color: rgba(0, 0, 0, 0) !important;
border: none !important;
}
/* CODE to fit the profile picture inside the psp change it to your liking. !!MIGHT BREAK */
.profile-pic img {
position: absolute;
top: 25px; /* Adjusted for better fit */
left: 75px;
width: 185px;
height: 120px;
object-fit: cover;
z-index: 1;
background-color: rgba(0, 0, 0, 0) !important;
border: none !important;
}
/* PSP BORDER WITH ADJUSTMENTS */
.profile-pic:after {
content: "";
background: url('https://files.catbox.moe/powjpa.png') no-repeat center center; /* This is the link to the PSP frame */
background-size: contain;
position: absolute;
top: -85px; /* Adjusted for better fit */
left: 0px; /* Adjusted for better fit */
/* Width and height to make it bigger */
width: 170%;
height: 200%;
z-index: 2; /*Make PSP sit above the profile picture */
background-color: transparent !important;
border: none !important;
}
.general-about .profile-pic img {
max-width: 100%;
background-color: rgba(0, 0, 0, 0) !important;
border: none !important;
}
/* !!!PROFILE PICTURE PUT YOUR OWN PFP HERE HTML Code change the img src to your own profile picture */
<div class="profile-wrapper" >
<div class="profile-pic" >
<img src="https://file.garden/Z8367HLvSFmBbGlX/f15855576df662d1f5f7288df6b5da1bd1bae142_full.jpg" alt="Profile Picture" >
}
</style>
<style>
.online {
visibility: hidden;
z-index: 999;
}
.online img {
content: url("https://i.ibb.co/sCLNcck/ezgif-5-5861b4e688.png");
animation-name: none;
visibility: visible;
height: 35px;
width: 35px;
z-index: 999;
}
</style>
<style>
/* Font settings */
@font-face {
font-family: "LoveLetterTW";
src: url("https://file.garden/Z8367HLvSFmBbGlX/Lovelt_.ttf");
}
/* Some reason I have this duplicated cant be bothered idk LOL */
@font-face {
font-family: "LoveLetterTW";
src: url("https://file.garden/Z8367HLvSFmBbGlX/Lovelt_.ttf");
}
a:hover, a:active, a, p, nav label, .section {
font-family: var(--mainfont) !important;
color: black;
font-size: 15px;
}
h1, h2, h3, h4, h5, DIV.mood > P:nth-child(1) > B, P:nth-child(2) > B {
font-family: "LoveLetterTW"
}
:root {
--mainfont: "LoveLetterTW"
}
/* Whole websites background change url to your liking MADE MY ROBOT AKA hell3a on tiktok */
body {
background-image: url(https://file.garden/Z8367HLvSFmBbGlX/ezgif-76588d7bc84c85.gif);
background-size: cover; /* Scale to cover the entire screen */
background-position: center; /* Center the image */
background-repeat: no-repeat; /* Prevent tiling */
background-attachment: fixed; /* Make the background stay fixed on scroll */
}
/* CODE FOR THE INTRO */
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed;
top: 0;
left: 0;
z-index: 100;
background-image: url(https://i.kym-cdn.com/photos/images/original/000/915/611/fe8.gif);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
animation: yourAnimation 7.15s ease 0s 1 normal forwards;
pointer-events: none;
}
main {
border-radius: 0 0 15px 15px;
border: 2px solid (#7dab7d);
background-color: rgba(177,156,217,0.1);
}
@keyframes yourAnimation {
0.0% {
opacity: 1;
}
75% {
opacity: 1;
}
100% {
opacity: 0;
}
}
nav, footer {
margin: 1em;
position: relative;
box-shadow: 5px 8px 10px #0006;
}
/* Huge green lain gif code */
main:before {
width: auto;
margin-bottom: 25px;
border: 1px solid black;
height: 300px;
display: block;
content: "";
box-shadow: 0px 0px 5px 1px #7bbd75;
background-image: url(https://image.myanimelist.net/ui/G-Sm6d0qIwQxUGHIp-m2WDFUqTQ_MSEIl_awFmjMGxbekgq4TQ1uxtKstreVvr4-lVvxpGl1WLv-KFe49xYXZk38IyzwhS5G85D1U1hdCZcURnjnq9JMlqyG0t3O9xbB);
background-position: center center;
background-size: cover;
}
.profile-pic img, .friends-grid img, .comments-table img {
border-radius: 5px;
}
}
.profile {
background-image: #decfb8
}
.profile .blurbs .heading,
.profile .friends .heading {
background-color: rgb(123, 184, 125);
color: white;
box-shadow: 0px 0px 5px 1px #7bbd75;
}
.profile .contact,
.profile .url-info,
.profile .table-section,
.setting-section,
.home-actions {
width: 100%;
border: 2px solid #60A5FA;
border: 2px solid var(--lighter-blue);
margin: 10px 0;
box-shadow: 0px 0px 5px 1px #7bbd75;
}
.comments-table {
display: block;
height: 340px;
overflow-y: scroll;
box-shadow: 0px 0px 5px 1px #7bbd75;
}
.contact .inner a img {
font-size: 0;
box-shadow: 0px 0px 5px 1px #7bbd75;
}
.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 Favorites */
content: "🧸"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* Send Message */
content: "🎧"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* Forward 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 to Group */
content: "🎧"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* Report Profile */
content: "🎧"
}
/* Colorful footer */
footer {
border-radius: 15px;
background-image: url(https://64.media.tumblr.com/1e6adb2bbddf1e73436744a235a58c48/4484d119cdf9cc58-e7/s540x810/0a4319cbb7a300c54f0ca4cfabcda590bdb49642.gifv);
color: white;
background-size: cover !important; /* Scale to cover the entire screen */
background-position: center !important; /* Center the image */
background-repeat: no-repeat !important; /* Prevent tiling */
}
/* Dancing Lain code */
footer::after {
bottom: 0;
font-size: 0;
left: 82%;
position: fixed;
pointer-events: none;
content: url("https://laingame.net/bootleg/lain.gif");
}
table.comments-table td {
color: rgb(194, 199, 255);
}
/*Root which changes the default colors/logos */
:root {
--logo-blue: url(https://64.media.tumblr.com/1e6adb2bbddf1e73436744a235a58c48/4484d119cdf9cc58-e7/s540x810/0a4319cbb7a300c54f0ca4cfabcda590bdb49642.gifv);
--darker-blue: #d9d1a7;
--lighter-blue: #fff0;
--even-lighter-blue: #80a683;
--lightest-blue: #ffffd1;
--dark-orange: #7dab7d;
--light-orange: #7dab7d;
--even-lighter-orange: #7dab7d;
--green: white;
--box-shadow: 0px 0px 5px 1px #7bbd75;
}
</style>
WHO I'D LIKE TO MEET:
<style>
/* Here starts the Who i'd like to meet section */
(music)
/* Change this code to your own spotify playlist share, share embed copy css */
</style>
<iframe style="border-radius:12px" src="https://open.spotify.com/embed/playlist/5nCA9R0ek1K5mRpqhKIMXn?utm_source=generator" width="77%" height="352" frameborder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"> </iframe>
<style>
/* This is my lastfm embed change your last.fm user (the first link) then the second link change the name to your own last.fm name (oscrob) */
</style>
<a href="https://www.last.fm/user/oscrob"> <img src="https://lastfm-recently-played.vercel.app/api?user=oscrob&t=" height="auto" width="350px"/> </a>
Comments
Displaying 1 of 1 comments ( View all | Add Comment )
;)
this is awesome — keeping the old internet spirit alive 💾
Thank you so much <3
by robot; ; Report