Windows 98

Tags: windows, web, old web, webcore, 90s, blue

Description:

A layout I made inspired by the old web aesthetic!

Feel free to change anything on this! Customize it as much as you want :]

I'm no expert at coding (I'm self taught- I still look up how to center divs), so good luck if you want to change anything in the code lmao.

This isn't perfect, by the way. I might change some things in the future. Please leave a comment when using! I'd love to see y'alls profiles :] (Feel free to add me too! I always accept friend requests ^^)

Edit: Thank you all so much for the support on this! I didn't expect a lot of people would like this, so I'm sorry if I couldn't reply to all of you

Also, I'm not very active on this website so if y'all have any questions, feel free to send me a dm on my discord holyshxtangel

Update 11/17/21: Removed the knife cursor that shows up whenever you hover on a link. Forgot to remove that cause it was the cursor I had when I used this layout, my bad!

Update 7/31/23: I haven't been on this website for a while now but HOLY SHIITTTT thanks for the love on this!! I never expected this to be on the popular layouts but what the fuck it just did!!!! I literally read all 500+ comments on this LMAO but thanks y'all <3

Update 10/24/25: I CAN'T READ ALL OF THE COMMENTS ANYMORE WTF HOW ARE THERE SO MANY PEOPLE LMFAO 😭😭

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Angel Is Pretty. Odd. (https://layouts.spacehey.com/layout?id=4188) -->

<style>

    @import url('https://fonts.googleapis.com/css2?family=Libre+Franklin:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
    
    body {
        /* background-image: url(https://i.pinimg.com/564x/24/d7/a9/24d7a917bd39cb046a807e01b69dac54.jpg); */
        background-color: #007f7e;
        background-attachment: fixed;
        font-family: Libre Franklin;
        font-size: 17px;
    }
    
    /* width */
    ::-webkit-scrollbar {
        width: 20px;
    }

    /* Track */
    ::-webkit-scrollbar-track {
          background: #dcdedf;
    }

    /* Handle */
    ::-webkit-scrollbar-thumb {
        background: #bec7c9;
        border: 2px outset;
    }

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #b5bdbf;
    }
   
    p {
        color: #000;
        font-weight: 500;
    }
    
    h1, h2, h3, h4, h5, h6 {
        font-size: 12px;
        font-weight: 600;
        color: #fff;
    }

    :root {
        --logo-blue: #cfccc2;
        --darker-blue: #0000ff;
        --lighter-blue: #cfccc2;
        --even-lighter-blue: #cfccc2;
        --lightest-blue: #cfccc2;
        --dark-orange: #dc2b31;
        --light-orange: ;
        --even-lighter-orange: ;
        --green: #000;
    }
    
    nav {
        margin: 10px;
    }
    
     nav .links:before {
        display: block;
        padding-left: 5px;
        padding-bottom: 1px;
        border-bottom-style: groove;
        background-image: url(https://i.imgur.com/CKX2NUO.png), linear-gradient(to right, #0c1058, #adcbe1);
        background-repeat: no-repeat;
        background-position: right;
        font-weight: 600;
        content: "spacehey - Microsoft Internet Explorer";
    }
    
    .top {
        color: transparent !important;
        height: 0 !important;
        background-color: transparent !important;
    }
    
    .top .left {
        display: none !important;
    }
    
    .top .center {
        display: none !important;
    }
    
    .search-wrapper{
        display: none !important;
    }
    
    .top .right {
        display: none !important;
    }
    
    .logout-btn{
        display: none !important;
    }
    
    .top a{
        color: transparent !important;
    }
    
    nav .links {
        border-style: outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
        padding: 0 0 3px 0;
    }
    
    nav .links a{
        font-size: 10px;
        color: #000;
        padding: 7px;
        font-weight: 500;
    }

    main {
        background: transparent;
        margin: 10px auto 10px auto;
    }
    
    .col.w-40.left h1{
        border-style: outset outset none outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
        background-image: url(https://i.imgur.com/CKX2NUO.png), linear-gradient(to right, #0c1058, #adcbe1);
        background-repeat: no-repeat;
        background-position: right;
        margin-bottom: 0;
    }
    
    .profile h1 {
        padding-left: 5px;
        font-family: Libre Franklin;
        font-size: 12px;
    }
    
    .col.w-40.left .general-about p{
        margin: 0;
        background: #cfccc2;
        font-weight: 500;
        color: #000;
    }
    
    .general-about {
        height: 178px;
        border-style: groove outset outset outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
        background: #cfccc2;
        margin-top: 0;
        font-family: Times New Roman;
    }
    
    .general-about .profile-pic img {
        margin: 5px;
        height: 200px;
    }

    .general-about .details {
        margin-top: 15px;
    }

    .mood {
        border-style: outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
        background: #cfccc2;
        margin: 10px auto ;
    }

    .mood:before {
        display: block;
        padding-left: 5px;
        margin: 1px;
        border-bottom-style: groove;
        background-image: url(https://i.imgur.com/CKX2NUO.png), linear-gradient(to right, #0c1058, #adcbe1);
        background-repeat: no-repeat;
        background-position: right;
        font-weight: 600;
        font-size: 12px;
        color: #fff;
        content: "Mood";
    }
    
    .mood p{
        font-family: Times New Roman;
        color: #000;
        padding: 5px 5px 0px 5px;
    }
    
    .profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
        border-bottom-style: groove;
        background-image: url(https://i.imgur.com/CKX2NUO.png), linear-gradient(to right, #0c1058, #adcbe1);
        background-repeat: no-repeat;
        background-position: right;
        padding: 0px 6px;
        margin: 1px;
    }
    
    .profile .contact, .profile .url-info, .profile .table-section, .home-actions {
        border-style: outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
    }
    
    .contact {
        background: #cfccc2;
    }
    
    .url-info {
        background: #cfccc2;
    }
    
    .url-info p{
        font-family: Times New Roman;
        color: #000;
    }
    
    .details-table {
        background: #cfccc2;
    }
    
    .table-section {
        background: #cfccc2;
    }
    
    .details-table td {
        border-bottom-style: groove;
        padding: 1px 2px;
    }
    
    .details-table p {
        font-family: Times New Roman;
        color: #000;
    }
    
    .profile-info {
        border-style: outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
        background: #cfccc2;
    }
    
    .blog-preview {
        border-style: outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
        background: #cfccc2;
    }
    
    .blog-preview h4 {
        border-bottom-style: groove;
        background-image: url(https://i.imgur.com/CKX2NUO.png), linear-gradient(to right, #0c1058, #adcbe1);
        background-repeat: no-repeat;
        background-position: right;
        padding-left: 5px;
        margin: 1px;
    }
    
    .blog-preview p {
        margin: 5px;
        font-family: Times New Roman;
        color: #000;
        font-weight: 500;
    }
    
    .blurbs {
        background: #cfccc2;
        border-style: outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
    }
    
    .profile .blurbs .heading {
        border-bottom-style: groove;
        background-image: url(https://i.imgur.com/CKX2NUO.png), linear-gradient(to right, #0c1058, #adcbe1);
        background-repeat: no-repeat;
        background-position: right;
        padding: 0 0 0 5px;
    }
    
    .profile .blurbs .section h4 {
        color: #000;
        padding: 0px;
        font-weight: 600;
    }
    
    .profile .blurbs .inner {
        font-family: Times New Roman;
        padding: 2 0;
    }
    
    .friends {
        border-style: outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
        background: #cfccc2;
        margin-bottom: 20px;
    }
    
    .profile .friends .heading {
        border-bottom-style: groove;
        background-image: url(https://i.imgur.com/CKX2NUO.png), linear-gradient(to right, #0c1058, #adcbe1);
        background-repeat: no-repeat;
        background-position: right;
    }
    
    .profile .friends .heading a {
        padding-right: 50px;
    }
    
    div.friends:nth-of-type(3) > div.inner:nth-child(2) > p:first-child > b:first-child {
        font-family: Times New Roman;
        color: #000;
    }
    
    .profile .friends .inner {
        background: #cfccc2;
    }
    
    #comments .inner {
        height: 1000px;
        overflow: auto;
    }
    
    #comments > div.inner:nth-child(2) > p:first-child > b:first-child {
        font-family: Times New Roman;
        color: #000;
    }
    
    .comments-table td {
        border-style: none groove groove none;
        border-width: 3px;
        font-family: Times New Roman;
    }
    
    .comments-table td * {
        font-family: Times New Roman;
        color: #000;
    }
    
    footer {
        border-style: outset;
        border-width: 2px;
        border-color: #fff #000 #000 #fff;
        background: #cfccc2;
        margin-bottom: 20px;
    }
    
    footer p {
        color: #000;
    }

</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 2741 comments ( View all | Add Comment )

coffeeshopfangirl	1764595037 Using :D Report Comment
leopold	1764524681 using! Report Comment
letuogmihn	1764470092 using !!! Report Comment
Celebrating	1764446642 Using!:) Report Comment
CrayolaDud33333	1764324966 using !!! >:DDD Report Comment
kiwi	1764292141 using !! Report Comment
Chexmoony	1764273772 This layout is SO good!!!gives 90s-2000s internet Report Comment Using by Chexmoony; 1764273779; Report
tw_kaby	1764261512 using. Report Comment
jess :03	1764217718 using !!! :0333 Report Comment
snow white	1764205776 i don't really remember if i commented that i was using it, but, here i go just in case. using!!!1 Report Comment
neon	1764123952 Using!! Report Comment
bads	1764110406 I AM USING THIS RIGHT NOW. APPRECIATED. THIS IS AFFECTING ME POSITIVELY AND I WILL BE USING IT UNTIL FURTHER NOTICE. I AM VERY GRATEFUL FOR ALL OF THE WORK AND EFFORT PUT INTO YOUR ART AND THE CODING SKILL REQUIRED TO DEDICATE MINUTES--HOURS OF YOUR TIME TO MAKING SUCH A COMPLEX AND UNIQUELY INSPIRED THEME. IT IS VERY, VERY NICE OF YOU TO RELEASE YOUR THEME TO THE PUBLIC AND I AM SURE THAT ME AND MANY OTHERS ALONGSIDE MYSELF WILL HEAVILY MAKE GREAT USE OF THIS WEBSITE FORMAT. Report Comment
kenerie	1764066790 stealing this thank uuuuu!! Report Comment
gonzo	1764046979 usedddd Report Comment
Liam.xx.2	1763979732 Using<333 Report Comment
Liam.xx.2	1763979731 Using<333 Report Comment
CeynowaPina1	1763942569 using! :] Report Comment
CeynowaPina1	1763942569 using! :] Report Comment
¡Ditto!	1763916429 using!! Report Comment
lola	1763867217 usinggg :p Report Comment