Green Stars, Blue Borders (New: Animation)

Tags: green, blue

Description:

This layout will give you a green starry background, green text, and blue borders on your profile. If you want to use this, then please be sure to comment below, or add me. Thank you. Credit goes to p0libius for the Matrix layout that I used as a foundation for this one. Edit: This layout has now been updated with an animation to your profile. Include it if you want to.

Preview:

click on the image for a larger preview

Code:

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

<style>

body {
font-family: Courier New, monospace;
background:url(https://i.ibb.co/dDzXJ8c/imageedit-1-2315110080.jpg);
}

img {
filter: sepia(100%) hue-rotate(45deg) saturate(5);
}

body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}

.logo {
filter: sepia(100%) hue-rotate(45deg) saturate(10);
}

#q, button {
color: #00ff00;
background-color: black;
border: 1px solid #0000ff;
font-family: inherit;
}
p, i, b, .count {
color: #00ff00 !important;
}
a, .profile .friends .person p, .logout-btn {
color: #00ff00 !important;
text-decoration: underline !important;
}
.container {
margin: 0 auto 0;
}
.icon {
display: none;
}
nav, nav .links a {
color: #00ff00;
}
nav .top {
margin-top: 2px;
background: none;
background-color: black;
border: 2px dotted #0000ff;
border-bottom: none;
}
nav .links {
background-color: black;
border: 2px solid #0000ff;
}
main {
background: black;
color: #00ff00;
border-left: 2px dotted #0000ff;
border-right: 2px dotted #0000ff;
}
.heading, .url-info {
color: #00ff00 !important;
background: none;
background-color: black !important;
border: 2px solid #0000ff !important;
}
.inner {
color: #00ff00 !important;
border: 2px dotted #0000ff;
border-top: none;
}
.profile-info {
border: 2px solid #0000ff;
}
.profile-info .inner {
border: none;
}
.friends .inner {
border-bottom: none;
}
#comments {
border-bottom: 2px dotted #0000ff;
}
.profile .contact, .profile .table-section, .home-actions {
border: none !important;
}
.profile .contact .f-row:first-of-type {
margin-top: 0px;
padding-top: 7px;
}
.profile .blurbs .section h4 {
color: #00ff00 !important;
}
.details-table {
margin: 2px;
}
.details-table, td {
border: 1px solid #0000ff;
border-collapse: collapse;
}
td {
color: #00ff00 !important;
background: none;
background-color: black !important;
} 
table.details-table {
max-width: 98%;
}
.profile h1 {
font-size: 2em;
}
footer {
background: black;
border: 2px dotted #0000ff;
}
footer p {
color #00ff00 !important;
}
.comments-table {
border: none;
border-collapse: collapse;
}
.comment-replies {
border: 1px solid #0000ff;
margin: 2px;
}
nav .info {
background: none;
}

</style>

<!-- Optional code for an animation. Be sure to put this first portion in the "body::before" component, preferably below the "background" segment, and to take out the original "background-size" segment:

background-image: url(https://media4.giphy.com/media/v1.Y2lkPTc5MGI3NjExMHhjbWVxNXF5Y2x1ODczYXptdnRlN2hramJkZThsbmhrMnFkMjVmYiZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/3Mcr8xz550LHc35fn4/giphy.gif);
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
animation: yourAnimation 3s ease 0s 1 normal forwards;

Put this second portion below the "body::before" component:

@keyframes yourAnimation {
0.0% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; } 
}

-->

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

gucci morty	1789000849 hi im using this thank u for making it its gorgeous Report Comment
teddy	1785629254 using :) Report Comment
Xx_MARI_xX	1785166253 using Report Comment
Wet_dryer_lint	1784100277 This is so cute using!! Report Comment
Favio	1784065041 using! but i can't see my pfp at all, any idea why? :c Report Comment
★Venkious★	1784037855 using!! tysm for making this Report Comment oh i also hope u dont mind that i modified the code to make the blue into blue green instead, im js not a big fan of blue (esp if its bright like that). again, thank you for the layout! by ★Venkious★; 1784044275; Report
Ghostly	1783752659 using Report Comment
Megamaru MegaMegs	1782549122 cool Report Comment
spiralMasque	1780280052 using :⁰] Report Comment
finner_da_winner	1778081012 using))) Report Comment
sodacan235	1777235681 using !!!! Report Comment
twinArmageddons	1774987234 awesome! using for a while Report Comment
₊　˙ sky	1772328355 usiinggg !! ヾ(≧▽≦*) Report Comment
Spengus	1771956231 using this now, great work! it looks awesome Report Comment
PI55LORD	1771647432 Using this!!! I lov e it!1! :) Report Comment
kooky_taffy!	1769327210 Using!! It looks so RAWRSOME!! XD Report Comment
София умерла	1767869518 usando Report Comment
Ly	1766955688 usinggg Report Comment
Draven	1766735695 using Report Comment
CadmarFidelis	1765576231 using! Report Comment