Vocaloid (Hatsune Miku)

Tags: miku, vocaloid, teal, blue, cyan, hatsune miku, hatsune, 2000s, anime, music

Description:

A Miku-themed profile layout I made for fun. Please do not remove the watermark if you use it and please do not steal this and claim it as your own. Please comment before using.

Preview:

click on the image for a larger preview

Code:

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

<style>
:root {
    --teal: #005852;
    --bright-teal: #00ffee;
}

body {
    font-family: arial, sans-serif;
    font-size: 11pt;
    background: url(https://external-media.spacehey.net/media/sM3JlpJWcVYk6IjR50I-ql5luIuG_OhLvuEAQngnZ9M0=/https://taiketsu.neocities.org/storage/hatsunemikumix.jpg) center top no-repeat #000;
    margin-top: 15px;
}
.profile-info {
    border: 4px var(--teal) double;
    padding: 0px;
}
p {
    color: var(--bright-teal);
}
h1 {
    color: var(--bright-teal);
    padding: 0px;
}
a {
    color: var(--bright-teal);    
}
main {
    background: none;
    padding: 0px;
    width: 956px;
    left: -73px;
    position: relative;

}
.mood b {
    text-transform: lowercase;
}
h4 {
    color: var(--bright-teal) !important;  
    text-transform: lowercase;
}
h3 {
    color: var(--bright-teal);  
    text-transform: lowercase;
}
h2 {
    color: var(--bright-teal);  
    text-transform: lowercase;
}
nav .top {
    background: none;    
    width: 956px;
    left: -73px;
    position: relative;
}
nav .links {
    background: none;
}
nav .links a {
    text-shadow: none;
    color: var(--bright-teal); 
}
nav .links a:hover {
    color: var(--bright-teal); 
}
nav .links li:after {
    display: none;
}
nav .links a {
    border: 1px var(--teal) solid;
    background: linear-gradient(var(--teal), transparent);
    padding: 2px 14px;
}
nav .links a:hover {
    border: 1px var(--bright-teal) solid;
    background: linear-gradient(var(--bright-teal), transparent);
    text-shadow: 0px 0px 1px var(--teal) !important;
    text-decoration: none;
}
nav .links {
    text-transform: lowercase;
    display: flex;
    justify-content: center;
    gap: 3px;
    padding: 0px;
}
nav .links .icon {
    display: none;
}
.profile .contact .heading {
    background: linear-gradient(var(--teal), transparent);
    color: var(--bright-teal);
}
.profile .contact {
    border: 1px var(--teal) solid;
    text-transform: lowercase;
}
.profile .contact a {
    font-size: 9pt;
}
.profile .url-info {
    border: 1px var(--teal) solid;
}
.profile .table-section {
    text-transform: lowercase;
    border: 1px var(--teal) solid;
}
.profile .table-section .heading {
    background: linear-gradient(var(--teal), transparent);
    color: var(--bright-teal);
}
.details-table td {
    background: linear-gradient(var(--teal), transparent) !important;  
    border: 1px var(--teal) solid;
}
.profile .blurbs .heading {
    background: linear-gradient(var(--teal), transparent);
    border: 1px var(--teal) solid;
}
.profile .friends .heading {
    background: linear-gradient(var(--teal), transparent); 
    border: 1px var(--teal) solid;
}
.inner > p b {
    text-transform: lowercase;
}
.comments-table a p {
    text-transform: lowercase;    
}
.report a {
    text-transform: lowercase;
}
small {
    text-transform: lowercase;
}
.comments-table {
    background: none;
    border: 0px;
}
.comments-table td {
    background: linear-gradient(var(--teal), transparent 20%) !important; 
}
.comment-replies {
    border: 0px;
}
.profile .friends .person p {
    text-transform: lowercase;
    color: var(--bright-teal);
}
label {
    text-transform: lowercase;
    color: var(--bright-teal);
}
.top .right {
    text-transform: lowercase;
    color: var(--bright-teal);    
}
.logout-btn {
    text-transform: lowercase;
    color: var(--bright-teal);      
}
button {
    border: 1px var(--teal) solid;
    background: linear-gradient(var(--teal), transparent);
    color: var(--bright-teal);
    padding: 2px 10px;    
}
button:hover {
    border: 1px var(--bright-teal) solid;
    background: linear-gradient(var(--bright-teal), transparent);
    text-shadow: 0px 0px 1px var(--teal) !important;
    text-decoration: none;
    cursor: pointer;
}
nav .top .center .search-wrapper input {
    background: linear-gradient(var(--teal), transparent);
    color: var(--bright-teal);    
    border: 1px var(--teal) solid;
    padding: 2px;
}
footer {
    background: none;
    text-transform: lowercase;
}
</style>
<div class="watermark">
<a href="https://spacehey.com/orihime"><img src="https://taiketsu.neocities.org/storage/mikuwatermark.png"/></a>
</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 168 comments ( View all | Add Comment )

saltedd_.	1756659283 using !! Report Comment
valth	1755137994 usingg (˶˃ ᵕ ˂˶) Report Comment
Niko!	1754582182 usingg!! Report Comment
jade	1754203795 usingg Report Comment
Kxy Cw	1753048398 using! Report Comment
𝓼𝓴𝓪𝓻𝔂!	1753047336 using! Report Comment
Ash	1750701874 Usandooo Report Comment
POKE!! ヘ⁠（⁠。⁠□⁠°⁠）⁠ヘ	1750016944 using!! ^u^ Report Comment
illi	1749665050 using Report Comment
illi	1749665050 using Report Comment
tniyah	1748130515 using Report Comment
Mr Rat	1746440957 using Report Comment
✜ .ᐟ CITY 𖦹	1746374620 Using Report Comment
Época	1746205095 using!!! Report Comment
anomynousyuri	1745744535 using!! Report Comment
💥 CAPSAICIN 💥	1745704309 using!! ^w^ Report Comment
Eli	1745382370 using Report Comment
DUSKiiii	1745077804 Using ^w^ Report Comment
kat	1744054492 using! Report Comment
PR3ST0N ( ˶°ㅁ°) !!	1743828994 using !! :D Report Comment