SpaceHey 2010s

Tags: layout, 2010s, facebook, modern, simple

Description:

A 2010s inspired layout for your SpaceHey profile :3 If you use this layout, comment below!

Preview:

click on the image for a larger preview

Code:

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

<style>
/*CUSTOMIZE PROFILE*/

/*PROFILE BANNER INSTRUCTIONS - This is your profile banner. To keep with the style if you're making a banner, the dimensions are included in the sample art. But your image should automatically crop into the correct size. To change your banner, where it says "background-image", you want to copy the image address of your desired image, and paste it after the ' in the brackets. Make sure there is a ' before and after your url.*/

main:before {
	width: 100%;
	height: 300px;
	display: block;
	content: "";
	background-image: url('https://media.discordapp.net/attachments/473079589367840778/1144956097988407466/Space-Background-Image-3.jpg?width=984&height=655');
	background-position: center center;
	background-size: cover;
}
@media only screen and (max-width: 600px) {
	main:before{
		height: 200px;
	}
}
</style>

<style>
/*PROFILE BACKGROUND INSTRUCTIONS - Heres your profile background. Currently it is set ot the default color, but you can change this to any color you want by replacing the HEX code with a new one. Or alternitivley, add a URL in the URL section to add an image. If adding an image instead of a color, you may need to remove the color HEX code first so it doesnt overlap.*/

body {
background-color: #9da1b8;
}
body{
  background-image:url( );

background-attachment:fixed;background-size:cover; /* If you want your background to tile, remove this line */
<!-- (c) Background Image code created by Ashton (https://layouts.spacehey.com/layout?id=32100) -->

</style>




<style>
/*NON CUSTOMIZABLE ELEMENTS, ALTER AT OWN RISK.*/
.container > nav:nth-child(1) {
margin-left: -548px;
margin-right: -545px;
}
.container > main:nth-child(2) {
margin-top: 0px;
margin-left: -200px;
margin-right: -200px;
}

.profile-info {
border-left-width: 0px;
border-right-width: 0px;
margin-left: 550px;
}
.profile-info {
border-bottom-width: 0px;
border-top-width: 0px;
}
</style>

<style>
.details {
margin-top: -50px;
}

div.col:nth-child(3) > span:nth-child(1) > h1:nth-child(1) {
margin-left: 180px;
}
.details > p:nth-child(1) {
margin-right: 400px;
margin-top: 1px;
}
div.left:nth-child(1) {
margin-left: 325px;
}
.center > form:nth-child(1) {
margin-left: -220px;
margin-top: 10px;
}
.active {
margin-left: 340px;
}
</style>

<style>
.profile-pic {
margin-bottom: -105px;
}
.details {
margin-top: -190px;
}

</style>

<style>
.details > p:nth-child(2) {
margin-top: 20px;
}
.details > p:nth-child(1) {
margin-top: 33px;
}
.profile-pic > img:nth-child(1) {
margin-top: -20px;
}
.blog-preview {
margin-top: -55px;
}
.logout-btn {
margin-right: 345px;
margin-left: -;
}
.center > form:nth-child(1) {
margin-top: 1px;
margin-top: 23px;
}
}
</style>
<style>
nav .top {
background: #3B599A;
}
nav .links {
background-color: #1F4189;
}
main {
background: #E7EBF2;
}
</style>

<style>
.profile .blurbs .heading, .profile .friends .heading {
background: #3B599A;
}
.profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {
background: #3B599A;
}
:root {
--lighter-blue: #BFBFC6;
}
.details-table td:first-child {
background: #A1BADA;
}
.details-table td:first-child {
color: #475C97;
}
.profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {
color: #dbddef;
}
.profile .blurbs .heading, .profile .friends .heading {
color: #dbddef;
}
.profile .blurbs .section h4 {
color: #475C97;
}
:root {
--lightest-blue: #DBE7FF;
}
.comments-table td, .music-table td {
background: #E6F8DD;
}
.comments-table td:first-child, .music-table td:first-child {
background: #A0C99C;
}
</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 41 comments ( View all | Add Comment )

karina	1777582506 usingg!! Report Comment
CUTTHROAT CALTASTROPHE 🦴🕸️	1777251656 using!!!! this is so kyoot!! Report Comment
OLLIE	1770487696 USIN >:) Report Comment
earth2audi	1769454578 Using Report Comment
Anna<3	1767619136 using :) Report Comment
sonii	1767500630 Using:)) Report Comment
deepfried	1764540812 using Report Comment
deepfried	1764540810 using Report Comment
spence2cyan	1763527860 using!! Report Comment
zenn	1758463445 Using. Report Comment
★-ცƖųŋɛཞɖ-★ [MOVED]	1757007153 using! Report Comment
Wavey Joe	1755727146 the cover photo portion of the code is broken!! i've been doing my best to try and fix it myself but no matter what i do the image won't appear. the links to the photos i know for sure aren't broken; pls fix this if you still can!! Report Comment
emmalineainsley	1752292126 using! Report Comment
jayden	1751957006 usign Report Comment
Izzy<3	1746581173 using, tysm :D Report Comment
Eridan	1742971084 using ^0^ Report Comment
briefkase	1737002430 using :p Report Comment
liana678	1736995379 im going to use this Report Comment
liana678	1736995378 im going to use this Report Comment
cabraliciano	1735789322 usinglyly Report Comment