Scales and pastels

Tags: fish, scale, crashtestdummy, pastel, simple, layout, cute, purple, blue
Description:

simples fish layout
Preview:

click on the image for a larger preview
Code:

<!-- (c) Layout created by Crash Test Dummy (https://layouts.spacehey.com/layout?id=2691) -->

<style>

body:before {
	content: " ";
	height: 100%;
	width: 100%;
	display: block;
	position: fixed; 
	top: 0; 
	left: 0; 
	z-index: 100;
	background-image: url(https://i.imgur.com/NAbRPz8.gif);
	background-size: cover;
	background-repeat: no-repeat;
	animation: yourAnimation 3s ease 0s 1 normal forwards;
	pointer-events: none;
}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oxygen&display=swap');
:root{
    --fuzzy-wuzzy: #800080;
    --tan: #F1B9E377;
    --magic-mint: #ACEDD9;
    --middle-blue-green: #8FD4CA;
    --slate-gray:  #677B94;
    --space-cadet: #800080;
    --independence: #4a4e69;
    --heliotrope-gray: #9a8c98;
    --silver-pink: #c9ada7;
    --isabelline: #f2e9e4;
    --oxford-blue: #14213D;
    --curve: 4px;
    --font-family-heading:'Oxygen', sans-serif;
    --font-family-body:'Poppins', sans-serif;
    --pdg_profileInfo: url(https://i.imgur.com/NAbRPz8.gif);
    /*change whats in the quotes to personalize topics*/
    --topic1: "General";
    --topic2: "Music";
    --topic3: "Movies";
    --topic4: "Television";
    --topic5: "Books";
    --topic6: "Heroes";
    /*change these to customize your headings*/
    --contact: "Add Me";
    --interests: "Meet Me";
    --links: "Follow Me";
}
body, .bodyContent  {
 background:
 url("https://i.imgur.com/Vl8mLZ0.jpg") bottom repeat,
 url("https://i.imgur.com/Vl8mLZ0.jpg") top repeat;
 background-size:100% ;
 background-attachment:scroll; 
 border-color:#00000000;
 border-width:55px; 
 border-style:dotted;
}
main{
    background:none;
}
footer{
    background:rgba(255,255,255,.4);
    
}

.blurbs, .mood, .blog-preview, .friends, .table, .table-section, .contact{
    background-color:rgba(103,89,171,.1)!important;
    border:groove 3px!important;
    border-color:#9a93ba !important;
    padding:5px;
    border-radius: var(--curve);
}
.mood{
    border-bottom:none!important;
    padding-bottom:none;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    text-align: center;
}
.w-40 .table-section:last-child .heading h4{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}

.w-40 .table-section:last-child .heading::after{
    content: var(--links);
    font-family: var(--font-family-heading) !important;	
    font-weight: bold !important;
    color:var(--independence);
    font-size: 15px;
}

.w-40 .table-section:nth-last-child(2) .heading h4{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}

.w-40 .table-section:nth-last-child(2) .heading::after{
    content: var(--interests);
    font-family: var(--font-family-heading) !important;	
    color: var(--independence) !important;
    font-weight: bold !important;
    font-size:15px;
}

.w-40 .contact .heading h4{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}

.w-40 .contact .heading::after{
    content: var(--contact);
    font-family: var(--font-family-heading) !important;	
    color: var(--independence) !important;
    font-weight: bold !important;
    font-size: 15px;
    
}
.section h4{
    color:var(--independence)!important;
}

nav{
    color:var(--space-cadet);
}
.blurbs .inner .section:nth-child(1) h4:before{ 
    content: ""; /* put your own "about me" header here*/
    font-size: 0;
    
}

p{
    color:var(--space-cadet);
}
.contact{
    border-top:none!important;
    padding-top:none;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
}
.table-section:not(:last-child) .details-table tr td:first-child p{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}

.details-table tr td:first-child p::after{
  color:var(--space-cadet) !important;
  letter-spacing:normal !important;
  filter: brightness(95%) !important;
}
.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{
  content: var(--topic1);
  Font-size: 11px;
}
.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{
  content: var(--topic2);
  Font-size: 11px;
}
.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{
  content: var(--topic3);
  Font-size: 11px;
}
.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{
  content: var(--topic4);
  Font-size: 11px;
}
.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{
  content: var(--topic5);
  Font-size: 11px;
}
.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{
  content: var(--topic6);
  Font-size: 11px;
}
td{
    background:rgba(103,89,121,.7)!important;
    Font-size: 11px;;
}
a{
    color:var(--oxford-blue)!important;
}
.url-info{
    display: none!important;
}
.profile{
    background-color:var(--tan)!important;
    border:groove 10px;
    border-color:var(--tan)!important;
    padding:3px;
    border-radius: 0px;
    background:url("https://i.imgur.com/MASg3QJ.gif") bottom no-repeat;
    background-size: 300px;
    background-repeat: repeat-x;
    padding-top: none;
    border-top:none;
    
    
}
.profile background{
    transform: rotate(5deg);
}
.top{
    background:var(--tan)!important;
}
.inner img{
    filter:contrast(.7);
    border-radius: var(--curve);
}
nav{
    border:var(--tan) groove 10px;
    border-bottom: none;
    padding-bottom: 0px;
    
}
main{
    padding-top:0px;
}
nav ul{
    background-color:#9e95a1!important;
    font-size: 11px;
    text-align: center;
}
#comments{
    border-top:none!important;
    border-bottom:solid 2px var(--slate-gray)!important;
    border-radius: var(--curve);
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    
}
.friends{
    border-bottom:none!important;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}
.blurbs .heading{
    display:none;
}
h1, h2, h3, h4, h5{
    font-family: var(--font-family-heading);
    text-transform: bold;
}

a, p, nav label, .section{
    font-family: var(--font-family-body)!important;
}
.contact a{
    font-size: 11px;
}
h1{
    color:var(--fuzzy-wuzzy);
    text-shadow:1px 1px var(--slate-gray);
    font-family: var(--font-family-heading);
}
h2, h3, h4, h5{
    color:var(--independence);
    font-size: 14px;
}
.heading{
    background:rgba(0,0,0,.0)!important;
    text-align: center;
}
.friends{
    text-align: center;
}
.friends img{
    border:#9e95a1 groove 2px;
}
#comments td{
    background-color:rgba(103,89,121,.4)!important;
    border:solid .5px;
    border-color: rgba(93,79,111,.7);
    Font-size: 13px;
}
#comments{
    overflow: scroll;
    height:320px;
}
#comments img{
    border:none;
    border-radius: 0px;
}
.online{
    content:url(https://i.imgur.com/ZSxg1EE.gif);
    height: 50px;
    width: 40px;
}
.supporter img{
    font-size:0;
    
} 
.supporter:before{
    content:url()!important;
}
.profile-pic img{
    border-radius: 500px;
    box-shadow: 5px 2px rgba(103,89,121,1);
    filter: contrast(.7);
}

.profile-info {
	background: var(--pdg_profileInfo);
	background-size: cover;
	background-position: center;
	box-shadow: -7px 8px 0 #0006;
	color: #FFFFFF00;
	padding:6em 0;
}
</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 4 of 4 comments ( View all | Add Comment )
Darleen	1637414593 Very cool! Thanks for sharing Report Comment
Kaila Long	1628036930 so pretty love it!!!! Report Comment
Toua Moua	1626418729 Colorful scales. Thanks for sharing and creating. Report Comment
Toxic	1622927122 Mind if I use this Report Comment