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 370 comments ( View all | Add Comment )

Damien :33	1786159402 :33 < using! Report Comment
fetus	1786051155 using!! ts peak Report Comment
Curly	1785392378 Absolutely using! 🥹 Report Comment
David	1783638778 using! Report Comment
Lee	1783406344 using 👀 Report Comment
brandon / brandie	1781660251 using Report Comment
June (≥ヮ≤)Ⳋ	1781102705 Usinggggg Report Comment
huntingcentaur	1780172203 using. Report Comment
kryptoBLUHG	1779656219 US11111111111111111111NGGGGGGGGGGGG!!!!!! Report Comment
ludic0s	1778048341 using! Report Comment
redward	1774918740 USING Report Comment
Laurel	1774500829 Using!! Report Comment
John egbert	1773758064 using Report Comment
jayjayd2d	1773588181 using Report Comment
terminallyCapricious	1773246230 USING!! Report Comment
yoylefef	1772898373 using! Report Comment
Haven Iwakura	1771981726 using! Report Comment
dave / yuki	1771747294 using!!! :3 Report Comment
zee	1771046428 using Report Comment
violentViolinist	1770012425 usinggg!! Report Comment