Pesterchum

Tags: homestuck, pesterchum

Description:

Makes your page look like Pesterchum, the fictional chat client from Homestuck :o)

If you find anything that looks wrong, just let me know in the comments and I'll patch it in an update.

!!please credit if used!!

Current Version: 1.1

Patch note: added support for different blood colors

Preview:

click on the image for a larger preview

Code:

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

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

<style>
  /*
    PESTERCHUM THEME
    LAYOUT MADE BY https://spacehey.com/sigmundfreud
    V1.0 May 1 2022
  */
  @import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
  @font-face {
      font-family: 'header';
      src: url('https://external-media.spacehey.net/media/smPo_RcgKw6ohoWFs5gvUAFyiNe_1fW3lSRa0eldvH40=/https://file.garden/X1htvgJ0DEp_tp-Z/MSPFA%20other/fontstuck.ttf');
  }
  /*HEMOSPECTRUM COLOR GUIDE
    RED:#FF0000, RUST: #a00103, BRONZE: #a25203, GOLD: #a1a100, LIME: #678900, OLIVE: #416600, JADE: #078446, TEAL: #008282, CERULEAN: #004182, INDIGO:#0021bc, PURPLE: #440a7f, VIIOLET:#6a006a, FUSCHIIA: #99004a
  */
  :root{--blood-color: grey;}

  :root {
      --logo-blue: #F4B840;
      --lighter-blue: black;
      --darker-blue: #BB8B2E;
      --light-orange: var(--logo-blue);
      --dark-orange: black;
  }

  /*changes spacehey logo with pesterchum logo*/
  img.logo{
      content: url("https://64.media.tumblr.com/60dd3f38dc8001e311d9d2ce492e7e2a/f4c16ad79c503265-9c/s2048x3072/4930b5bc4aae0b7f40d4b40460c646b92d45804a.png");
      width: 103px !important;
      height: 63px !important;
  }
  .top{ padding-bottom: 5px !important; padding-top: 8px !important;}

  /*general shennanigans*/
  .container{ width: 100%; }
  main{ padding-left: 10px;padding-right: 10px;}
  body, main, footer{background-color: black !important;}

  /*left side*/
  .blurbs p{color: var(--blood-color) !important;}

  h1{
      font-family: header, monospace !important;
      font-size: 2em !important;
      color: white
  }

  .col.left, .links, .top{
      font-family: 'VT323', monospace;
      font-size: 1.25em;
  }

  .links{text-align: center;}

  nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
      content: " ▪ ";
      color: white;
  }

  .col.left{
      width: 30%;
      border: 3px solid yellow;
      background-color: var(--logo-blue);
  }

  .col.left a{color: white;}

  .details{padding-bottom: 60px;}

  .details, .mood, .contact, .url-info, .table-section{
      margin-bottom: 10px;
      border: 3px solid yellow !important;
      background-color: black;
      color: white;
  }

  .profile-pic img{
      margin: 20px;
  }

  .online img{
      max-width: 15px;
      max-height: 15px;
      content: url("https://external-preview.redd.it/857aq6Jb7SnQv5v0QcTPsJ5UlkXC9JaPF9xoI2rzje8.jpg?auto=webp&s=86be4c4a49af01bf51a4dfc3b7c006fc1ee5a591")
  }

  .online{color: var(--logo-blue);}

  .links{
      background-color: var(--darker-blue)!important;
  }

  .details-table {background-color: var(--darker-blue);}
  .details-table td, .details-table td:first-child, .details-table a, .details-table p{
      background-color: yellow;
      color: black !important;
  }
  .details-table td:first-child{
      text-transform: uppercase;
      text-align: center;
  }

  /*right side*/
  .col.right{
      border: 3px solid yellow;
      background-color: var(--logo-blue);
      font-family: Courier, monospace;
      font-size: 1.25em;
  }

  .right .inner, .blog-preview{
      background-color: white;
      border: 3px solid var(--darker-blue);
  }

  .blog-preview{padding-left: 10px;}

  .right .heading{
      font-family: 'VT323', monospace;
      font-size: 1.25em;
  }

  .right .inner, .count{
      color: gray !important;
  }
  /*THIS WAS MADE BY https://spacehey.com/sigmundfreud*/
  .profile-info{
      padding: 0px;
      border: none;
  }

  .profile-info .inner{
      padding-right: 35%;
      padding-left: 35%;
  }

  /*comments*/
  .comments-table td, .comments-table td:first-child{background-color:white;}
  .comments-table td:first-child {width: 90px;}
  #comments{margin-top: 30px;}
  .comment-replies{
      border: none;
      padding-top: 0;
      margin-left: 20px;
      margin-top: 0;
    }
  small, .comment-reply b{font-size: 10px !important;}
  table.comments-table{
      display: block;
      height: 400px!important;
      overflow-y: scroll;
  }

  button {
    border: none;
    background-color: rgba(0,0,0, .25);
  }
</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 20 of 122 comments ( View all | Add Comment )

rocooo	1701303965 yup, definitely jsing Report Comment
dr swag 2	1701237019 using!! Report Comment
AL13NB0Y	1700935605 Using :3 Report Comment
shotgun~	1700815513 using!!:3 Report Comment
ezra :3	1700607323 USING! :) Report Comment
CrabbyJade	1700520770 using! Report Comment
PERSEUS ৴ NICO	1700207285 using Report Comment
Ezra	1699647014 definitely using Report Comment
Awesomo_bot	1699634573 Using! Report Comment
gumball	1699471161 using !! Report Comment
EdgyGoon	1699213448 USSINGGGGGG Report Comment
S1llycat	1699040910 using Report Comment
Sal	1698985655 using! Report Comment
turntechDave	1698512116 using Report Comment
lloyd	1697842949 USING Report Comment
Mars	1696947828 usingggg ;33333333 Report Comment
celestyn	1696855817 using ! Report Comment
Confetti/John	1696504363 using :33 Report Comment
xstaryzz	1696350898 using! Report Comment