kokichi layout? idk bro

Tags: kokichi, kokichi oma, danganronpa, danganronpav3, gay, silly, >_<

Description:

just a kokichi layout! use if you wanna but PLEASE comment if you are, thanks dude!

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by ꒰ Aлекс (°ロ°) !!꒱ ‧₊ (https://layouts.spacehey.com/layout?id=98776) -->

<style>


body {
   background-color: #391594;
}
.top, .links, .heading, footer, button {
   background-color: #391594 !important;


<style>


<div class="star">
<style>
nav .links{
    text-align: center;
}
nav .links a{text-shadow:none;
}
nav .links a{text-shadow:none;}
nav .links li:not(:last-child)::after,
footer .links li:not(:last-child)::after{
    content: " ⭐";
    color: white;
    font-weight: bold;

</style>



<style>
.blurbs .inner{

text-align: center !important;

}
</style>





<style>.contact .inner a img {
    font-size: 0;
    }
    .contact .inner a img:before {
    font-size: 1em;
    display: block
   }
.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/s4-4IKQjvuWzNSi1qqznwW_v1sCg91trGEqpouFEj6mI=/https://64.media.tumblr.com/6a25882da98fd3e1390ee57243c4f744/b2e4be8b5593f8a7-11/s75x75_c1/8abcd0346dab3489b9b96fee138027f2e2585548.gif")
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url("https://external-media.spacehey.net/media/sqmkU0xqnEeMy47qQJXN1ZnOiKpLWnDe8SAgwHZtcv2s=/https://64.media.tumblr.com/cf33397e09c7465d38a2be6466648104/947c97dfa206d4c9-61/s75x75_c1/b9d09e9fd424b7c567034fb9780b2ae282d25611.gif")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url("https://external-media.spacehey.net/media/s23SqqI6wQwwZ1eL2FsoVvbJUQGaUKShDHtNZ2vtvJkE=/https://64.media.tumblr.com/91c466471e9f66969a27152a78223e30/f066cc2dc9f6b40e-5e/s75x75_c1/22cb6362d8198d39cc675f09062c73a5e24887d5.gif")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url("https://external-media.spacehey.net/media/shlmbE5yQibaMsPRiM602Nfi35EB1ly5MBVt4eWHiDAU=/https://64.media.tumblr.com/d33cf2038118dff1c96e923fe1b32f22/013e429117301de0-d1/s75x75_c1/3141383725eb08b0f908ceada6df99d17d0d9bb1.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/sX45Qey1hfDcNyCHfABRPvJq1G-tsNLI0cbefcN_aP_k=/https://64.media.tumblr.com/f3cebdb2b4e6d0bee8601769823f4201/1a96a4a8b5b8d3d6-ff/s75x75_c1/a17b06e500ad546588235178f772e892b4816676.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/sm2zVTGLpiOcdSxsaLgub3AXnvKSIsMhdxHG91nXD7p0=/https://64.media.tumblr.com/8fb0090a81aba9f6886ae7747df85600/0878db11fe52c667-34/s75x75_c1/e12d9f80160a3cd1b4bc1addda0b4888e01d8f80.gif")
}
.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/ss6Atzc3HlgLO21Ih0uMhQeP-6G4_fhDbnq1zG46ufJw=/https://64.media.tumblr.com/db10151470f3f6585f37a2764d02f679/2dd734ab964cca3f-d9/s75x75_c1/5962d5a0ab045b08a2c02c2bca8cd5148238a071.gif")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url("https://external-media.spacehey.net/media/sk4PFj0ME88bu-kcdSvSk0KDsua5dAWDILx2QlY9IW0s=/https://64.media.tumblr.com/ee8ba65bcb48ecca41f8575157cb658c/f066cc2dc9f6b40e-b1/s75x75_c1/3d6d67a1396426c30abf369f6f6b0bfbf143336d.gif")
}
</style>


<style>

.online{

content: url("https://media.tenor.com/Gl9DKp1plC8AAAAi/kokichi-sprite.gif") !important;

}
</style>





<style>
table.comments-table{

display: block;
height: 250px!important;
overflow-y: scroll;

}

}
h4 {
   color: #d446ba !important;
}
.contact, .url-info, .table-section, .profile-info {
   border-color: #110369 !important;
}
td {
   background-color: white !important;
}
input, button:not(.logout-btn) {
   border: 1px groove #111236 !important;
}
.row.profile {
   border: 1px dashed #0e1159 !important;
}
.logo-fallback {
   height: 38px !important;
}

</style>

<style>
    .top{
        
    color: white;
        
    }    
    main{

    color: white !important;
        
    }
    footer{
        
    color: white;
        
    }
</style>

