Cute Layout in Gray <3

Tags: grey, gray, cute, simple

Description:

This is the grey version of my simple pink layout (here), as requested. :)

Preview:

click on the image for a larger preview

Code:

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

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


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

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

a {
    color: slategrey;
}

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

.profile h1 {
    font-family: 'Delius Swash Caps';
    font-weight: 200;
    text-align: center;
    font-size: 40px;
}

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

nav .top {
    display: block;
    background-color: black;
}

nav .links {
    display: block;
    background-color: black;
    font-family: 'Lekton';
    font-weight: 400;
    font-size: 12px;
    text-align: center;
}

main {
  background-color: lightgrey;
}

.profile {
  background-color: lightgrey;
  color: black;
}

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

.profile .url-info, .profile .contact {
    border-color: black;
}
.general-about .profile-pic img {
    float: left;
    border: 5px double black;
}

.online {
    color: black;
}

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

.profile .contact .heading {
    display: block;
    background-color: black;
}

.profile .table-section {
    background-color: lightgrey;
    border-color: lightgrey;
}

.profile .table-section .heading {
    display: block;
    background-color: black;
}

table.details-table {
    background-color: lightgrey;
    border-color: lightgrey;
}

.details-table td {
    background-color: darkgrey;
}

.details-table td:first-child {
    background: grey;
    border-color: lightgrey;
    color: white;
    font-family: 'Lekton';
    font-size: 11.5px;
    font-weight: 400;
}
.details-table td:first-child a {
    color: white;
}

.profile .blurbs .heading, .profile .friends .heading {
    display: block;
    background-color: black;
}

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

.profile .blurbs .inner {
    font-family: 'Garata';
}


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

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

.comments-table {
   border-color: lightgrey;
}

.comments-table td:first-child {
   background-color: dimgrey;
   border-color: dimgrey;
}

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

.comments-table td {
    background-color: darkgrey; 
    font-size: 11px;
    color: white;
}

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

.comment-replies {
    border-color: darkgrey;
}

footer {
    background-color: black;
    font-size: 11px;
    color: white;
}

footer a, footer a:hover {
    color: grey;
}
</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.