City Nights

Tags: city, japan, pixel, cute, night, blue, cory, pacdude

Description:

cruise through this pixel nights. leave me a comment or friend me if you use this!

Preview:

click on the image for a larger preview

Code:

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

<style>@import url('https://fonts.googleapis.com/css2?family=Imbue:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');
:root {
	--yourBackground: url(https://media.giphy.com/media/Basrh159dGwKY/source.gif);
	--pageTexture: url(https://media.giphy.com/media/3o6vXRxrhj7Ov94Gbu/source.gif);
	--nameSticker: url(https://media.giphy.com/media/LSQfNcCH0uyiE5WY5v/source.gif);
	--blurbSticker: url(https://media.giphy.com/media/IzcacYwTkEpp8LMXig/source.gif);
	--commentsSticker: url(https://media.giphy.com/media/xT9IgIfPZruMR8YSty/source.gif);
	--interestSticker: url(https://media.giphy.com/media/9S1IwZASPfxIdLlnpx/source.gif);
	--urlInfoBox: url(https://media.giphy.com/media/9B7XwCQZRQfQs/source.gif);
	--titleTexture: url(https://media.giphy.com/media/KEATEV6uaagupaQEXW/source.gif);
	--linkTexture: url(https://media.giphy.com/media/qGWVA1zoivT7a/source.gif);
	--profileInfo: url(https://media.giphy.com/media/k81NasbqkKA5HSyJxN/source.gif);
}
.profile {
	font-family: 'Space Mono', monospace;
}
.profile .left h1 {
	font-family: 'Imbue', serif;
}
.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 {
	font-family: 'Imbue', serif;
}
body {
	background-image: var(--yourBackground);
	background-size: cover;
	background-attachment: fixed;
}
main {
	background-color: #F1B9E377;
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	margin-top: 2rem;
	margin-bottom: 2rem;
}
body:before {
	display: block;
	position: fixed;
	pointer-events: none;
	content: " ";
	height: 100vh;
	width: 100vw;
	top: 0;
	left: 0;
	right: 0;
	background-image: var(--pageTexture);
	background-size: cover;
	background-attachment: fixed;
	opacity: .1;
	z-index: 25;
}
.profile a {
	transition: all .1s!important;
}
.profile a:hover, .profile a:hover p {
	background: var(--linkTexture)!important;
	;
	color: #FFF!important;
	text-shadow: 1px 1px 0 #000!important;
	;
}
.profile .left h1 {
	text-transform: uppercase;
	font-size: 3rem;
	color: #FFF;
	text-shadow: 3px 3px 0 #67337C;
}
.profile .left h1:before {
	background-image: var(--nameSticker);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	height: 100px;
	width: 100px;
	content: " ";
	transform: rotate(-4deg) scale(1.7);
	position: absolute;
	z-index: -1;
}
.profile .right .blurbs {
	position: relative;
}
.profile .right .blurbs:after {
	background-image: var(--blurbSticker);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	height: 100px;
	width: 100px;
	content: " ";
	transform: rotate(-4deg) scale(2) translateY(-2rem);
	position: absolute;
	right: 0;
	z-index: -1;
}
.profile .left .table-section:nth-last-child(2):before {
	background-image: var(--interestSticker);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	height: 100px;
	width: 100px;
	content: " ";
	transform: rotate(-4deg) scale(1.7) translateX(-3em) translateY(2.5em);
	position: absolute;
	z-index: -1;
}
.profile .contact, .profile .url-info, .profile .table-section, .home-actions {
	border: 0!important;
	width: 100%;
}
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading, .profile .blurbs .heading, .profile .friends .heading {
	background-image: var(--titleTexture)!important;
	background-size: cover;
	background-position: center;
	color: #FFF;
}
.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 {
	text-transform: uppercase;
	font-size: 1.8rem;
}
.profile .url-info {
	border: 0;
	color: #FFF;
	background: var(--urlInfoBox);
	background-position: center;
	text-align: center;
}
.details-table td:first-child {
	background: none;
	width: fit-content!important;
	color: #FFF;
	text-shadow: 0px 2px 0 #000;
}
.details-table td:last-child {
	background: none;
	max-height: 150px;
	overflow-y: scroll;
	float: right;
}
.details-table tr {
	border-bottom: 1px solid #000;
}
.profile .blurbs .section h4 {
	color: #4D1469;
	font-size: 1.3rem;
}
.profile-info {
	background: var(--profileInfo);
	background-size: cover;
	background-position: center;
	box-shadow: -7px 8px 0 #0006;
	color: #FFF;
}
.profile-info h3 a {
	color: #FFF;
}
.comments-table, .details-table {
	border: 1px solid #0000;
	border-collapse: separate;
	border-spacing: 0 .5em;
}
.comments-table tr td:last-child {
	height: 250px;
	display: block;
	overflow-y: scroll;
}
.comments-table td, .music-table td {
	background: none;
	color: #000;
}
.comments-table tr {
	border-bottom: 1px solid #000;
}
.comments-table td:first-child, .music-table td:first-child {
	background: none;
	text-align: left;
}
.profile .comments-table:after {
	background-image: var(--commentsSticker);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	height: 100px;
	width: 100px;
	content: " ";
	transform: rotate(-4deg) scale(2) translateY(-3.5rem);
	position: absolute;
	right: 0;
	z-index: -1;
}
</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 156 comments ( View all | Add Comment )

lailah	1730749389 using <33 Report Comment
marsh	1728251676 using! Report Comment
leo	1728073731 thank you! im using it Report Comment
Lau	1727645463 using Report Comment
digitalhalo	1727637418 using! Report Comment
Linere	1725850697 using! Report Comment
jploshii	1724179708 using Report Comment
MENACE !!	1723936991 using!! Report Comment
MagicTheMagician	1723012284 usingggg Report Comment
Nickey Hall	1722305983 definitely using this!!! Report Comment
rojgrap	1721922394 usando Report Comment
Lau	1721303158 using ! :) Report Comment
KEL (─‿‿─)	1720220199 using!! Report Comment
MAG1C0	1719855700 Using!!! :3 Report Comment
Charly Yohan	1719717912 Usando uwu Report Comment
finnthesilly_ 1	1719116241 Usinnggg Report Comment
DreamingTemy	1718767115 using Report Comment
madison :3	1717648529 using Report Comment
starscream	1717606751 using Report Comment