API tools faq
paste
Advertisement
spacialfries

Homestuck Template

spacialfries
Jun 5th, 2021 (edited)
1,349
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 9.63 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. Please do not remove the code credit!
  4. This is my only rule; please follow it or I will cry <:'O
  5.  
  6. ---
  7.  
  8. If you want to change the template's colour, search for '#FF0000' and replace it with your preferred colour code!
  9. If the your text colour doesn't show up well, replace '#EFEFEF' with '#101010' for a dark mode type of background.
  10.  
  11. ---
  12.  
  13. Here's the hemospectrum hexcodes for easy replacement if you want them!
  14. Note that these are from the extended hemospectrum so they're different than the actual in-comic text.
  15.  
  16. RUST: #A20000
  17. BRONZE: #A15203
  18. GOLD: #A1A101
  19. LIME: #678900
  20. GREEN: #336601
  21. JADE: #088446
  22. TEAL: #008282
  23. CERULEAN: #004183
  24. INDIGO: #0121CC
  25. PURPLE: #450A80
  26. VIOLET: #6A016A
  27. FUCHSIA: #99014E
  28.  
  29. ANON/GREY: #626262
  30.  
  31.  
  32. -->
  33.  
  34. <div class="container card card-block rounded-0" style="border: 5px solid #FF0000; background-color: #FF0000; font-family: 'Courier New', monospace; color: #FF0000; font-weight: bold;">
  35.      <div class="row m-1">
  36.          
  37.          <div class="col-md-3 card rounded-0 text-center" style=" display: inline-block; border: 5px solid #FF0000; height: 200px; background-color: #EFEFEF;">
  38.              
  39.              <!--Character's image goes here.-->
  40.              <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png" style="max-height: 100%;">
  41.              
  42.          </div>
  43.          
  44.          <div class="col-md-7 card card-block rounded-0" style="border: 5px solid #FF0000; display: inline-block; height: 200px; overflow: auto; background-color: #EFEFEF;">
  45.              
  46.              <h1 style="font-weight: bold;"><!--Character's name goes here.-->
  47.                  Character Name
  48.                  
  49.                  <span style="float: right;"><!--Character's class/aspect goes here, e.g. Heir of Light.-->
  50.                      Class of Aspect
  51.                  </span>
  52.                  
  53.              </h1>
  54.              
  55.              <h3 style="font-weight: bold;"><!--Character's screenname (Pesterchum, Trollian, BettyBother, etc. goes here.-->
  56.                  screenName
  57.              </h3>
  58.              
  59.              <hr style="border-color: #FF0000;">
  60.              
  61.              <p>
  62.                  Put a paragraph here with an example of what the user's quirk looks
  63.                  like when they type! It should be a little long, but not too long.
  64.                  It'll add a scroll bar if it gets too big, so no need to worry!
  65.              </p>
  66.              
  67.          </div>
  68.          
  69.          <div class="col-md-2 card rounded-0 text-center" style="display: inline; border: 5px solid #00E470; height: 200px; background-color: #FFFFFF;">
  70.              
  71.              <!--Character's strife specibus image goes here.-->
  72.              <img src="https://static.wikia.nocookie.net/mspaintadventures/images/6/63/Bladekind_icon.png" style="max-height: 80%;"><br>
  73.              <!--Character's strife specibus goes here.-->
  74.              ???kind
  75.              
  76.          </div>
  77.          
  78.          <div class="col-md-8 card card-block rounded-0" style="border: 5px solid #FF0000; height: 300px; overflow: auto; display: inline-block; background-color: #EFEFEF;">
  79.              
  80.              <h3 style="font-weight: bold;">About/Story</h3>
  81.              
  82.              <hr style="border-color: #FF0000;">
  83.              
  84.              <p>
  85.                  Write some stuff about your charcter or their story here. Make this as long as you want! A scroll bar will be added automatically if it gets too big for the container.
  86.                  
  87.                  Quisque vel risus id massa facilisis fermentum ac a ipsum. Integer pulvinar vel augue quis congue. Vestibulum a congue diam. Praesent lacus lorem, gravida nec accumsan vel, malesuada eget nibh. Cras ac congue nibh, sed finibus mauris. Vestibulum vel pretium eros. Praesent lorem urna, mollis et dignissim sed, tempus at nisl. Proin faucibus porttitor dolor, at tempor risus pulvinar et. Phasellus vitae urna lectus. Donec maximus feugiat mollis. Vestibulum lobortis nulla nisi, et feugiat justo bibendum ac.
  88.              </p>
  89.              
  90.          </div>
  91.          
  92.          <div class="col-md-2 card card-block rounded-0 text-left" style="border: 5px solid #FF0000; height: 300px; display: inline-block; background-color: #EFEFEF;">
  93.              
  94.              <h3 class="text-center" style="font-weight: bold;">Likes</h3>
  95.              
  96.              <hr style="border-color: #FF0000;">
  97.              
  98.              <ul>
  99.                  <li>One</li>
  100.                  <li>Two</li>
  101.                  <li>Three</li>
  102.                  <li>Four</li>
  103.                  <li>Five</li>
  104.              </ul>
  105.              
  106.          </div>
  107.          
  108.          <div class="col-md-2 card card-block rounded-0 text-left" style="border: 5px solid #FF0000; height: 300px; display: inline-block; background-color: #EFEFEF;">
  109.              
  110.              <h3 class="text-center" style="font-weight: bold;">Dislikes</h3>
  111.              
  112.              <hr style="border-color: #FF0000;">
  113.              
  114.              <ul>
  115.                  <li>One</li>
  116.                  <li>Two</li>
  117.                  <li>Three</li>
  118.                  <li>Four</li>
  119.                  <li>Five</li>
  120.              </ul>
  121.              
  122.          </div>
  123.          
  124.          <div class="col-md-12 card card-block rounded-0 text-center" style="border: 5px solid #FF0000; display: inline-block; background-color: #EFEFEF;">
  125.              
  126.              <h3 class="text-center" style="font-weight: bold;">Relations</h3>
  127.              
  128.              <hr style="border-color: #FF0000;">
  129.              
  130.              <!--Try to use square images here; images of varying heights will look uneven.-->
  131.              
  132.              <div class="row">
  133.                  
  134.                  <div class="col">
  135.                      <a href="" style="font-weight: bold;"><!--Link to character's page goes here.-->
  136.                          <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png"><!--Character image goes here.-->
  137.                          Name
  138.                      </a>
  139.                  </div>
  140.                  
  141.                  <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
  142.                  
  143.                  <div class="col">
  144.                      <a href="" style="font-weight: bold;"><!--Link to character's page goes here.-->
  145.                          <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png"><!--Character image goes here.-->
  146.                          Name
  147.                      </a>
  148.                  </div>
  149.                  
  150.                  <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
  151.                  
  152.                  <div class="col">
  153.                      <a href="" style="font-weight: bold;"><!--Link to character's page goes here.-->
  154.                          <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png"><!--Character image goes here.-->
  155.                          Name
  156.                      </a>
  157.                  </div>
  158.                  
  159.                  <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
  160.                  
  161.                  <div class="col">
  162.                      <a href="" style="font-weight: bold;"><!--Link to character's page goes here.-->
  163.                          <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png"><!--Character image goes here.-->
  164.                          Name
  165.                      </a>
  166.                  </div>
  167.                  
  168.                  <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
  169.                  
  170.                  <div class="col">
  171.                      <a href="" style="font-weight: bold;"><!--Link to character's page goes here.-->
  172.                          <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png"><!--Character image goes here.-->
  173.                          Name
  174.                      </a>
  175.                  </div>
  176.                  
  177.                  <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
  178.                  
  179.                  <div class="col">
  180.                      <a href="" style="font-weight: bold;"><!--Link to character's page goes here.-->
  181.                          <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png"><!--Character image goes here.-->
  182.                          Name
  183.                      </a>
  184.                  </div>
  185.                  
  186.                  <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
  187.                  
  188.                  <div class="col">
  189.                      <a href="" style="font-weight: bold;"><!--Link to character's page goes here.-->
  190.                          <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png"><!--Character image goes here.-->
  191.                          Name
  192.                      </a>
  193.                  </div>
  194.                  
  195.                  <!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
  196.                  
  197.                  <div class="col">
  198.                      <a href="" style="font-weight: bold;"><!--Link to character's page goes here.-->
  199.                          <img src="https://f2.toyhou.se/file/f2-toyhou-se/watermarks/20399932_6kcvFtzqX.png"><!--Character image goes here.-->
  200.                          Name
  201.                      </a>
  202.                  </div>
  203.                  
  204.              </div>
  205.          </div>
  206.      </div>
  207.      
  208.      <div class="card rounded-0 text-center" style="border: 5px solid #FF0000; display: inline-block; background-color: #EFEFEF; font-weight: bold;">
  209.        
  210.        <sub>template ==> @nightlustrous</sub>
  211.        
  212.      </div>
  213. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!