Fluffle puff layout !!

Tags: mlp, mlp, pink, uwu, hollydaze

Description:

Comment if using !!

Preview:

Code:

<!-- (c) Layout created by Invader Bonzey (https://layouts.spacehey.com/layout?id=33713) --> <style> nav:before { width: %; height: 100px; display: block; content: ""; background-image: url( background-position: center center; background-size: cover; } :root { --logo-blue: #f7fcc400; --darker-blue: #8c44aa; --lighter-blue: #ff93ab69; --even-lighter-blue: #ffffff; --lightest-blue: #ffffff; --dark-orange: #ff93ab; --light-orange: #fffdfd; --even-lighter-orange: #fffdfd; --green: #8c44aa; } <style> * { font-family:helvetica; } body {background-image: url(https://wallpaperaccess.com/full/3286314.png); background-attachment: fixed; } } main { border-radius: 0 0 0px 0px; background: rgba(206, 251, 251) !important; } .friends-grid { display: none; } .contact { border-radius: 5px; background: url(https://media1.tenor.com/images/d06c3802f4c78700e56473dc99eab662/tenor.gif?itemid=16191895);} .online{content:url(https://i10.glitter-graphics.org/pub/383/383300flbq01eaxr.gif)} table.comments-table{ display: block; height: 250px!important; overflow-y: scroll; } /* Start https://www.cursors-4u.com */ * {cursor: url(https://ani.cursors-4u.net/symbols/sym-8/sym759.ani), url(https://ani.cursors-4u.net/symbols/sym-8/sym759.png), auto !important;} /* End https://www.cursors-4u.com */ </style> <style> :root{ --headers: hotpink; --links: hotpink; --text: hotpink; --names: hotpink; --background_image: url("https://i.pinimg.com/originals/fe/c5/9e/fec59e8c747f2153ff3b3b69a3052d41.jpg"); --font-family: sans-gothic; --mynamesize: 45px; --transparency: 0.00; --curve: 360px; --hue: 0deg; --simple_bg: #8995ad; --topic1: "General"; --topic2: "Music"; --topic3: "Movies"; --topic4: "Television"; --topic5: "Books"; --topic6: "Heroes"; --myactions: "Explore With Me"; --mytopics: "My Interests"; --mylinks: "Find Me Here"; } h3, h4, h5, .url-info b{ color: var(--headers) !important;} /* headings*/ a{color: var(--links) !important;} /* color of links */ p, h2{color: var(--text) !important;} /* color of text */ h1{ background-color:var(--box_color_and_seethru) !important; border-radius: var(--curve) !important; padding: 10px !important; border: var(--borders) !important; color: hotpink; !important; } /* color of username */ .count, .friends a p{color: var(--names); !important;} /* color of names, and friends counter */ nav label{color: var(--headers) !important;} /* color of search */ .section h4{color: var(--names) !important;} /* aboutme & want2meet headings */ .online{color: var(--links) !important;} /* color of the 'online' text */ .section{color: var(--text) !important;} /* sometimes <p> is broken by embeds maybe. */ :root{ --box_color_and_seethru: rgba(236,228,210, var(--transparency));} h1, h2, h3, h4, h5, a, nav label{ font-family: var(--font-family) !important; text-transform:uppercase !important; } .section,p,a{ font-family: var(--font-family) !important; } h1, h2, h3, h4, h5, p {padding-left:5px !important;} h1{ font-size: var(--mynamesize) !important; text-transform:none !important; padding-left:12px !important; } body { background-image: var(--background_image) !important; } .heading, .url-info, .blurbs, .mood, .blog-preview, .friends, .contact, .table, .table-section, footer{ background-color:var(--box_color_and_seethru) !important; border-radius: var(--curve) !important; padding: 10px !important; border: var(--borders) !important; } .details{ background-color:var(--box_color_and_seethru) !important; border-radius: var(--curve) !important; padding: 10px !important; border: var(--borders) !important; height: 175px; } #comments, .blurbs, .blog-preview, .friends, .mood, .contact, .table-section, footer { backdrop-filter: blur(0.58px);} .table-section{border:none !important;background-color:var(--box_color_and_seethru)!important;border-radius: var(--curve) !important;} .heading{background:none !important;padding-bottom:0px !important;} .profile-pic img{ /* the face rotation is funny, but let's comment it away for default */ /* transform: rotate(90deg) !important; */ outline:none !important; border-radius: var(--curve) !important; } .friends-grid img{ outline:none !important;filter: opacity(90%) !important; width:60% !important; height:30% !important; border-radius: var(--curve) !important; filter:hue-rotate(var(--hue)) !important; } .inner img{ outline:none !important; border-radius: var(--curve) !important; } iframe{border-radius: 60px !important;opacity: 0.66 !important;} nav{background-color:var(--box_color_and_seethru); !important;border-radius: 0px 0px var(--curve) var(--curve); !important;} nav ul{background:none !important;} nav img{filter: opacity(80%) !important;} nav ul a img, .mood a img{display:none !important;} .top{background:none !important;background-color:rgba(0, 0, 0, 0.8); !important;} nav img.logo{filter: brightness(0) saturate(100%) invert(30%) sepia(70%) saturate(5131%) hue-rotate(300deg) brightness(89%) contrast(80%) !important;} .url-info{display:none !important;} td {background-color:rgba(0, 0, 0, 0.0) !important;border-radius: var(--curve) !important;} main{border-radius: var(--curve) !important;} main{background-color:rgba(0, 0, 0, 0.0); !important;} .friends th, tr, .friends td, th, .icon, #comments, main, .comments-table, .friends, .profile-info, .table, .table-section, .contact, .url-info, .mood, .blurbs, .blog-preview, .details, .profile-pic img { border: 0px dotted gray !important; outline: none !important; } .icon{border:none !important;} .mood{margin-bottom:12px !important;} .blurbs{margin-top:12px !important;} .friends{margin-top:-12px !important;} .profile-info{border-radius: var(--curve) !important;} .comments-table{border-radius: var(--curve) !important;border:none !important;} .table-section{padding-bottom:9px !important;} #comments{margin-top:17px !important;padding-bottom:17px !important} .details p:last-child{color:var(--links) !important; filter: brightness(95%); } .contact, .f-row, .f-col{padding-left:0px !important;margin-left:0px !important;margin-right:0px !important;padding-right:0px !important;} .contact{padding-left:2px !important;} .f-row{margin-bottom:3px !important;padding-bottom:0px !important;padding-top:2px !important;margin-top:0px !important;} .f-col a{margin-left:-2px !important;padding-left:-2px !important;} .contact{padding-bottom:12px !important;} .search-wrapper input[type=text] {background-color: rgba(255, 255, 255, 0.5) !important;border: 1px solid var(--headers) !important;color:var(--names) !important;border-radius: 10px !important;} button{border-radius: 10px !important;border: 1px solid var(--headers) !important;font-family: var(--font-family) !important;background-color:rgba(255, 255, 255, 0.5) !important;color:var(--headers) !important;} code{ word-break: break-all !important;} .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(--mylinks); font-family: var(--font-family) !important; text-transform:uppercase !important;color: var(--headers) !important;font-weight: bold !important;} .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(--mytopics); font-family: var(--font-family) !important; text-transform:uppercase !important;color: var(--headers) !important; font-weight: bold !important; } .w-40 .contact .heading h4{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;} .w-40 .contact .heading::after{ content: var(--myactions); font-family: var(--font-family) !important; text-transform:uppercase !important;color: var(--headers) !important;font-weight: bold !important;} .blurbs .heading{display:none !important;} .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(--links) !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); } .table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{ content: var(--topic2); } .table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{ content: var(--topic3); } .table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{ content: var(--topic4); } .table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{ content: var(--topic5); } .table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{ content: var(--topic6); } hr{ border: 1px dashed var(--names) !important;filter: brightness(55%) !important;} button.logout-btn { border: none !important; } </style> <style> html:before { animation: grain 8s steps(10) infinite; background-image: url(https://68.media.tumblr.com/4dc5dd05b46f26c34eba73c52dfde692/tumblr_molro06w091qgwu2so1_500.gif); background-size: 200px !important; content: ""; height: 300%; left: -50%; opacity:.2; position: fixed; top: -110%; width: 300%; pointer-events:none; } @keyframes grain { 0%, 100% { transform:translate(0, 0) } 10% { transform:translate(-5%, -10%) } 20% { transform:translate(-15%, 5%) } 30% { transform:translate(7%, -25%) } 40% { transform:translate(-5%, 25%) } 50% { transform:translate(-15%, 10%) } 60% { transform:translate(15%, 0%) } 70% { transform:translate(0%, 15%) } 80% { transform:translate(3%, 35%) } 90% { transform:translate(-10%, 10%) } } </style> <style> table.comments-table{ display: block; height: 250px!important; overflow-y: scroll; } </style> <style> .profile{ direction: rtl; } .blurbs{ direction: ltr; } .blog-preview{ direction: ltr; } .friends{ direction: ltr; } .general-info{ direction: ltr; } .contact{ direction: ltr; } .url-info{ direction: ltr; } .details-table{ direction: ltr; } .profile .table-section .heading{ direction: ltr; } .details p{ direction: ltr; } .mood{ direction: ltr; } </style> <style> .contact .inner a img {margin-right: -2px; font-size: 0;} .contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before { /* add to friends */ content: url("https://external-media.spacehey.net/media/sWTPe-tAzTxgYztmBPbv1Co6BY-14ddP1DaHxdYOmf3M=/https://i.ibb.co/Qmw3VX8/love-cat.gif"); } .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before { /* add to favorites */ content: url("https://external-media.spacehey.net/media/sWTPe-tAzTxgYztmBPbv1Co6BY-14ddP1DaHxdYOmf3M=/https://i.ibb.co/Qmw3VX8/love-cat.gif") } .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before { /* send Message */ content: url("https://external-media.spacehey.net/media/sWTPe-tAzTxgYztmBPbv1Co6BY-14ddP1DaHxdYOmf3M=/https://i.ibb.co/Qmw3VX8/love-cat.gif") } .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before { /* forward to friend */ content: url("https://external-media.spacehey.net/media/sWTPe-tAzTxgYztmBPbv1Co6BY-14ddP1DaHxdYOmf3M=/https://i.ibb.co/Qmw3VX8/love-cat.gif") } .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before { /* instant message */ content: url("https://external-media.spacehey.net/media/sWTPe-tAzTxgYztmBPbv1Co6BY-14ddP1DaHxdYOmf3M=/https://i.ibb.co/Qmw3VX8/love-cat.gif") } .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before { /* block user */ content: url("https://external-media.spacehey.net/media/sWTPe-tAzTxgYztmBPbv1Co6BY-14ddP1DaHxdYOmf3M=/https://i.ibb.co/Qmw3VX8/love-cat.gif") } .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before { /* add to group */ content: url("https://external-media.spacehey.net/media/sWTPe-tAzTxgYztmBPbv1Co6BY-14ddP1DaHxdYOmf3M=/https://i.ibb.co/Qmw3VX8/love-cat.gif") } .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before { /* report user */ content: url("https://external-media.spacehey.net/media/sWTPe-tAzTxgYztmBPbv1Co6BY-14ddP1DaHxdYOmf3M=/https://i.ibb.co/Qmw3VX8/love-cat.gif") } </style> <style> .container{ border: 5px dashed pink; } </style> <a target="_blank" href="https://spacehey.com/neddbear"><img src="https://external-media.spacehey.net/media/sdzi5jdddjoeL7n8o-RBJyUMq9gg6J82p44QswEtZ7_M=/https://i.ibb.co/hZx4qK0/book-rainbow.gif"/></a> MadeByNeddbear!

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.