Glitched Retro Box

Tags: gif, glitch, 90s, minimalist, rainbow, retro, windows, vintage, vaporwave, cybercore

Description:

Welcome and thank you for checking out my first layout! Glitched Retro Box is a layout that will capture the hearts of any users who feel nostalgic for yet disillusioned about old internet culture and aesthetics. It's a cynical throwback to the simplicity that would later lead us to the overwhelming complexity of today's technology. I used a few elements from the following layouts to achieve the look: Windows 3 by asscastle at https://layouts.spacehey.com/layout?id=18686 and Windows 98 inspired by Rio at https://layouts.spacehey.com/layout?id=4075. I also dug up several other elements to create a more unique piece of coding. While this layout makes for an excellent desktop experience, it also looks good on mobile. It takes a more minimalist approach with a flair for a dynamic piece of virtual art. Feel free to use as long as the rightful creators get their credit. Enjoy!

Preview:

click on the image for a larger preview

Code:

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



<style>
@import url('https://fonts.googleapis.com/css2?family=DM+Sans&display=swap');
body {
    font-family: 'DM Sans';
    background: url(https://i.postimg.cc/pdm7dgHm/waves.gif);
}
div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4),
div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) {
    display: none;
}

   .comments-table{display:none !important;} 
   .friends-grid{display:none !important;} 

.blurbs .inner .section:nth-of-type(2) {
display: none;
}

body a,
body a:link,
body a:visited {
  color: #0000AF;
}

body a:hover,
body a:active {
  color: red;
}

.more,
.blog-preview h4 a,
nav .top a {
  color: white !important;
}

main {
  background: none;
}

.profile .contact .heading,
.profile .table-section .heading,
.home-actions .heading,
.col.w-40 h1,
.profile .blurbs .heading,
.profile .friends .heading,
.blog-preview h4 {
  margin: 0;
  background: #0000AF;
  color: white;
  font-size: 13px;
  text-align: center;
  height: 19px;
  border-bottom: 1px solid black;
  background-image: url(https://i.imgur.com/vKWtNvj.png);
  background-repeat: no-repeat;
  font-smooth: never;
  -webkit-font-smoothing: none;
}

.profile .contact,
.profile .url-info,
.profile .table-section,
.home-actions,
.col.w-40,
.blog-preview,
.profile-info,
.blurbs,
.friends,
footer {
  border-style: solid;
  border-width: 2px;
  border-image: url(https://i.imgur.com/PVgfljI.png) 10 / 10px;
  background-color: white;
}

.profile .contact,
.profile .url-info,
.profile .table-section,
.home-actions,
.blog-preview,
.profile-info,
.blurbs,
.col.w-40,
.friends,
footer {
  padding: 2px;
}

.profile .contact .heading,
.profile .table-section .heading,
.home-actions .heading,
.profile .blurbs .heading,
.profile .friends .heading,
.blog-preview h4 {
  padding: 0 0 0 19px;
}

.profile .contact .heading h4,
.profile .table-section .heading h4,
.profile .blurbs .heading h4,
.profile .friends .heading h4,
.blog-entry .comments .heading h4,
.bulletin .comments .heading h4,
.home-actions .heading h1,
.statistics .heading h4,
.profile .blurbs .heading,
.profile .friends .heading,
.blog-preview h4 {
  vertical-align: middle;
}

.friends {
  margin: 20px 0;
}

.contact .inner img {
  display: none;
}

.contact .inner a {
  display: block;
  text-align: center;
  padding: 5px 0 5px 0;
}

.contact .inner a:link,
.contact .inner a:visited {
  color: black;
  font-weight: normal;
}

.contact .inner {
  margin-right: 14px;
}

.contact .inner a:hover {
  color: white;
  background-color: #0000AF;
  font-weight: bold;
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a::before {
  display: block;
  content: url("https://win98icons.alexmeub.com/icons/png/laptop_infrared_2-5.png");
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a::before {
  display: block;
  content: url("https://win98icons.alexmeub.com/icons/png/standby_monitor_moon-3.png");
}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a::before {
  display: block;
  content: url("https://win98icons.alexmeub.com/icons/png/laptop_infrared_2-5.png");
}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a::before {
  display: block;
  content: url("https://win98icons.alexmeub.com/icons/png/standby_monitor_moon-3.png");
}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a::before {
  display: block;
  content: url("https://win98icons.alexmeub.com/icons/png/laptop_infrared_2-5.png");
}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a::before {
  display: block;
  content: url("https://win98icons.alexmeub.com/icons/png/standby_monitor_moon-3.png");
}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a::before {
  display: block;
  content: url("https://win98icons.alexmeub.com/icons/png/laptop_infrared_2-5.png");
}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a::before {
  display: block;
  content: url("https://win98icons.alexmeub.com/icons/png/standby_monitor_moon-3.png");
}

button {
  border-style: solid;
  border-image: url(https://i.imgur.com/qTuvI3M.png) 3 / 3px;
  background-color: #C0C0C0;
  font-weight: bold;
}

button:active {
  border-image: url(https://i.imgur.com/MpBJ7aD.png) 3 / 3px;
}

.details-table td,
.details-table td:first-child {
  background: #C0C7CF;
  color: black;
  border-width: 1px;
  border-color: black;
  border-style: solid;
}
div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(3),
div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(3) {
    display: none;
}
div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(5),
div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(5) {
    display: none;
}
div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(5),
div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(5) {
    display: none;
}
div.table-section:nth-child(6) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(6),
div.table-section:nth-child(7) > div:nth-child(2) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(6) {
    display: none;
}

.top {
  background: #!important;
}

.links {
  background: white;
  height: 5 px;
}

nav {
  border-style: solid;
  border-color: black;
  border-width: 0 1px 1px 1px;
}
</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 9 of 9 comments ( View all | Add Comment )

Betho	1731107456 uzing! Report Comment
yung frescofresh ^-^	1730945168 wavy. ima use this Report Comment
star ! ★	1720317845 usingg ^_^ Report Comment
CyberspaceSabbath	1717780847 using! Report Comment
iamademon	1716916838 using Report Comment
W1LLIAM	1709719870 USING!! Report Comment
scratlies	1700063287 USING THANKSS Report Comment
Drnuuz	1692415240 Swet I'm gon saev thsi Report Comment
trız	1691812709 I love it! Report Comment