Pretty Purple

Tags: purple, pink, blue, transparent, animated

Description:

feel free to use this layout for yourself, or as a template/basis to make your own!! i used ash lynx's "dreamy clouds" as a starting point for this layout.

you can get a live preview by pasting the layout's code into the previewer here.

it'd be swell if you commented on my profile or added me if you do end up using this or forking it for yourself! :)

- TheRobbbyn

Preview:

click on the image for a larger preview

Code:

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

<style>

    :root {
        --logo-blue: #a62cf8;
        --darker-blue: #f570ee;
        --lighter-blue: #46026d;
        --even-lighter-blue: #46026d;
        --lightest-blue: #46026d;
        --dark-orange: rgb(53, 0, 88);
        --light-orange: #bd5dfd;
        --even-lighter-orange: #ffccfc;
        --green: #38d;
    }

    * {
        font-family: monospace;
        color:rgb(255, 255, 255);
        font-size: 1.03em;
    }

    h1, .profile h1 {
        font-size: 3em;
    }

    h2, h3, h4 {
        font-size: 1.8em;
        color:rgb(255, 255, 255);
    }

    .profile .blurbs .section h4 {
        font-size: 1.5em;
        color:rgb(255, 255, 255);
    }

    body
        {background: url("https://media.giphy.com/media/LUxTEh4UHV7DFgvVM3/source.gif")
        no-repeat fixed; background-size:cover;
     }

     p, ol li, ul:not(nav .links) li {
         font-size: 0.95em;
     }

     a:hover, a:active {
         color: #a62cf8;
     }

     .friends .inner p b{
         font-size: 1.2em;
         font-style: normal;
     }
     .count {
        color: #bd5dfd;
     }
     
     .blog-preview h4 {
        border-bottom: 2px solid;
        border-color: #dda1ff !important;
     }

    .blog-preview p {
        font-size: 1em;
        background-color: none;
        padding: 3px 5px;
        margin: 2px;
        border-radius: 10px;
        color: rgb(255, 255, 255);
    }

    .blog-preview p a:hover,
    .blog-preview p a:active,
    .blog-preview p a:focus{
        color: white!important;
    }

    nav {
        border-radius: 15px 15px 0 0;
        overflow: hidden;
    }

    .profile .contact,
    .profile .url-info,
    .profile .table-section,
    .home-actions {
        border: none;
    }

    table.details-table {
        border-collapse: collapse;
    }

    table.details-table td {
        background-color: transparent !important;
    }

    .profile-pic {
        border-radius: 200px;
        overflow: hidden;
    }

    .profile-info {
        border: none;
        padding: none;
        font-size: 0.8em;
        font-style: italic;
        color:rgb(197, 157, 104);
    }

    .supporter {
        color: rgb(238, 217, 31);
        font-style: italic;
    }

    .online {
        color: rgb(238, 217, 31);
    }

    .heading {
        padding: 5px 0 !important;
        margin-top: 15px;
        margin-bottom: 10px;
        background-color: transparent !important;
        color: #dda1ff !important;
        border-bottom: 2px solid;
    }

    main {
        border-radius: 0 0 15px 15px;
        background: rgba(24, 16, 27, 0.4) !important;
         backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }

    .container {
        border-radius: 15px 15px 0 0;
        overflow: hidden;
        margin-top: 30px;
        padding: 10px;
    }

    footer {
        border-radius: 15px;
        background: rgba(24, 16, 27, 0.4) !important;
         backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        display: block !important;
    }

    a.more {
        font-size: 1em;
    }

    .comments-table {
        border-color: rgba(28, 17, 31, 0);
        border-radius: 15px;
        border: none;
    }

    .comments-table tr {
        border-color: rgba(28, 17, 31, 0);
        border-radius: 15px;
        border: none;
    }

    .comments-table td {
        background: rgba(28, 17, 31, 0) !important;
        border-color: rgba(28, 17, 31, 0);
        border-radius: 15px;
        border: none;
    }

    .comments-table td:first-child img {
        width: 80px;
        border-radius: 500px;
    }

    .comments-table td a button {
        background: rgba(28, 17, 31, 0) !important;
        color: #ffccfc;
    }

    .comments-table p {
        font-size: 0.8em;
    }

    .profile .friends .person img {
        border-radius: 500px;
    }

    a.addme {
        font-size: 2rem;
        font-weight: bold;
        margin-bottom: 15px;
        display: block;
    }

</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.