API tools faq
paste
vermilly

vedat

vermilly
Aug 2nd, 2025
133
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 14.87 KB | None | 0 0
raw download clone embed print report
  1. <!------
  2.  
  3.    [F2U] 6.Utilitarian
  4.    CODE BY MyUniverseinaBox @ TOYHOU.SE
  5.    
  6.    accent colour: #bec647
  7.    
  8.    //////// RULES ////////
  9.    
  10.    -> Do not redistribute this template, it's for personal use only
  11.    -> Please keep credit somewhere visible
  12.    -> Feel free to change everything else to your liking
  13.    
  14.    Thankyou for using this template!
  15.            
  16. ---------------------------------------------->
  17. <!--------------------------------------------
  18.  
  19.        [ CONTAINER + FONT SETUP ]
  20.        
  21. ----------------------------------------------->
  22. <div class="m-0 p-3 mx-auto" style="background: #1b1c1c url(https://file.garden/ZdljYOgxzVCR-7lA/for%20codes/gridmeDARK.png); max-width: 1360px;">
  23.     <div class="mx-auto mx-2" style="
  24.                 font-size:.65rem;
  25.                 color:#b0b6b6;
  26.                 letter-spacing: .4px;">
  27. <!--------------------------------------------
  28.         IMAGE HEADER
  29. ----------------------------------------------->
  30.         <div class="row no-gutters card p-2 rounded-0" style="min-height:160px; background: #1b1c1c; border-color: #373838;">
  31.             <div class="card-block rounded-0" style="
  32.  background: #000 url(https://f2.toyhou.se/file/f2-toyhou-se/images/104770686_0ZWpHPSF2CEuwwu.png)
  33.   fixed center;background-size:cover;"></div>
  34.         </div>
  35. <!--------------------------------------------
  36.         IMAGE HEADER END
  37. ----------------------------------------------->
  38. <!--------------------------------------------
  39.  
  40.        [ MAIN CONTENT ]
  41.        
  42. ----------------------------------------------->
  43.         <div class="row no-gutters">
  44.             <div class="col-md-12 col-sm-12 row no-gutters">
  45.                 <div class="card rounded-0 p-2 mt-2" style="background: #1b1c1c; border-color: #373838;">
  46.                     <div class="row no-gutters">
  47. <!--------------------------------------------
  48.  
  49.        [ FIRST COLUMN  ]
  50.        
  51. ----------------------------------------------->
  52.                         <div class="mt-n5 col-md-2 col-sm-4 row no-gutters card bg-transparent border-0">
  53. <!--------------------------------------------
  54.        AVATAR
  55. ----------------------------------------------->
  56.                             <div class="card p-2 rounded-0 mb-2" style="height: 190px; background: #1b1c1c; border-color: #373838;">
  57.                                 <!--- icon -------------------->
  58.                                 <div class="card rounded-0 border-0 flex-fill" style="
  59.                    
  60.                  background: #000 url(https://f2.toyhou.se/file/f2-toyhou-se/characters/24691499?1754179426);
  61.                            
  62.                            background-size:cover; background-position:center;">
  63.                                 </div>
  64.                                 <!--- icon end -------------------->
  65.                             </div>
  66. <!--------------------------------------------
  67.        AVATAR END
  68. ----------------------------------------------->
  69. <!--------------------------------------------
  70.        BASIC INFO
  71. ----------------------------------------------->
  72.                             <!--- name -------------------->
  73.                             <div class="row no-gutters mb-2">
  74.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  75.                                 <div class="col card rounded-0 px-2 py-1" style="background: #1b1c1c; border-color: #373838;">
  76.                                     <div class="text-uppercase" style="color: #bec647;"> name</div> vedat
  77.                                 </div>
  78.                             </div>
  79.                             <!--- name end -------------------->
  80.                            
  81.                        
  82.                             <!--- gender / pronouns -------------------->
  83.                             <div class="row no-gutters mb-2">
  84.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  85.                                 <div class="col card rounded-0 px-2 py-1" style="background: #1b1c1c; border-color: #373838;">
  86.                                     <div class="text-uppercase" style="color: #bec647;"> gender</div> male [he/they]
  87.                                 </div>
  88.                             </div>
  89.                             <!--- gender / pronouns end -------------------->
  90.                             <!--- age -------------------->
  91.                             <div class="row no-gutters mb-2">
  92.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  93.                                 <div class="col card rounded-0 px-2 py-1" style="background: #1b1c1c; border-color: #373838;">
  94.                                     <div class="text-uppercase" style="color: #bec647;"> age</div> late 20s [until death]
  95.                                 </div>
  96.                             </div>
  97.                             <!--- age end -------------------->
  98.                             <!--- species -------------------->
  99.                             <div class="row no-gutters mb-2">
  100.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  101.                                 <div class="col card rounded-0 px-2 py-1" style="background: #1b1c1c; border-color: #373838;">
  102.                                     <div class="text-uppercase" style="color: #bec647;"> species</div> human
  103.                                 </div>
  104.                             </div>
  105.                             <!--- species end -------------------->
  106.                             <!--- height -------------------->
  107.                             <div class="row no-gutters mb-2">
  108.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  109.                                 <div class="col card rounded-0 px-2 py-1" style="background: #1b1c1c; border-color: #373838;">
  110.                                     <div class="text-uppercase" style="color: #bec647;"> height</div> 5'6" | 167 cm
  111.                                 </div>
  112.                             </div>
  113.                             <!--- height end -------------------->
  114.                             <!--- sexuality -------------------->
  115.                             <div class="row no-gutters mb-2">
  116.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  117.                                 <div class="col card rounded-0 px-2 py-1" style="background: #1b1c1c; border-color: #373838;">
  118.                                     <div class="text-uppercase" style="color: #bec647;"> sexuality</div> asexual & vaguely gay
  119.                                 </div>
  120.                             </div>
  121.                             <!--- sexuality end -------------------->
  122.                            
  123.                                 <!--- occupation -------------------->
  124.                             <div class="row no-gutters mb-2">
  125.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  126.                                 <div class="col card rounded-0 px-2 py-1" style="background: #1b1c1c; border-color: #373838;">
  127.                                     <div class="text-uppercase" style="color: #bec647;"> occupation</div> tea servant, ruler
  128.                                 </div>
  129.                             </div>
  130.                             <!--- occupation end -------------------->
  131.                    
  132.                         <!--- quote -------------------->
  133.                             <div class="row no-gutters mb-2">
  134.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  135.                                 <div class="col card rounded-0 px-2 py-1" style="background: #1b1c1c; border-color: #373838;">
  136.                                     <div class="text-uppercase" style="color: #bec647;">voice claim</div>
  137.                                     <a href="https://youtu.be/cLY22BeMtZk?feature=shared">Xavier</a>
  138.                                 </div>
  139.                             </div>
  140.                             <!--- quote end -------------------->  
  141.                    
  142.                            
  143.                             <!--- code credit ; DO NOT REMOVE -------------------->
  144.                             <div class="row no-gutters">
  145.                                 <div class="col-auto card rounded-0 border-0 p-1" style="background: #bec647;"></div>
  146.                                 <div class="col card rounded-0 px-2 py-1 border-0" style="background: #282929;">
  147.                                     <div class="text-uppercase" style="color: #bec647;"> code by</div>
  148.                                     <a href="https://toyhou.se/MyUniverseinaBox" style="text-decoration:none; color:#b0b6b6;"> <i class="fal pr-1 fa-code"></i>MyUniverseinaBox </a>
  149.                                 </div>
  150.                             </div>
  151.                             <!--- code credit end -------------------->
  152. <!--------------------------------------------
  153.        AVATAR END
  154. ----------------------------------------------->
  155.                         </div>
  156.                         <!--- [ FIRST COLUMN END ] -------------------->
  157. <!--------------------------------------------
  158.  
  159.        [ SECOND COLUMN ]
  160.        
  161. ----------------------------------------------->
  162.                         <div class="col-md-10 col-sm-12 row no-gutters">
  163.                             <div class="card bg-transparent border-0">
  164. <!--------------------------------------------
  165.        TITLE/NAME/SONG
  166. ----------------------------------------------->
  167.                                 <div class="row no-gutters justify-content-between">
  168.                                     <div class="col-sm-12 col-12">
  169.                                         <!--- NAME -------------------->
  170.                                         <div class="text-white display-4 text-uppercase pl-4 mt-2 mt-sm-0 font-weight-bold" style="font-family:georgia; letter-spacing:3.4px;"><span style="color:#bec647;">V</span>edat </div>
  171.                                         <!--- SUBTITLE -------------------->
  172.                                         <div class="pl-sm-5 font-italic" style="opacity: .8; font-size: 12px;"> <i class="fad fa-fw fa-sm fa-quote-left"></i>All you have to do is be patient and watch. For tea, and for people.</div>
  173.                                     </div>
  174.  
  175.                                 </div>
  176. <!--------------------------------------------
  177.        TITLE/NAME/SONG END
  178. ----------------------------------------------->
  179. <!--------------------------------------------
  180.        MAIN INFO
  181. ----------------------------------------------->
  182.                                 <div class="card rounded-0 mr-md-2 ml-sm-2 my-2 mb-2" style="background: #1b1c1c; border-color: #373838; height: 100%;">
  183.                                     <div class="py-3 px-4 text-justify">
  184.                                         <!--- [ BLURB ] -------------------->
  185.                                 <div class ="p-2" style="overflow:auto; height: 285px;">   
  186.                                 <p><span class="text-uppercase" style="color: #bec647;">Vedat</span> is a quiet, lonesome man. His close ones worry that he's <i>too</i> alone, but in reality, he is content with minimal company. Though once you get closer, you'll find he is a lot more perceptive about people and has (an unintentional) dry sense of humor. They never had passion for much, but became exceptionally skilled in his family's craft/business: tea brewing. He worked as a tea server at various places, trying to climb the ranks to make more money. Eventually, he got accepted to work in the royal castle for the infamous "demon,” the nation’s king, <a href="https://toyhou.se/24691314.shai">Shai</a>. While all he wanted was to not mess up and not draw attention to himself, other plans were in store. A lingering gaze, frequent personal summons by the king, and before you know it, they fell in love. Even Vedat himself was baffled at catching feelings, especially when he was purely focusing on work. The king was surprisingly softer and human than what everyone believed. Despite his reservations (not because of status or fear, but from feeling undeserving) they grew closer and closer. He hadn't imagined finding happiness in love, let alone with someone so ethereal. </p>
  187.            
  188.                                
  189.                             <p> Though they were happy, it was short-lived. Vedat ends up dying amidst the crossfire of a war against their kingdom. Vedat suspects it was an internal enemy that reached him rather than the opposing army, but the effect was all the same. The land was overtaken, and his husband was unfit to rule any longer. After his death, Vedat was offered to become an angel. He chose not to, even if it was the closest way he could see Shai again. He stays in heaven, only able to watch earth from afar. Though the chance is slim, he waits, waits for Shai. <i>Silly... you can move on from me, you know.</i></p>
  190.                             <p>Still, he wonders, what exactly is happening among jinn, angels, and god? What made his husband cry so many nights (besides the troubling kingdom affairs)? Just like when he was alive, he's keeping his head down, but perhaps they learn more than intended...</p>
  191.  
  192.                        
  193.                                         <!--- [ BLURB END ] -------------------->
  194.                                         </div>
  195.                                         <!--- divider -------------------->
  196.                                         <div class="card rounded-0 my-3 border-left-0 border-right-0 border-bottom-0" style="background: #1b1c1c; border-color: #373838;">
  197.                                         </div>
  198.                                         <!--- divider end -------------------->
  199.                                    
  200.                                         <!--- [ NOTES ] -------------------->
  201.                                         <ul class="m-0 pl-4">
  202.                                    
  203.                                             <li><b>Name</b>: Vedat means "love, friendship" in Turkish.</li>
  204.                                             <li><b>Angelhood</b>: He could've become an angel that guarded over the newly overtaken kingdom and even help future kings. But, it would come at the cost of losing his free will (which is typical for angels) and human memories. Without even hearing all the caveats, Vedat refused. Besides distrusting the system of divine beings, he... cannot work under a god that ghosted his husband...!</li>
  205.  
  206.                                         </ul>
  207.                                         <!--- [ NOTES END ] -------------------->
  208.    
  209. <!--------------------------------------------
  210.        MAIN INFO END
  211. ----------------------------------------------->
  212.     <!--- divider -------------------->
  213.                                         <div class="card rounded-0 my-3 border-left-0 border-right-0 border-bottom-0" style="background: #1b1c1c; border-color: #373838;">
  214.                                         </div>
  215.                                         <!--- divider end -------------------->
  216. <!--------------------------------------------
  217.         RELATIONSHIPS/LINKS
  218.             > to add more, copy everything from [ SECTION 1 ] to [ SECTION 1 END ] and paste underneath. You can remove the individual character boxes within them.
  219. ----------------------------------------------->
  220.                 <span class="text-uppercase pl-3 mt-3" style="color: #bec647;">relationships</span>
  221.                                 <!--- [ SECTION 01 ] -------------------->
  222.                                 <div class="row no-gutters mt-1">
  223.                                     <!--- CHARACTER 01 ; left -------------------->
  224.                                     <div class="col-sm-4 pr-sm-1 row no-gutters">
  225.                                         <div class="col py-1 px-3 rounded-0 card" style="background: #1b1c1c; border-color: #373838;">
  226.                                             <!--- name + fontawesome icon ------------->
  227.                                             <div class="text-uppercase"><i class="fa pr-2 pl-0 fa-heart"></i>shai</div>
  228.                                             <!--- desc ---> his husband <!--- link -------------------->
  229.                                             <a href="https://toyhou.se/24691314.shai" class="btn btn-outline-secondary border-0 rounded-0" style="opacity: 0.2; filter: brightness(50%); position:absolute; top:0; left:0; bottom:0; right:0;"></a>
  230.                                             <!--- link end -------------------->
  231.                                         </div>
  232.                                     </div>
  233.                                     <!--- CHARACTER 01 ; left END -------------------->
  234.        
  235.                                    
  236.                                     <!--- CHARACTER 03; right -------------------->
  237.                                     <div class="col-sm-4 pl-sm-1 row no-gutters mt-2 mt-sm-0">
  238.                                         <div class="col py-1 px-3 rounded-0 card" style="background: #1b1c1c; border-color: #373838;">
  239.                                             <!--- name + fontawesome icon ------------->
  240.                                             <div class="text-uppercase"><i class="far pr-2 pl-0 fa-heart-half-stroke"></i>god</div>
  241.                                             <!--- desc --->a veiled and quiet being <!--- link -------------------->
  242.                                             <a href="https://en.wikipedia.org/wiki/God" class="btn btn-outline-secondary border-0 rounded-0" style="opacity: 0.2; filter: brightness(50%); position:absolute; top:0; left:0; bottom:0; right:0;"></a>
  243.                                             <!--- link end -------------------->
  244.                                         </div>
  245.                                     </div>
  246.                                     <!--- CHARACTER 03 ; right END -------------------->
  247.                                    
  248.                                
  249.                                 </div>
  250.                                 <!--- [ SECTION 1 END ] -------------------->
  251. <!--------------------------------------------
  252.         RELATIONSHIPS/LINKS END
  253. ----------------------------------------------->
  254.  
  255.         </div>                                 
  256.                                 </div>
  257.                             </div>
  258.                         </div>
  259.                         <!--- [ SECOND COLUMN END ] -------------------->
  260.  
  261.  
  262.                     </div>
  263.                 </div>
  264.             </div>
  265.             <!--- [ MAIN CONTENT END ] -------------------->
  266.  
  267.         </div>
  268.     </div>
  269. </div>
  270. <!--------------------------------------------
  271.        CODE END
  272. ----------------------------------------------->
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!