maybug layout!! ( friend themed layouts pt.1 :D )

Tags: green, white, nature, rain, snails, bugs, cute, simple, cozy

Description:

based on/themed around maya!! #1 british person 😻😻 i actually love this layout its so amazing
includes a custom cursor, a scrollbox for the comments + main page (help idk how to say it but you'll know T_T), and a buuuunch of graphics :]
comment if ur gonna use!! and pls keep the credit in :3

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by ⨂ valerie vengeance ⨂ (https://layouts.spacehey.com/layout?id=84045) -->

<marquee><h1> <a href="https://spacehey.com/gods_worst_angel">layout by valerie</a> </h1></marquee>

<style>
body{
  background: url(https://66.media.tumblr.com/ccd6744b313ed479c642194a6fd93623/tumblr_ox4at2CFoT1ve3xq2o1_1280.gif) center;
  background-size: cover;
}

main{
  background: rgb(27, 94, 32, 0.5);
  border: white dashed 3px;
  border-radius: 10px;
  color: white;
  text-transform: lowercase;
  margin-top: 25px;
  margin-bottom: 25px;
  height: 400px;
  overflow-y: scroll;
}

nav .top, nav .links{
  background: rgb(27, 94, 32, 0.5);
  border: white dashed 3px;
  border-radius: 10px;
  color: white;
  text-align: center;
  text-transform: lowercase;
  margin-top: 25px;
  margin-bottom: 25px;
}

nav .links a{
  text-shadow: 0px 0px 3px white;
  font-size: 15px;
}

nav .links li:not(:last-child)::after{
  content: "🪴";
  color: var(--headers);
}

footer{
  background: rgb(27, 94, 32, 0.5);
  border: white dashed 3px;
  border-radius: 10px;
  color: white;
  text-transform: lowercase;
  text-align: center;
}

footer a{
  color: white;
}

footer:after{
  content: url(https://pagedeco.carrd.co/assets/images/gallery14/0a998ea3.gif?v=1cb5da6d);
}

.blurbs:after{
  content: url(https://pagedeco.carrd.co/assets/images/gallery10/c8dc6f5b.png?v=1cb5da6d);
}

.blog-preview:before{
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 32px;
  background-image: url(https://pagedeco.carrd.co/assets/images/gallery02/5f865bac.gif?v=1cb5da6d);
  background-repeat: repeat;
  background-position-x: center;
  background-size: 250px;
}

.mood:after, .friends:after{
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 32px;
  background-image: url(https://pagedeco.carrd.co/assets/images/gallery02/4a03599f.gif?v=1cb5da6d);
  background-repeat: repeat;
  background-position-x: center;
  background-size: 200px;
}

a{
  color: white;
}
a:hover, nav .top a:hover, nav .links a:hover, footer a:hover{
  color: black;
  font-style: italic;
}

.heading{
  background: rgb(0, 0, 0, 0.5) !important;
  text-align: center;
  text-shadow: 0px 0px 3px white;
  border: white solid 3px;
  border-radius: 10px;
}

.profile h1{
  text-align: center;
  text-shadow: 0px 0px 3px white;
}

.blog-preview{
  text-shadow: 0px 0px 3px white;
  text-align: center;
}

table.comments-table, .comments-table td{
  border: none;
  background: rgb(0, 0, 0, 0.5);
  border-radius: 10px;
}

.comment-replies {
  border: none;
}

.friends#comments{
  height: 200px;
  overflow-y: scroll;
}

.friends a p{
  color: white !important;
  text-shadow: 0px 0px 3px white;
}

.profile-pic img, .friends img{
  border-radius: 10px;
  filter: saturate(170%);
}

.profile .url-info{
  display: none;
}

.profile-info{
  border: none;
  font-size: 20px;
  font-style: italic;
  text-shadow: 0px 0px 3px white;
}

.count{
  color: white;
}

button{
  border: none;
  background: none;
  text-transform: lowercase;
  color: white;
}

.contact .inner a img {
font-size: 0;
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
	/* add friend */
	content: url(https://external-media.spacehey.net/media/sO9aNjOyQEwAhagvjTMAiY0Ey67jPvW0mxXrqcNehCVQ=/https://pixels.crd.co/assets/images/gallery89/c2a4bf09.gif?v=9b219e01);
  font-size: 12px;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	/* add 2 fav */
	content: url(https://external-media.spacehey.net/media/sHwKZARIVRn-DyAfMX0ROXKuxOLkAwtMuWofXnjS6MBM=/https://64.media.tumblr.com/20622b90da1cb5e7bf4288d92dd8dfaf/d1f5fc170c0a4070-ac/s75x75_c1/357f4b77b5f41be8a2ffd9e1f92595c2907a11ff.gifv);
  font-size: 12px;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* chat */
	content: url(https://external-media.spacehey.net/media/sWAIamFpou9l_1GuGHpgnqpNwGTMWJNIGkE_08fbsRx4=/https://64.media.tumblr.com/8b84ebee872387bd5285efb95d2752aa/cc92a283f84d8e60-6f/s75x75_c1/4c4516cad74d9ad85cfe3f56333efed21870ee53.gifv);
  font-size: 12px;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* forward */
	content: url(https://external-media.spacehey.net/media/sh7OL8NKA1pqqWl-rJjXgjsnBL7M01It6X7IT_l9GtdM=/https://pixels.crd.co/assets/images/gallery12/9efc8b3c.gif?v=9b219e01);
  font-size: 12px;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* instant msg */
	content: url(https://external-media.spacehey.net/media/szFdp00C9aCdIoPJ1NRI6yPzVWhGybxQjTxzY3m5fRpk=/https://pixels.crd.co/assets/images/gallery89/06cf1469.gif?v=9b219e01);
  font-size: 12px;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* block */
	content: url(https://external-media.spacehey.net/media/sqI5-tTyD_j9sCpbQS0JHUwjcXn-JIDsV4Vw5p1mCcJY=/https://64.media.tumblr.com/f11337a1273aa2e6408657cac95b3fcf/ba293b2d3d550dff-47/s75x75_c1/68f015184043431ab5d45bc2598a010ce62bfafb.gifv);
  font-size: 12px;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* add 2 group */
	content: url(https://external-media.spacehey.net/media/sd7GgldIar4IW897icaYnpb7TzcLIx_ckuqOqbF2boRE=/https://64.media.tumblr.com/9da18bb2d23ade1b7a20d14bca3b72b6/46aa0f91c599f5b5-49/s75x75_c1/187bc3e3117200416252a144ac7d11bbd2207dba.gifv);
  font-size: 12px;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* report */
	content: url(https://external-media.spacehey.net/media/sSXp8VKaZIsgbNznw5P4z8PD7y-OLVpGyMaVAfIn_nyI=/https://64.media.tumblr.com/6c99e42e3f2daf529217a91e05a90f36/4d0027effef25ce6-54/s75x75_c1/ee02e3554ce99ca91721ccfde6d8df4abf2d2a61.gifv);
  font-size: 12px;
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a, .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a, .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a, .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a, .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a, .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a, .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a, .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a {
	font-size: 0
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:after, .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:after, .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:after, .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:after, .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:after, .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:after, .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:after, .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:after {
	font-size: 11px;
	transition: all .3s;
        line-height: 5px;
  	padding: 0px 15px 0px 0px;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:hover:after, .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:hover:after, .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:hover:after, .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:hover:after, .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:hover:after, .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:hover:after, .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:hover:after, .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:hover:after {
	transform: scale(2);
	opacity: 1
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:after {
	content: "wanna be friends?"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:after {
	content: "i'm ur fave! :]"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:after {
	content: "talk 2 me!"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:after {
	content: "share me!"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:after {
	content: "more talkin"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:after {
	content: "don't like me?"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:after {
	content: "add me to a group!"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:after {
	content: "hate me? ]:"
}

:root {
--logo-blue: white;
--darker-blue: white;
--lighter-blue: transparent;
--even-lighter-blue: transparent;
--lightest-blue: transparent;
--dark-orange: white;
--light-orange: transparent;
--even-lighter-orange: transparent;
--green: white;
}

body, body a:hover{
  cursor: url(https://64.media.tumblr.com/36c54348159f6dd609d0a1870855ce54/df4e0e3d68fca66a-74/s75x75_c1/6d075cffd199836f9a67fc35ca2ae4b7c6c1c3a9.gifv), auto;
}

main, nav .top, nav .links, footer{
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
  margin-left: 0px;
  margin-top: 0px;
}

  @keyframes floating {
  0% { transform: translate(0,  0px); }
  50% { transform: translate(0, 5px); }
  100% { transform: translate(0, -0px);
}
</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 11 of 11 comments ( View all | Add Comment )

０ｘｅｎ	1727270058 using Report Comment
╰☆☆ 𝕊𝕦𝕟𝕤𝕖𝕥 ☆☆╮	1727201106 using Report Comment
Cassander	1706929401 i will be using this, tysm :) Report Comment
kikita ♡ˎˊ˗	1706555992 literally so cute thanks for the layout Report Comment ^_^ yw !! by ⨂ valerie vengeance ⨂; 1706561929; Report
A nerdy artist (Rae Taylor irl)🍉	1701615611 can i have the code for the copyright thing :3 Report Comment if you're reffering to this: "", every published layout has that automatically added to it! if you want the copyright you can publish they layout you're using now and copy paste everything in the code box onto your profile :] by ⨂ valerie vengeance ⨂; 1701615806; Report ty! by A nerdy artist (Rae Taylor irl)🍉; 1701616059; Report yw :] by ⨂ valerie vengeance ⨂; 1701616315; Report
bones!!	1700343746 using! :3 Report Comment
MarMarm	1699276349 Using!! IT'S SO CUTE HOW COULD I NOT?? Report Comment
Sage Stars	1699052175 Using!! This is so pretty:) Report Comment thx :] glad ya like it by ⨂ valerie vengeance ⨂; 1699052266; Report
FlawlessHoney	1698762769 Using (: Report Comment
John's Mandela	1698405552 using! :-) Report Comment
𖦹 maybug	1698249081 I'MCRYINGOMFG NOT IN A LUAGHING WAY IN A ILOVETHISSOMUCH WAY IT'S SO CUTEOMG STOPPPPPILOVEITSOMUCH CAN I USE IT ON MY ALT ACC ??????? UGHHHGHGJSI IT'S TOO CUTE OMFG IT'SAMAZING I LITERALLY LOVE YOU SO MUCH <333333333333333333333333333333333333333333 YOU'RE ADDED TO MY PEOPLEI'DHUG LIST !!!! /j AAAAAAAAAAAAAAAAAAAAAAAAAILYYYY MWAHMWAHMWAH BESTTHINGEVERRRRRR Report Comment EEEE YEAH OFC U CAN USE IT !!! OMGOMG :DDD by ⨂ valerie vengeance ⨂; 1698249132; Report Usando, está increíble! by Starman_; 1705902517; Report ¡Gracias! by ⨂ valerie vengeance ⨂; 1705925508; Report