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

Foxxie28	1730600518 using! Report Comment
Lemony	1719592098 Using!! :3 Report Comment
cr0wluvr	1719418305 Using Report Comment
Kara_Ww	1716485289 usandooo Report Comment
fuckeduptrampstamp	1716451542 using Report Comment
Jaxon	1713758363 Absolutely using! Report Comment
cr0wluvr	1713574298 Using! Report Comment
♱ Natalie ♱	1711934329 USINGGG!!! Report Comment
REINA	1710743656 this is awesome! using Report Comment
Dr.Cheez12	1698108679 Using Report Comment
TRISTAN	1697401649 USING!!!!!!!! Report Comment
kittykat ｡೨⋆	1695254210 using!! BTW I LOVE THS LAYOUT!!! SUPER NOSTALGIC :) Report Comment
^,..,^	1694999622 using! Report Comment
julianna	1694540767 using :) Report Comment
Mik	1694187764 Using, thanks! Report Comment
Nanami	1693593454 Using!! Report Comment
𝜗𓏲 han	1693502848 USING Report Comment
SAM !! :P	1693486183 USINGGGGGG Report Comment
friend creature	1693354133 Using! Report Comment
Reigen Arataka	1693326633 Using.)) Report Comment