Purple Gradient

Tags: purple, gradient, 2000s, sleek

Description:

I don't know about you but I miss gradients that made page elements pop off the page. So I made a layout for that! :D

Preview:

click on the image for a larger preview

Code:

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

<style>
@import url('https://fonts.googleapis.com/css2?family=Lekton:wght@400;700&display=swap');

main {
    background: black;
}

.profile .contact .heading, .profile .table-section .heading, .profile .blurbs .heading, .profile .friends .heading {
    display: block;
    background: linear-gradient(#990099, #000000);
    border-radius: 3px;
}

body {
    background: black;
    font-family: Verdana;
    font-size: 13px;
    color: mediumorchid;
}

p {
    font-family: Verdana;
    font-size: 11px;
}

a {
    color: mediumorchid;
}

a:hover, .count {
    color: orchid;
    font-style: bold;
    text-decoration: none;
}

.profile h1 {
    font-family: Verdana;
    text-align: center;
    font-size: 28px;
    color: mediumorchid;
}

h4 {
    font-family: 'Lekton';
    font-weight: 400;
    font-size: 16px;
    color: orchid;
}

nav .top {
    display: block;
    background: linear-gradient(#990099, #1a001a);
    border-radius: 3px;
}

#q {
    background-color: #eaaee8;
    border: 1px solid mediumorchid;
    border-radius: 3px;
}

button {
    background: linear-gradient(#990099, #1a001a);
    border: 1px solid #990099;
    border-radius: 3px;
    color: #eaaee8;
    text-shadow: 1px 1px 3px black;
}

label, .right, .right button {
    color: #eaaee8;
}

nav .links {
    display: block;
    background: linear-gradient(#990099, #000000);
    font-family: 'Lekton';
    font-weight: 400;
    font-size: 12px;
    text-align: center;
    border-radius: 3px;
}

nav .links a {
    color: #eaaee8;
}

nav .links a:hover {
    font-weight: 700;
    text-decoration: none;
    text-shadow: 2px 2px 2px #ff00ff;
}

.profile {
  background: #330033;
  color: mediumorchid;
    border-radius: 3px;
}

DIV.blog-preview > H4 {
    color: mediumorchid;
}

.general-about .profile-pic img {
    float: left;
    border: 3px ridge #990099;
}

.online {
    color: green;
}

.general-about .details {
    display: block;
}

.profile .contact, .profile .url-info, .profile .blurbs, .profile .friends {
    border: 1px solid #330033;
}

.profile .blurbs .inner h4 {
    color: mediumorchid;
}

.profile .table-section {
    background-color: #330033;
    border: 1px solid #330033;
}

table.details-table {
    background-color: #1a001a;
    border: 1px solid #330033;
}

.details-table td {
    background: #330033;
}

.details-table td:first-child {
    background: linear-gradient(#330033, #1a001a);
    border-color: #1a001a;
    color: mediumorchid;
    font-family: 'Lekton';
    font-size: 11.5px;
    font-weight: 400;
}

.details-table td:first-child a {
    color: orchid;
}

.profile .blurbs .inner h4 {
    color: magentaorchid;
    font-weight: 700;
}

.profile .blurbs .inner {
    font-family: Verdana;
}


.profile .friends .person p {
     font-family: 'Lekton';
     color: mediumorchid;
 }

.profile .friends .inner {
    overflow-y: auto;
    height: 320.55px;
}

.comments-table {
    border: 1px solid #330033;
}

.comments-table td:first-child {
   background: linear-gradient(#990099, #1a001a);
   border: 1px solid #330033;
    border-radius: 6px;
}

.comments-table td:first-child a {
    color: orchid;
    font-family: 'Lekton';
    font-weight: 400;
    font-size: 12px;
}

.comments-table td {
    background: linear-gradient(#990099, #1a001a); 
    font-size: 11px;
    border-radius: 6px;
}

.comments-table td a {
    color: orchid;
}

.comment-replies {
    border: 1px solid #990099;
    border-radius: 6px;
}

footer {
    background: linear-gradient(#990099, #1a001a);
    font-size: 11px;
    color: mediumorchid;
    border-radius: 3px 3px 0px 0px;
}

footer a {
    color: orchid;
}

footer a:hover {
    color: orchid;
    font-style: bold;
    text-shadow: 2px 2px 2px #fff;
}

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

catpizr223	1719244745 using Report Comment
halloweener	1674235189 using, thank you! Report Comment
N8oR	1663670676 Definitely adding this. Thanks :D Report Comment
Rosa	1655895417 using. thx Report Comment
compulsiveContriver	1654143629 Using. Very pretty! Report Comment
Skye Strike	1653886646 Using! Report Comment
kay	1652089553 using! Report Comment