graphic design is my passion (click to see preview)

Tags: geocities, 90s, colorful, y2k, bright, gif

Description:

it's really ugly, but i spend so much time on it. if you use it, you should comment on here, so i know, just because i wanna see. i don't really care.

my heart and soul and everything went into this layout, please love it.

(p.s. let me know in the comments if you need help modifying it to your liking, and i should get back to you in 3 to 5 business days)

[update: some of the icons were broken because i was literally hosting the images in discord dms to mee6, so now the icons should work]

the stupid picture won't show, so i'm just gonna put it here

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by myc (https://layouts.spacehey.com/layout?id=24707) -->

<style>
body {
    background-image: url("https://www.techspot.com/images2/news/bigimage/2016/10/2016-10-28-image.gif");
}
img {
    filter: sepia(0%) hue-rotate(0deg) saturate(1);
}
body::before {
    content: " ";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, 	rgba(0, 0, 0, 0.25) 50%);
    z-index: 1000000;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}
::-webkit-scrollbar {
    width: 10px;
    background-color: brown;
    border-style: inset;
    border-color: maroon;
}
::-webkit-scrollbar-thumb {
    background-color: chocolate;
    border-style: outset;
    border-color: brown;
}
.top {
    background-image: url("https://images-ext-2.discordapp.net/external/Hgjba2Q2sNKlMy6o9DHuigWN8_eWXFlq2Vo9h1h90U8/https/i.gifer.com/13wV.gif") !important;
    color: blue;
    font-size: 15px;
    font-weight: bold;
    border-style: outset;
    border-top-color: red;
    border-left-color: red;
    border-bottom-color: darkred;
    border-right-color: darkred;
    border-width: 5px;
    margin-bottom: 5px;
    margin-top: 5px;
}
.top a:hover {
    color: darkorange;
    background-color: blue;
    border-style: outset;
    border-top-color: blue;
    border-left-color: blue;
    border-bottom-color: darkblue;
    border-right-color: darkblue;
    border-width: 5px;
    text-decoration: none !important;
}
.top a:active {
    background-image: url("https://cutewallpaper.org/21/geocities-backgrounds/Index-of-The-Codex-of-Ultmate-Wisdomwwwgeocitiescom-.gif");
    border-style: inset;
    border-top-color: darkblue;
    border-left-color: darkblue;
    border-bottom-color: blue;
    border-right-color: blue;
    border-width: 5px;
    text-decoration: none !important;
}
.logo {
    background-color: blue;
    padding: 5px;
}
.links {
    background-image: url("https://i.gifer.com/origin/4a/4a9789a735929cb1bfc7e3d08a853546_w200.gif");
    font-family: 'Times New Roman', serif;
    font-size: 16px;
    font-weight: bold;
    border-style: outset;
    border-top-color: pink;
    border-left-color: pink;
    border-bottom-color: hotpink;
    border-right-color: hotpink;
    border-width: 5px;
    margin-bottom: 5px !important;
}
.profile {
    background-color: darkblue;
    border-style: outset;
    border-top-color: blue;
    border-left-color: blue;
    border-right-color: #000038;
    border-bottom-color: #000038;
    border-width: 5px;
}
h1 {
}
.general-about {
    background-color: navy;
    font-size: 25px;
    color: yellow;
    font-weight: bold;
    font-family: 'Lucida Handwrighting', cursive;
    height: 150px;
    overflow: auto;
    border-style: inset;
    border-top-color: #000038;
    border-left-color: #000038;
    border-right-color: blue;
    border-bottom-color: blue;
    border-width: 5px;
    padding: 5px;
    margin-bottom: 5px;
}
.mood {
    font-family: monospace;
    font-size: 17px;
    font-weight: bold;
    color: red;
    background-color: navy;
    border-style: inset;
    border-top-color: #000038;
    border-left-color: #000038;
    border-right-color: blue;
    border-bottom-color: blue;
    border-width: 5px;
    padding: 5px;
    margin-bottom: 5px;
    margin-top: 5px;
}
.mood a {
    font-family: sans-serif;
    color: darkorange;
}
.mood a:hover {
    background-color: blue;
    text-decoration: none;
    color: yellow;
    font-size: 15px;
    font-family: cursive;
    border-style: outset;
    border-top-color: blue;
    border-left-color: blue;
    border-right-color: #000038;
    border-bottom-color: #000038;
    border-width: 5px;
    padding: 5px;
}
.mood a:active {
    background-image: url("https://cutewallpaper.org/21/geocities-backgrounds/Index-of-The-Codex-of-Ultmate-Wisdomwwwgeocitiescom-.gif");
    text-decoration: none;
    color: yellow;
    font-size: 15px;
    font-family: cursive;
    border-style: inset;
    border-right-color: blue;
    border-bottom-color: blue;
    border-left-color: #000038;
    border-top-color: #000038;
    border-width: 5px;
    padding: 5px;
}
.contact .heading {
    color: red !important;
    background-image: url("https://64.media.tumblr.com/61bbb5ddd87c5a4f502cd655e07f8999/e9e22e92578d6d23-b2/s250x400/489d410aa581da50d4fc70ad9650be21b0df6e8a.png") !important;
    border-style: outset;
    border-width: 5px;
    border-color: green;
}
.contact {
    border-style: inset !important;
    border-right-color: blue !important;
    border-bottom-color: blue !important;
    border-left-color: #000038 !important;
    border-top-color: #000038 !important;
    border-width: 5px !important;
    margin-top: 5px;
}
.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 {
    content: url("https://mycie.neocities.org/spaceheyfriends3.png");
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
    content: url("https://mycie.neocities.org/spaceheymessage.png");
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
    content: url("https://mycie.neocities.org/spaceheyim.png");
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
    content: url("https://mycie.neocities.org/spaceheygroup.png");
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
    content: url("https://mycie.neocities.org/spaceheyfavorites.png");
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
    content: url("https://mycie.neocities.org/spaceheyforward.png");
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
    content: url("https://mycie.neocities.org/spaceheystop.png");
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
    content: url("https://mycie.neocities.org/spaceheystop.png");
}
.contact a {
    font-family: monospace;
    font-size: 11px;
    color: orange;
}
.url-info {
    background-image: url("http://4.bp.blogspot.com/-5k_7_FEdMrQ/UlAXnsxGHCI/AAAAAAAACYA/UuXkei0lRDM/s1600/Water_WaveAnimation_16frames_TestRippling_6_Smear.gif");
    color: green;
    height: 32px;
    overflow: auto;
    border-style: inset !important;
    border-right-color: blue !important;
    border-bottom-color: blue !important;
    border-left-color: #000038 !important;
    border-top-color: #000038 !important;
    border-width: 5px !important;
}
.table-section .heading {
    color: green !important;
    background-image: url("https://64.media.tumblr.com/34563ad91dd05ff0d2b206e0f4eacf83/3930eb25d2f43a09-de/s400x600/51739d4d248772e98abb140ffec988cb42640824.png") !important;
    border-style: outset;
    border-width: 5px;
    border-color: purple;
}
.table-section {
    border-style: inset !important;
    border-right-color: blue !important;
    border-bottom-color: blue !important;
    border-left-color: #000038 !important;
    border-top-color: #000038 !important;
    border-width: 5px !important;
}
.table-section td {
    color: yellow !important;
    background-image: url("https://64.media.tumblr.com/2e7f08cd71779a667d60815661f05a2d/782d8db93ae19c51-52/s250x400/41ca5bf24a2f60dfb4949ec17a242712cd433d05.png") !important;
    border-style: outset;
    border-width: 5px;
    border-color: red;
}
.blog-preview {
    background-image: url("http://4.bp.blogspot.com/-5k_7_FEdMrQ/UlAXnsxGHCI/AAAAAAAACYA/UuXkei0lRDM/s1600/Water_WaveAnimation_16frames_TestRippling_6_Smear.gif");
    height: 100px;
    overflow: auto;
    color: purple;
    font-weight: bold;
    border-style: inset !important;
    border-right-color: blue !important;
    border-bottom-color: blue !important;
    border-left-color: #000038 !important;
    border-top-color: #000038 !important;
    border-width: 5px !important;
    padding-bottom: 5px;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 0px
}
.blog-preview h4 {
    background-image: url("https://64.media.tumblr.com/c528a7473d96627eb790c0385c20e4c5/782d8db93ae19c51-e7/s400x600/1f86a3f567229aa340e373c45ac3b791a44686cb.png");
    color: yellow;
    font-family: monospace;
    font-weight: bold;
    font-size: 14.96px;
    border-style: outset;
    border-width: 5px;
    border-color: yellow;
    padding: 5px;
    margin: 0px;
}
.blog-preview h4 a {
    color: orange;
    font-family: cursive;
}
.blurbs .heading {
    overflow: auto;
    background-image: url("https://64.media.tumblr.com/f52ddf6a216fdc5fb9d4eca8f27c8eec/782d8db93ae19c51-b2/s250x400/62877c4fd5d3b407c3d742a0c2f0ff774687b2ae.png") !important;
    color: navy !important;
    border-style: outset;
    border-color: purple;
    border-width: 5px;
}
.blurbs {
    height: 200px;
    overflow: auto;
    color: white;
    font-family: sans-serif;
    font-weight: bold;
    background-image: url("https://images-ext-2.discordapp.net/external/Hgjba2Q2sNKlMy6o9DHuigWN8_eWXFlq2Vo9h1h90U8/https/i.gifer.com/13wV.gif");
    border-style: inset;
    border-right-color: blue;
    border-bottom-color: blue;
    border-left-color: #000038;
    border-top-color: #000038;
    border-width: 5px;
    
}
.profile .blurbs .section h4 {
    color: blue;
    font-family: cursive;
    font-weight: bold;
    font-size: 25px;
}
.friends .heading {
    color: white !important;
    background-image: url("https://i.gifer.com/origin/4a/4a9789a735929cb1bfc7e3d08a853546_w200.gif") !important;
    border-style: outset;
    border-color: darkgrey;
    border-width: 5px;
}
.friends {
    background-image: url("https://64.media.tumblr.com/bb1aeeab06592215f61a6bbcbac0a9bc/782d8db93ae19c51-3e/s250x400/8f09d7caccde4f2a32749c663a34ac8524727ab1.png");
    border-style: inset;
    border-right-color: blue;
    border-bottom-color: blue;
    border-left-color: #000038;
    border-top-color: #000038;
    border-width: 5px;
}
.friends b {
    color: purple;
    font-size: 24px;
}
.comments-table td {
    background-color: magenta;
    border-style: inset !important;
    border-color: purple !important;
    border-width: 5px;
}
.comments-table td:first-child {
    background-color: magenta;
    border-width: 5px;
}
</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 181 comments ( View all | Add Comment )

karalupin	1744390085 usingg Report Comment
.	1743400694 using Report Comment
blurry_cat1	1742764613 ITS WONDERFUL!! it gives me arcade games vibes or old youtube vibes kinda??? maybe Ill use it in future but for sule Ill love it smm!!! Report Comment thank you !! by myc; 1742827835; Report
glittrgutzz	1739429902 usingggg Report Comment
Amnesia's skibidi space	1738233439 usssinng!!! Report Comment
shaddaischild	1737493596 using :) Report Comment
shaddaischild	1737493596 using :) Report Comment
shaddaischild	1737493596 using :) Report Comment
shaddaischild	1737493592 using :) Report Comment
vxl~tine	1737430820 using Report Comment
sara	1737305711 using Report Comment
goosegoose	1737263023 using this is so sigma Report Comment
Astero	1736136930 using :D Report Comment
Hiwi	1736126408 using Report Comment
Ph0neztheCRYPiTD!	1735886658 Using Report Comment
pPaloom	1735786034 Using!! Report Comment
bertie	1733164750 Using! :) Report Comment
weirdoX)	1732634747 this is super cool, using! Report Comment
zerhoeee	1730065870 using!!! Report Comment
juanitogaymer	1729531401 Using Report Comment