Spacehey 2.0 Matte

Tags: simple, layout, blue, 2000s, layouts, myspace

Description:

Thanks for checking out my layout! This layout is inspired by the original MySpace 2.0 look and feel. Shout-out to Yoshi for their lovely suggestion! I never thought to make something like this, so half the credit goes to them for the idea!

This is incredibly messy because I couldn't be bothered let's be real. I know I call all my layouts messy, but this one is the messiest on God. I made it in like, 30 minutes because I was inspired by the request. Actually, I had Pokemon Colosseum running in the background the whole time. That's how distracted I was during the creation of this layout.

F.A.Q

"Do I have to credit you?"

- No, this layout is free to use, edit, and dissect. If you claim it as yours, then that's something you'll have to deal with. Not me. I do appreciate credit, though!

"Where do I ask you for help with editing/reading the code?"

- You can email me or you can leave a comment here. Please don't add me just to leave a comment on my profile asking for help with CSS; it's just impolite. If you're going to friend me to ask for help, at least be secretive about it and IM me instead of making our convo public.

Preview:

click on the image for a larger preview

Code:

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

<style>

:root {
	--dark-orange: #2c63a2;
}

body {
background: #88b4e3;
}

/* Top Bar Colors */

.top, ul.links {
border-left: 1px solid #1b4282;
border-right: 1px solid #1b4282;
box-shadow: 0px 1px 1px #1b4282;
}

ul.links {
border-bottom: 1px solid #1b4282;
}

nav .top, nav .links, .top ul .links {
	background: linear-gradient(#2456b2, #1b4490);
}

nav .top .left .logo {
	height: 30px;
  	left: -25px;
  	position: relative;
}

nav .links {
	box-shadow: 0px 1px 0px #3565bd inset;
  	margin: 0;
    padding: 0;
  	font-size: 0;
}

nav .links .icon {
	display: none;
}

nav .links li::after {
	display: none;
}

nav .links li {
  	padding: 6px;
	border-right: 1px solid #1b4490;
  	font-family: verdana;
}

nav .links li:hover {
	background: linear-gradient(#1b4490, #2456b2);
}

nav .links a {
       text-shadow: none;
}

nav .links a:hover {
	text-decoration: none;
  	color: white;
  text-shadow: none;
}

nav .links li.active a {
  font-weight: normal;
}

/* Search Bar */
.center label {
	display: none;
}

input#q {
	 border: solid 1px #1e4995;
	 border-radius: 4px;
}

button {
 background: linear-gradient(#fdfdfd, #dcdcdc);
 border: solid 1px #1e4995;
 border-radius: 4px;
 padding: 3px;
 font-family: verdana;
 color: #5570a6;
 font-size: 9px;
}

/* Profile Box */

main {
	background: none;
  font-family: verdana;
  font-size: 11px;
}

main a,  .profile .contact .heading, .profile .table-section .heading, .home-actions .heading, .count {color: #2c63a2;}
main a:hover {color: #2a477e;}

div.row.profile, .profile .contact, .profile .url-info, .profile .table-section, .home-actions {
	background: white;
  	border: 1px solid #c1c1c1;
  	border-radius: 6px;
}

.profile-info {
	background: linear-gradient(#a0b9d6, #819ebe);
  	color: white;
  	border: 1px solid #c1c1c1;
  	border-radius: 6px;
    height: 50px;
}

.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
	background: linear-gradient(#f9f9fc, #e3e7ea);
  	border-bottom: 1px solid #c1c1c1;
  	border-radius: 6px 6px 0px 0px;
}

.general-about .profile-pic, .general-about .profile-pic img {max-height: 120px;}

.profile .table-section, .home-actions {
background: linear-gradient(#e9eef2, white);
}

.details-table td {
  	border: 1px solid #c1c1c1;
  	background: white;
  	padding: 2px;
}

.details-table td:first-child {
  	background: #e3e7ea;
  	padding: 1px;
  	color: black;
  	font-size: 10px;
}
/* header settings */

.profile .blurbs .heading, .profile .friends .heading {
	background: linear-gradient(#a0b9d6, #819ebe);
  	color: white;
    padding: 5px;
  	border-radius: 5px 5px 0px 0px;
}

.blurbs .inner, .friends .inner {
  	border-left: 1px solid #dcdcdc;
    border-right: 1px solid #dcdcdc;
}

.friends {margin-bottom: 15px;}

/* iMAGESSSS */

.profile img:not(.icon) {
  	border: 1px solid #c1c1c1;
}

/* comments */

.comments-table td:first-child {
	background: linear-gradient(#e9eef2, white);
}
.comments-table td {
	background: white;
  	padding: 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 39 comments ( View all | Add Comment )

fancy :3	1713908825 using lol Report Comment
JONAH !	1711939148 awesome sauce Report Comment
9907121208	1710058206 using Report Comment
pixiecel	1708357507 using Report Comment
SaoriXSlayer6	1706649613 using Report Comment
madi	1706344081 using!! Report Comment
ᯓ ᡣ𐭩𝒌𝒊𝒘𝒊	1706211858 Using! Report Comment
Lime★Soda	1706013835 using =3 Report Comment
SERAFiM	1702807703 Using :3 Report Comment
cringefail	1702073369 using Report Comment
Otter	1701998987 Usin!! I luv this layout its super casual! <3 Report Comment
kyan	1701932015 using:) Report Comment
Drone	1701353007 I like it, not overbearing like most others! Using it right now! Report Comment
cacakyla	1699861574 using tyy Report Comment
deftones!	1695571718 using :) Report Comment
Venus	1695241173 using, thanks :) Report Comment
rye ♱	1693635412 using !! Report Comment
SaoriXSlayer6	1692743064 using Report Comment
♱ Nikolai	1692436796 Using Report Comment
clifford	1692272739 using!!! Report Comment