TROLLIAN

Tags: homestuck, pesterchum, trollian

Description:

!Important!: on the line that reads ":root{--blood-color: #0021bc;}" replace the hex code with your preferred blood color, or it will default to indigo!

Makes your page look like Trollian, the other fictional chat client from Homestuck 8)

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.0

Preview:

click on the image for a larger preview

Code:

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

<style>
  /*
    TROLLIAN THEME
    LAYOUT MADE BY https://spacehey.com/sigmundfreud
    V1.0 May 11 2022
  */
  @import url('https://fonts.googleapis.com/css2?family=Goldman:wght@700&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');}
  /*HEMO2PECTRUM COLOR GUIDE
    RED:#FF0000, RU2T: #a00103, BRONZE: #a25203, GOLD: #a1a100, LIIME: #678900, OLIIVE: #416600, JADE: #078446, TEAL: #008282, CERULEAN: #004182, IINDIIGO:#0021bc, PURPLE: #440a7f, VIIOLET:#6a006a, FU2CHIIA: #99004a
  */
  /*WHAT COLOR II2 YOUR BLOOD TYPE IIT THE HEX CODE IIN THE LIINE AFTER THII2 COMMENT*/
  :root{--blood-color: #0021bc;}

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

  /*changes spacehey logo with pesterchum logo*/
  img.logo{
      content: url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/d2088517-f55c-4148-a27e-3f86a088d9a8/d6kbqgq-a9b912fb-2889-4af5-bf00-6f301fe091ba.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcL2QyMDg4NTE3LWY1NWMtNDE0OC1hMjdlLTNmODZhMDg4ZDlhOFwvZDZrYnFncS1hOWI5MTJmYi0yODg5LTRhZjUtYmYwMC02ZjMwMWZlMDkxYmEucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.52KZA1rVvBEtsy7u3vRenXP28lUswtbQJWISkM1FLxY");
      width: 63px !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*/
  h1{
      font-family: 'Goldman', monospace !important;
      font-size: 3em !important;
      color: #323232;
      text-transform: uppercase;
      font-style: italic;
      text-shadow: 3px 0px 0 gray;
  }

  .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 var(--darker-blue);
      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 var(--darker-blue) !important;
      background-color: black;
      color: white;
  }

  .w-40.left:after {
    display: block;
    content: "";
    background-image: url("https://64.media.tumblr.com/9283c60f44bb5480ab5c20176f0bceda/tumblr_npdr1iLioV1uxvldxo1_400.gifv");
    background-repeat: no-repeat;
    background-size: cover;
    height: 291px;
    background-color: var(--darker-blue);
    background-position: center;
    border: medium var(--darker-blue) solid !important;
  }

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

  .online img{
      max-width: 15px;
      max-height: 15px;
      content: url("https://static.wikia.nocookie.net/mspaintadventures/images/e/eb/SburbAlpha_Logo.svg/revision/latest/scale-to-width-down/512?cb=20200130061041")
  }

  .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: #B2B2B2;
      color: black !important;
  }
  .details-table td:first-child{
      text-transform: uppercase;
      text-align: center;
      width: 50px;
  }

  /*right side*/
  .col.right{
      background-color: #4d4d4d;
      font-family: Courier, monospace;
      font-size: 1.25em;
  }

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

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

  .profile-info .inner, .blog-preview{background-color: #B2B2B2; border: 3px solid var(--darker-blue);}

  .right .heading{
      font-family: 'VT323', monospace;
      font-size: 1.25em;
      border-top-left-radius: 20px 20px; border-top-right-radius: 20px 20px;
      background: linear-gradient(90deg, var(--logo-blue) 50%, var(--darker-blue) 100%) !important;
  }

  .right .inner, .count{
      color: gray !important;
  }

  .blurbs p{
    color: var(--blood-color) !important;
    font-weight: bold;
  }
  /*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 354 comments ( View all | Add Comment )

LambChops	1789623800 USING THANK UUU<3 Report Comment
Notty	1788749582 usin. fuck yes Report Comment
𓆤 -Buzz3Er-𓆤	1788037171 using Report Comment
atrophicGalactolipid	1786735263 using!! Report Comment
anore macintosh	1786426604 USING 👀👀👀 Report Comment
geniusparasite	1785309933 using..!!!!!!!! Report Comment
flushedCrusher	1783290009 using! :33 Report Comment
Xefros!	1779036726 uuuusssiiiiinggg!! X:) Report Comment
𝓝𝓪𝓷𝓪 🪽.𖥔 ݁	1776349180 USINGG :3 Report Comment
Harpyja	1775517095 Using!!! Report Comment
twinArmageddons	1774794751 Using :] Report Comment
skyefrfr	1773380107 Using! Report Comment
hollisticZeal	1773099184 using !!!!! Report Comment
Vioonic	1772826640 using!! Report Comment
bugbreath100	1772422313 using :B Report Comment
Eren	1772156274 USING. Report Comment
n♡va	1772095997 usingg Report Comment
InternetAlien	1771202750 Using Report Comment
Luu	1771176172 Jsinggg Report Comment
RUSTUNA	1770577657 using :] Report Comment