my melody windows theme

Tags: pink, retro, windows, windows 95, my melody, cute, sanrio, computer, 90s, layout

Description:

comment if used :) requested by purbabie !!
spacehey custom logo by ✧💧Lumi💧✧
HIGHLY inspired by nini
!! not overly compatible with mobile !! (sorry)

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by ray ☆ 🍉 (yuri lover ⚢) (https://layouts.spacehey.com/layout?id=95114) -->

<style>

body{ 
background: url(https://pbs.twimg.com/media/B6EXuZwCAAA0rzr?format=png&name=large) fixed;
    background-size: cover;
font-family: monospace;
    color: white;
    text-shadow: 1px 1px red!important;
}

.container {
    width: 62%;
    max-width: 100%;
    margin: 0 auto 10px;
}

main{
background: transparent;
}

nav .top {
    padding: 15px 10px 14px 10px;
    display: flex;
    position: relative;
}

nav:before {
    content: "https://spacehey.com";
    font-family: monospace;
    width: 98.7%;
    height: 21px;
    display: block;
    background-image: url(https://cdn.discordapp.com/attachments/1085563000599097355/1144306155410169937/Screenshot_2023-08-24_at_17.06.56.png), linear-gradient(180deg,#ffd6e7,#ff70ae 8%,#ff9ac6 40%,#ffbcd9 88%,#ff89bc 93%,#ff70ae 95%,#ff2483 96%,#ff2483);
    background-repeat: no-repeat !important;
    background-position: right center!important;
    padding: 3px 5px 3px 3px;
    border-top: 1px solid #ff2483;
    border-left: 1px solid #ff2483;
    border-right: 1px solid #eb268b;
    border-top-left-radius: 8px;
    border-top-right-radius: 7px;
    font-size: 13px;
    text-shadow: 1px 1px #eb268b;
    height: 21px;
    color: #fffafc;
    font-weight: normal;
    filter: hue-rotate(19deg);
    box-shadow: #ffffff7a 0 1px 1px 1px inset;
    margin-top: 20px;
    width: 64%;
}

nav .top {
    background: linear-gradient(180deg, #f68194, pink);
    padding: 5px 5px 5px 5px;
    border: 1px solid #ff3b5b;
    display: flex;
    position: relative;
    border-top: none!important;
    box-shadow: #ffffff7a 0 1px 1px 1px inset;
    align-items: center;
    width: 65%;
}

input {
    overflow: visible;
    background: #ffe8ec;
    box-shadow: inset 2px 2px grey, 2px 2px #dcd2d2;
    border: none;
    padding-top: 2px;
}

button {
    background: lightpink;
    outline: pink inset 3px;
    border: 1px solid #84797996;
    color: white;
    text-shadow: 1px 1px 1px #000000a6;
}

nav .links {
    background-color: transparent;
    padding: 3.5px 16px 5.5px 16px;
    display: flex;
    flex-direction: column;
    width: 59px;
    position: absolute;
    transform: translateX(0px);
    height: -webkit-fill-available;
    justify-content: center;
    margin-left: -165px;
}

nav .links a {
    text-decoration: none;
    color: white;
    text-shadow: 1px 1px #0000007d;
    font-size: max(0.98em, 12px);
    background: pink;
    border: inset #ff9bad 4px;
    padding: 5px;
    width: 97px;
    display: flex;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
    content: none;
}

nav .links a:before {
    content: "↬";
    color: white;
    padding-right: 6px;
    font-weight: bold;
}

nav .links li {
    min-height: 1.4em;
    margin-bottom: 26px;
}

body > div > nav > ul > li:nth-child(12) > a > img {
    filter: hue-rotate(305deg);
}

body > div > nav > ul > li.active > a:nth-child(1) > img {
    filter: hue-rotate(298deg);
}

html *::-webkit-scrollbar-track {
    image-rendering: pixelated;
    background-position: 0 0;
    background-repeat: repeat;
    background: #ffe2e7;
    border: 1px solid #ff147685;
}

html *::-webkit-scrollbar-button {
  background-repeat: no-repeat;
  background-size: 16px;
}

html *::-webkit-scrollbar-button:single-button:vertical:decrement {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTcgNWgxTTYgNmgzTTUgN2g1TTQgOGg3IiAvPgo8L3N2Zz4=");
}

html *::-webkit-scrollbar-button:single-button:vertical:increment {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTQgNWg3TTUgNmg1TTYgN2gzTTcgOGgxIiAvPgo8L3N2Zz4=");
}

html *::-webkit-scrollbar-button:single-button:horizontal:decrement {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTggM2gxTTcgNGgyTTYgNWgzTTUgNmg0TTYgN2gzTTcgOGgyTTggOWgxIiAvPgo8L3N2Zz4=");
}

html *::-webkit-scrollbar-button:single-button:horizontal:increment {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTYgM2gxTTYgNGgyTTYgNWgzTTYgNmg0TTYgN2gzTTYgOGgyTTYgOWgxIiAvPgo8L3N2Zz4=");
}

html *::-webkit-scrollbar-corner {
  background: pink;
}

html *::-webkit-scrollbar {
  width: 16px;
  height: 16px;
  background: none;
}

html *::-webkit-scrollbar-thumb, body *::-webkit-scrollbar-button {
    width: 16px;
    height: 16px;
    background: pink;
    box-shadow: inset 1px 1px #ffecec, inset -1px -1px #ab2323;
    border: 1px solid;
    border-color: silver #000 #000 silver;
}

.profile h1 {
    width: 98.7%;
    height: 21px;
    display: block;
    background-image: url(https://cdn.discordapp.com/attachments/1085563000599097355/1144306155410169937/Screenshot_2023-08-24_at_17.06.56.png), linear-gradient(180deg,#ffd6e7,#ff70ae 8%,#ff9ac6 40%,#ffbcd9 88%,#ff89bc 93%,#ff70ae 95%,#ff2483 96%,#ff2483);
    background-repeat: no-repeat !important;
    background-position: right center!important;
    padding: 3px 5px 3px 3px;
    border-top: 1px solid #ff2483;
    border-left: 1px solid #ff2483;
    border-right: 1px solid #eb268b;
    border-top-left-radius: 8px;
    border-top-right-radius: 7px;
    font-size: 17px;
    padding-bottom: 26px!important;
    text-shadow: 1px 1px #eb268b;
    height: 21px;
    color: #fffafc;
    font-weight: normal;
    filter: hue-rotate(19deg);
    box-shadow: #ffffff7a 0 1px 1px 1px inset;
    margin-top: 20px;
    width: 64%;
    padding-left: 10px!important;
}

body > div > main > div.row.profile > div.col.w-40.left > p {
    display: none;
}

.general-about {
    margin-top: -12px;
}

.online {
    color: #0C8C00;
    font-weight: bold;
    font-size: 143%;
    filter: hue-rotate(226deg);
}

.award a {
    color: white;
    font-size: 117%;
    text-decoration: none;
}

.general-about .profile-pic img {
    max-width: 160px;
    max-height: 160px;
    border-radius: 8px;
    border: 1px solid #ffffff;
    box-shadow: 0 0 4px #740000;
    margin-left: 8px;
    margin-top: 8px;
    margin-bottom: 8px;
}

.logo {
content:url("https://cdn.discordapp.com/attachments/1181715699207507978/1188186541516914758/Untitled193_20231223102854.png?ex=65999bf2&is=658726f2&hm=593e8edd7d02155c3c5ae006c491867aba9986d4f629b7e6523e9284e432ccef&"); }

img.logo.logo-fallback {
    transform: scale(1.3) scaleY(1.5);
}

.profile h1, .general-about {
    transform: translate(-24px, -26px);
}

.general-about .details {
    margin-top: -12px;
    padding-top: 8px;
    background: linear-gradient(180deg, #f5768c, pink);
    padding-left: 7px;
    border: 1px solid #ff006c;
    box-shadow: inset 1px 2px 1px #ffffffe0, inset -1px -2px #bd040469;
    color: white;
    text-shadow: 1px 1px black;
width: 80%;
padding-right: 10px!important;
    border-radius: 0 8px 0 0;
}

.profile .mood {
    width: 100%;
    display: inline-block;
    background: linear-gradient(180deg, #ff758d, pink);
    padding: 11px 11px 1px;
    margin-bottom: 15px;
    text-align: center;
    color: white;
    border: 1px solid deeppink;
    box-shadow: inset 1px 2px 1px #ffeeeecf, inset -1px -2px 1px #9527636e;
    border-radius: 8px 8px 0 0;
}

.profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading{
    background-image: url(https://cdn.discordapp.com/attachments/1085563000599097355/1144306155410169937/Screenshot_2023-08-24_at_17.06.56.png), linear-gradient(180deg,#ffd6e7,#ff70ae 8%,#ff9ac6 40%,#ffbcd9 88%,#ff89bc 93%,#ff70ae 95%,#ff2483 96%,#ff2483);
    background-repeat: no-repeat !important;
    background-position: right center!important;
    padding: 3px 5px 3px 3px;
    border-top: 1px solid #ff2483;
    border-left: 1px solid #ff2483;
    border-right: 1px solid #eb268b;
    border-top-left-radius: 8px;
    border-top-right-radius: 7px;
    font-size: 17px;
    padding-bottom: 26px!important;
    text-shadow: 1px 1px #eb268b;
    height: 21px;
    color: #fffafc;
    font-weight: normal;
    filter: hue-rotate(19deg);
    box-shadow: #ffffff7a 0 1px 1px 1px inset;
    padding-left: 10px!important;
}

.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {
    width: 100%;
    border: none;
    margin: 10px 0;
}

.contact .inner {
    background: linear-gradient(180deg, #ff6c86, pink);
    border: 1px solid deeppink;
    border-top: #ff6580 1px solid;
    box-shadow: inset 1px 2px 1px #ffffff9e, inset -1px -2px 1px #75024061;
    padding-bottom: 10px;
    padding-top: 5px;
    padding-left: 15px;
}

.contact {
    transform: translate(-17px, -22px);
}

.url-info{
background: url(https://i.pinimg.com/564x/57/96/94/5796947547c77690fa1abf35919afa98.jpg);
font-size: 0;
    height: 272px;
    background-size: cover;
    filter: hue-rotate(4deg);
    transform: translateY(-42px);
}

.details-table td:first-child, .details-table td, .comments-table td:first-child, .music-table td:first-child, .comments-table td, .music-table td, .comment-replies {
    background: linear-gradient(180deg, #f16c83, pink);
    color: white;
    font-weight: bold;
    border: 1px solid deeppink;
    box-shadow: inset 1px 2px 1px #ffffff9e, inset -1px -2px 1px #90004e85;
    padding: 5px;
}

body > div > main > div.row.profile > div.col.w-40.left > div:nth-child(7) > div.inner > table > tbody > tr:nth-child(1) > td:nth-child(2), body > div > main > div.row.profile > div.col.w-40.left > div:nth-child(7) > div.inner > table > tbody > tr:nth-child(2) > td:nth-child(2), body > div > main > div.row.profile > div.col.w-40.left > div:nth-child(7) > div.inner > table > tbody > tr:nth-child(3) > td:nth-child(2), body > div > main > div.row.profile > div.col.w-40.left > div:nth-child(7) > div.inner > table > tbody > tr:nth-child(4) > td:nth-child(2), body > div > main > div.row.profile > div.col.w-40.left > div:nth-child(7) > div.inner > table > tbody > tr:nth-child(5) > td:nth-child(2), body > div > main > div.row.profile > div.col.w-40.left > div:nth-child(7) > div.inner > table > tbody > tr:nth-child(6) > td:nth-child(2) {
    transform: translate(-30px, 10px);
}

body > div > main > div.row.profile > div.col.w-40.left > div:nth-child(7) > div.heading {
    width: 65%;
    margin-bottom: -13px;
    margin-left: 78px;
    font-size: 118%;
    padding-bottom: 0px;
}

.table-section {
    transform: translateY(-30px);
}

.profile-info {
    border: 2px solid rgba(0,0,0,0.7);
    padding: 15px 5px;
    margin-bottom: 10px;
    display: none;
}

.blog-preview {
    width: 100%;
    display: inline-block;
    background: linear-gradient(180deg, #ff758d, pink);
    padding: 1px 11px 1px;
    margin-bottom: 15px;
    color: white;
    border: 1px solid deeppink;
    box-shadow: inset 1px 2px 1px #ffeeeecf, inset -1px -2px 1px #9527636e;
    width: 80%;
    transform: translate(-55px, 2px);
}

.profile .blurbs .heading, .profile .friends .heading{
    background-image: url(https://external-media.spacehey.net/media/sMUK45upO5INlW-L-IHJNB85FZ84ElJmU-vGgv5E7kTA=/https://cdn.discordapp.com/attachments/1085563000599097355/1144306155410169937/Screenshot_2023-08-24_at_17.06.56.png), linear-gradient(180deg,#ffd6e7,#ff70ae 8%,#ff9ac6 40%,#ffbcd9 88%,#ff89bc 93%,#ff70ae 95%,#ff2483 96%,#ff2483);
    background-repeat: no-repeat !important;
    background-position: right center!important;
    padding: 3px 5px 3px 3px;
    border-top: 1px solid #ff2483;
    border-left: 1px solid #ff2483;
    border-right: 1px solid #eb268b;
    border-top-left-radius: 8px;
    border-top-right-radius: 7px;
    font-size: 17px;
    padding-bottom: 26px!important;
    text-shadow: 1px 1px #eb268b;
    height: 21px;
    color: #fffafc;
    font-weight: normal;
    filter: hue-rotate(19deg);
    box-shadow: #ffffff7a 0 1px 1px 1px inset;
    padding-left: 10px!important;
}

.profile .blurbs .inner, .profile .friends .inner, .blog-entry .comments .inner, .bulletin .comments .inner, .setting-section .inner {
    padding: 7px;
    background: linear-gradient(180deg, #ed768b, pink);
    border: 1px solid deeppink;
    box-shadow: inset 1px 2px 1px #ffffffba, inset -1px -2px 1px #7c004399;
    padding-left: 12px;
    padding-right: 13px;
}

.profile .blurbs {
    margin: 20px 0;
    transform: translate(-80px, -24px);
}

.profile .blurbs .section h4 {
    margin: 0;
    text-align: center;
    font-size: 140%;
}

.section {
    height: 100px;
    overflow-y: scroll;
    width: 73%;
    background: #ffe8ec;
    border: 2px solid pink;
    outline: 2px solid deeppink;
    color: #e9000094;
    text-shadow: none;
}

.profile .friends .person p {
    color: white;
    font-weight: bold;
    width: 100%;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 100%;
    text-align: center;
}

.friends {
    color: white;
    margin-top: 23px;
}

.count {
    color: white;
}

.friends .heading a {
    padding-right: 59px;
    color: white;
}

div#comments {
    position: absolute;
    top: 0;
    right: 0;
}

body > div > main > div.row.profile > div.col.right > div:nth-child(4) {
    width: 90%;
}

a {
    color: white;
    text-decoration: none;
}

.contact .icon, .award img {
    display: none;
}

body > div > main > div.row.profile > div.col.right > div:nth-child(4) {
    width: 90%;
}

.profile .friends .person img:not(.icon) {
    max-width: 95px;
    max-height: 95px;
    display: block;
    margin: 0 auto;
    border: 1px solid white;
    border-radius: 8px;
    box-shadow: 0 0 4px #960a0a;
}

footer {
    text-align: center;
    font-size: 70%;
    margin: 10px 0 10px;
    padding: 10px 5px;
    background-color: transparent;
}

.edit-info {
    background: linear-gradient(180deg, #e88092, pink);
    border: 1px solid deeppink;
    width: 100%;
    padding: 5px;
    overflow-wrap: break-word;
    word-break: break-word;
    color: white;
    box-shadow: inset 1px 2px 1px #ffffffb8, inset -1px -2px 1px #80064875;
}

.blog-entry .title, .bulletin .title, .blog-entry .content, .bulletin .content, .topic-box .content, .reply-box .content{
    color: white;
    background: linear-gradient(180deg, #ed798d, pink);
    border: 1px solid deeppink;
    box-shadow: inset 1px 2px 2px #ffffffd6, inset -1px -2px 2px #86084c7d;
    padding: 10px;
}

body > div > main > div > div.col.right > p {
    transform: translate(211px, -66px);
    background: linear-gradient(180deg, #ef6c83, pink);
    border: 1px solid deeppink;
    width: 36%;
    padding: 3px;
    color: white;

}

.blog-entry .title, .bulletin .title {
    margin: 3px 0 5px 0;
    overflow-wrap: break-word;
    word-break: break-word;
    width: 60%;
}

.blog-entry .content, .bulletin .content {
    transform: translate(15px, -56px);
    width: 80%;
}

body{ color: white!important; }

.blog-entry .profile-pic img, .bulletin .profile-pic img {
    max-width: 110px;
    max-height: 110px;
    border: 1px solid;
    border-radius: 8px;
    box-shadow: 0 0 4px 1px #7f0303;
}

.inner {
    color: white;
}
</style>

<style>
    /* !! FLOATING IMAGES !! */
</style>

<div style="float:  ; max-height: 800px; position: fixed; left: 350px; bottom: 15px; z-index: 200;"><img src="https://static.wikia.nocookie.net/p__/images/f/f9/MyMelody.png/revision/latest?cb=20210824094453&path-prefix=protagonist" width="200" height="auto"/>
</div>

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 20 of 50 comments ( View all | Add Comment )

sara⋆.ೃ࿔*:･	1733164284 usingggg tysm i love this!!!! Report Comment
Tristan	1731593216 Ussinng :D Report Comment
cilica	1722356002 using!!!!!!!!!! Report Comment
⍴іᥒgg᥆.kᥲ𝗍ᥡᥱ	1721690763 USADO!! ARRASOUXD Report Comment
PR3TTYLUL_MARIE♡	1715993135 cute!!! Report Comment
PR3TTYLUL_MARIE♡	1715993014 cute!!! Report Comment
mimi	1712748236 usíng!! :3 Report Comment
ㅤㅤㅤ	1712248366 using Report Comment
meiou	1710445306 hi! i tried to use the layout but the comments are really long and cover most of the screen, i dunno how to fix this Report Comment
francella	1709877464 i really like ur layouts, idk if this is a good place to req but have u ever thought of making a victoria secret (pink-white striped) themed layout ? Report Comment
Meat	1709609739 using!! Report Comment
l4in-1waKur4	1708631795 using Report Comment
𝖇umblebee.	1708489869 patrick spotted omg ..!! Report Comment
Stu	1708317451 using Report Comment
Sofx!	1708137510 using! Report Comment
XD	1707765371 Using! Report Comment
GhostPewl..	1707710222 Usinggg :P Report Comment
strawbs !	1707699155 using!! Report Comment
atlas	1707556218 using !! Report Comment
🍊Onyx🍊	1706789172 Using Report Comment