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

Drone	1701353007 I like it, not overbearing like most others! Using it right now! Report Comment
cacakyla	1699861574 using tyy Report Comment
𝙉𝘢𝘨𝘪𝘴𝘢 Shingetsu	1697987719 using Report Comment
deftones!	1695571718 using :) Report Comment
Venus	1695241173 using, thanks :) Report Comment
rye ♱	1693635412 using !! Report Comment
☆ isabel	1692743064 using Report Comment
Butters!! ★ (editing)	1692436796 Using Report Comment
clifford	1692272739 using!!! Report Comment
Max	1692065486 using! Report Comment
lula	1691463787 using, thanks <33 Report Comment
liam :3	1690038135 Using! Report Comment
clydeborg	1689875979 using B) Report Comment
fishor	1689866320 using! Report Comment
ZACzac	1689782417 USING, thank yIU Report Comment
Fancy	1688815627 using Report Comment
Seven	1688342741 Using! Report Comment
M4 SOPMOD II	1688336203 I'm using this Report Comment
bina ♡.。	1688159686 using this ♡ Report Comment
mar.	1686239787 using! this layout is so pretty <3 Report Comment Thanks ! by poppyp; 1686265741; Report np by mar.; 1686668847; Report