<style>
   :root {
--logo-blue: black;
--darker-blue: #7607f5;
--lighter-blue:black;
--even-lighter-blue: white;
--lightest-blue:black;
--dark-orange: white;
--light-orange:black;
--even-lighter-orange:black;
--green:black;
}
</style>

<style>
    .comments-table td{
        
    background-color: #b073f5 !important;
        
    }
</style>


<style>



h1{

  animation: type 3s steps(27);

  color: white;

  font-size: 10px;

  font-family: courier;

  white-space: nowrap;

  overflow: hidden;

 }

@keyframes type{

  0%{

    width:0ch;

  }

  

  100%{

    width:27ch;

  }

}

@keyframes blink{

  0%{opacity:1;}

  50%{opacity:0;}

  100%{opacity:1;}

}

body::before {

content: " ";

display: block;

position: fixed;

top: 0;

left: 0;

bottom: 0;

right: 0;

background: linear-gradient(rgb(82 15 15 / 48%) 50%, rgb(0 0 0 / 0%) 50%);

z-index: 2;

background-size: 100% 2px, 3px 100%;

pointer-events: none;

}

.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}

.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

animation-iteration-count: infinite;

animation-timing-function: ease-in-out;

}

@keyframes float {

0% { transform: translate(0, 0px);

}

50% {

transform: translate(0, 8px);

}

100% {

transform: translate(0, -0px);

}

<style>
</style>

<style>
    main{
     
    background-color: black !important;
   
        
    }
</style>

<style>
    table.details-table{
        
    background-color: #a054f7 !important;
 
        
    }
    .profile .details-table td{
        
    background-color: #a054f7 !important;
    
    }
</style>

<style>
    table.details-table{
        
border: 1px solid white !important;   
        
    }
    .profile .details-table td{

border: 1px solid white !important;   

    }
</style>


 <style>

body { cursor: url(http://www.rw-designer.com/cursor-view/135408.png), default; }

</style> 
<style>main:before {
	width: 100%;
	height: 200px ;
	display: block;
	content: ""; 
	background-image: url('https://i.pinimg.com/564x/c7/1c/df/c71cdfc77c43da9489cc08b8732564b1.jpg');
	background-position: top;
	background-size: cover;
}
@media only screen and (max-width: 500px) {
	main:before{
		height: 200px;
	}
</style>



<style>
    .profile{direction: rtl;}
.blog-preview{direction: ltr; text-align: center;}
    .blurbs{direction: ltr;}
    .friends{direction: ltr;}
    .general-info{direction: ltr;}
.profile .left h1{direction: ltr;}
    .details-table{direction: ltr;}
    .profile .table-section .heading{direction: ltr;}
    .details p{direction: ltr;}
	.mood{direction: ltr; text-align: right;}
.contact .heading {display: none !important;}
.url-info{direction: ltr; text-align: right;}
</style> 








<style>
/* replace with cd image that has transparent background. must be 150px by 150px. */
:root {
--cd-image: url('https://fluorescent-lights.neocities.org/Digital-CD-Disk-Vector-Transparent-PNG.png');
}
.profile-pic {
position: relative;
width: 183px;
filter: drop-shadow(0 0 0.25rem gray);
}
.profile-pic:after {
content: "";
background: url('https://fluorescent-lights.neocities.org/f0rzNHe.png'), linear-gradient(150deg, rgba(255,255,255,0.4), rgba(255,255,255,0.2), 40%, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.6));
background-size: contain, cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.profile-pic:before {
content: "";
background: var(--cd-image);
position: absolute;
top: 5px;
left: -20px;
width: 150px;
height: 150px;
background-repeat: no-repeat;
z-index: -1;
animation-name: spin;
animation-duration: 5000ms;
animation-iteration-count: infinite;
animation-timing-function: linear; 
transition: left ease 0.5s;
}
.profile-pic:hover:before {
left: -75px;
}
@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
.profile-pic .pfp-fallback {
float: right;
width: 163px;
height: 160px;
border: none;
}
.general-about .profile-pic img {
max-width: inherit;
}
</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 )

felix	1720855448 using :3 Report Comment
K0KICHI	1719600661 using!! Report Comment
moz 🎻	1717646435 using! :3 Report Comment
Mioko Akise ^^	1715619592 using ^^ Report Comment
Spookie !!	1715471039 usinggg :33 Report Comment
Lonniiee	1714163387 Usingg Report Comment
Hoxton	1713753939 usingggg tyyyy Report Comment
𝓢𝓾𝓲𝓬𝓲𝓭𝓮	1712882747 Used:3 Report Comment
Kokishit	1712714166 Use itrrtrrrrr Report Comment
˚ʚ♡ɞ˚Jasper˚ʚ♡ɞ˚	1709315264 using! Report Comment
[ #1 rody fan ] toms ,,	1708230395 using!! >< Report Comment