API tools faq
paste
tsumuan

fancycode

tsumuan
Jun 12th, 2023
2,300
1
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.40 KB | None | 1 0
raw download clone embed print report
  1. <!-- color stuff :D // u can replace colors using your computers notes app! paste the code there and use the replace tool! -->
  2. <!-- darker brown for teh borders n text ^.^: #96682f -->
  3. <!-- less darker brown for the background of the border thingy: #ebd0a9 -->
  4. <!-- Lightest brown!, for the boxes: #f5e4cb -->
  5.  
  6.  
  7.  
  8.  
  9. <!-- BACKGROUND IMAGE -->
  10. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  11. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  12. <div alt="cloud" style="position:absolute;top:0;bottom:0;left:0; background:url(https://cdn.discordapp.com/attachments/499985654030139396/1117542404682166393/rd133_image_master.jpg) fixed center;background-size:cover;width:100%;z-index:-2;"></div>
  13. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  14. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  15.  
  16.  
  17. <div style="display:flex; margin: auto; height: 700px; width: 1100px;">
  18.  
  19. <!-- Decorations -->
  20. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  21. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  22. <i class="fa-regular fa-flower fa-8x" style="color: #96682f; margin-left:-17px; margin-top: 120px; position: absolute; transform: rotate(-15deg); z-index: -1;"></i>
  23. <i class="fa-regular fa-flower fa-8x" style="color: #96682f; margin-left:835px; margin-top: 460px; position: absolute; transform: rotate(15deg); z-index: -1;"></i>
  24. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  25. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  26.  
  27.  
  28.  
  29. <!-- the frame -->
  30. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  31. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  32. <div style="height: 800px; width: 520px; margin-top: -50px; margin-left: 220px; z-index: 3;
  33. background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/66250841_5JEwl7GHwIudG0x.png); background-size: cover; position:absolute;">
  34. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  35. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  36.  
  37.  
  38. <div class="tab-content" id="myTabContent">
  39. <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
  40.  
  41. <!-- ABOUT!! -->
  42. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  43. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  44. <center><div style=" transform: rotate(0deg); z-index: 4; height: 300px; width: 290px; border: 6px double #96682f; background-color: #f5e4cb; border-radius: 15px; overflow: auto; margin-top: 215px; padding: 6px;">
  45. <span style="font-family: georgia,palatino; font-size: 11px;"><span style="color: #96682f;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ornare hendrerit metus vitae tempor. In hac habitasse platea dictumst. Fusce sit amet metus tempor, maximus libero sed, luctus est. Praesent at enim et dui sagittis ultricies. Etiam quis ante vulputate nisi viverra volutpat. Pellentesque vehicula, nulla non feugiat sagittis, erat lacus ornare ante, vel volutpat tortor purus et nisi. Fusce vel consequat est, et dignissim nisl. Pellentesque sed purus eros. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent ornare hendrerit metus vitae tempor. In hac habitasse platea dictumst. Lorem ipsum dolor sit amet, consectetur adipiscing elit..<br><br> </span></strong></span>
  46. </div></center>
  47. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  48. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  49.  
  50.  
  51.  
  52. <!-- THE SUN DECORATIONS!!!! -->
  53. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  54. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  55. <center><img src="https://i.imgur.com/ObMLqWd.gif" height="80" width="80" style="margin-top: -30px;">
  56. <img src="https://i.imgur.com/ObMLqWd.gif" height="120" width="120" style="margin-top: -30px;">
  57. <img src="https://i.imgur.com/ObMLqWd.gif" height="80" width="80" style="margin-top: -30px;"></center>
  58. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  59. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  60.  
  61. </div>
  62. <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab"> <center><div style=" z-index: 4; height: 110px; width: 290px; border: 6px double #96682f; background-color: #f5e4cb; border-radius: 15px; overflow: auto; margin-top: 240px; padding: 6px;">
  63.  
  64. <div style=" height: 25px; width: 150px; background-color: #96682f; border-radius: 15px; margin-top: -25px; margin-left: 55px; position: absolute;">
  65. <span style="font-family: georgia,palatino; font-size: 14px;"><span style="color: #f5e4cb;"> Design notes </span></strong></span></div>
  66.  
  67.  
  68. <!-- DESIGN NOTES!!! -->
  69. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  70. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  71. <span style="font-family: georgia,palatino; font-size: 11px;"><span style="color: #96682f;"> •thing•<br>
  72. •thing•<br>
  73. •thing•<br>
  74. •thing•<br>
  75. •thing•<br>
  76. •thing•<br> </span></strong></span>
  77. </div></center>
  78. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  79. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  80.  
  81.  
  82. <center><div style=" z-index: 4; height: 110px; width: 290px; border: 6px double #96682f; background-color: #f5e4cb; border-radius: 15px; overflow: auto; margin-top: 15px; padding: 6px;">
  83.  
  84. <div style=" height: 25px; width: 150px; background-color: #96682f; border-radius: 15px; margin-top: -25px; margin-left: 55px; position: absolute;"><span style="font-family: georgia,palatino; font-size: 14px;"><span style="color: #f5e4cb;"> Trivia </span></strong></span></div>
  85. <span style="font-family: georgia,palatino; font-size: 11px;">
  86.  
  87.  
  88.  
  89. <!-- TRIVIA -->
  90. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  91. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  92. <span style="color: #96682f;"> •thing•<br>
  93. •thing•<br>
  94. •thing•<br>
  95. •thing•<br>
  96. •thing•<br>
  97. •thing•<br> </span></strong></span>
  98. </div></center>
  99. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  100. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  101.  
  102.  
  103.  
  104. <center><div style=" display:flex; z-index: 4; height: 110px; width: 290px; "> <div style=" height: 110px; width: 140px; border: 6px double #96682f; background-color: #f5e4cb; border-radius: 15px; overflow: auto; margin-top: 15px; padding: 6px;">
  105. <i class="fa-solid fa-heart fa-3x" style="color: #96682f; position: absolute; margin-top: -25px; margin-left: -70px;"></i>
  106. <center><span style="font-family: georgia,palatino; font-size: 11px;">
  107.  
  108.  
  109.  
  110. <!-- LIKES-->
  111. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  112. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  113. <span style="color: #96682f;">
  114. •thing•<br>
  115. •thing•<br>
  116. •thing•<br>
  117. •thing•<br>
  118. •thing•<br>
  119. •thing•<br>
  120. •thing•<br>
  121. </span></strong></span></center>
  122. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  123. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  124.  
  125. </div>
  126. <div style=" height: 110px; width: 140px; border: 6px double #96682f; background-color: #f5e4cb; border-radius: 15px; overflow: auto; margin-left: 15px; margin-top: 15px; padding: 6px;">
  127. <i class="fa-solid fa-heart-crack fa-3x" style="color: #96682f; position: absolute; margin-top: -25px; margin-left: -70px;"></i>
  128. <center><span style="font-family: georgia,palatino; font-size: 11px;">
  129.  
  130.  
  131.  
  132. <!-- DISLIKES-->
  133. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  134. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  135. <span style="color: #96682f;">
  136. •thing•<br>
  137. •thing•<br>
  138. •thing•<br>
  139. •thing•<br>
  140. •thing•<br>
  141. •thing•<br>
  142. •thing•<br>
  143. </span></strong></span></center>
  144. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  145. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  146.  
  147. </div></div></center> </div> </div></div>
  148.  
  149.  
  150. <!-- CHARACTER ICON!!! -->
  151. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  152. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  153. <div style="height: 200px; width: 200px;
  154. border: 11px double #96682f; background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/64954960_bohi7VQPhWbdV7E.png); background-size: contain; border-radius: 232323px; z-index: 3; position:absolute; margin-top: -20px; margin-left: 380px;">
  155. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  156. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  157.  
  158.  
  159. </div>
  160. <div style="height: 100px; width: 300px;
  161. z-index: 6; position:absolute; margin-top: 630px; margin-left: 328px;">
  162.  
  163.  
  164.  
  165. <!-- FIRST NAME ON TOP OF THE FRAME-->
  166. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  167. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  168. <center><span style="font-family: georgia,palatino; font-size:24px;"><span style="color: #96682f;">FIRST NAME</span></strong></span><br></center>
  169. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  170. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  171.  
  172.  
  173. </div>
  174. <div style="height: 350px; width: 210px; margin-left: 40px; margin-top: 170px;
  175. padding: 8px; border: 11px double #96682f; background-color: #ebd0a9;
  176. box-shadow: 3px 3px 30px rgba(64, 21, 0,0.8); border-radius: 10px; position:absolute;">
  177.  
  178. <center><span style="font-family: georgia,palatino; font-size: 14px;"><span style="color: #96682f;">Name</span></strong></span><br></center>
  179. <div style="height: 35px; width: 172px;
  180. border: 6px double #96682f; background-color: #f5e4cb; border-radius: 10px; margin-bottom: 5px;">
  181.  
  182.  
  183. <!-- FULL NAME -->
  184. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  185. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  186. <center><span style="font-family: georgia,palatino; font-size: 11px;"><span style="color: #96682f;">Character full name</span></strong></span></center>
  187. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  188. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  189. </div>
  190.  
  191. <center><span style="font-family: georgia,palatino; font-size: 14px;"><span style="color: #96682f;">Pronouns</span></strong></span><br></center>
  192. <div style="height: 35px; width: 172px;
  193. border: 6px double #96682f; background-color: #f5e4cb; border-radius: 10px; margin-bottom: 5px;">
  194.  
  195. <!-- PRONOUNS -->
  196. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  197. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  198. <center><span style="font-family: georgia,palatino; font-size: 11px;"><span style="color: #96682f;">Pro/nouns</span></strong></span></center>
  199. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  200. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  201. </div>
  202.  
  203. <center><span style="font-family: georgia,palatino; font-size: 14px;"><span style="color: #96682f;">Orientation</span></strong></span><br></center>
  204. <div style="height: 35px; width: 172px;
  205. border: 6px double #96682f; background-color: #f5e4cb; border-radius: 10px; margin-bottom: 5px;">
  206.  
  207. <!-- ORIENTATION -->
  208. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  209. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  210. <center><span style="font-family: georgia,palatino; font-size: 11px;"><span style="color: #96682f;">Sexuality or smth</span></strong></span></center>
  211. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  212. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  213.  
  214. </div>
  215.  
  216. <center><span style="font-family: georgia,palatino; font-size: 14px;"><span style="color: #96682f;">Age</span></strong></span><br></center>
  217. <div style="height: 35px; width: 172px;
  218. border: 6px double #96682f; background-color: #f5e4cb; border-radius: 10px; margin-bottom: 5px;">
  219.  
  220. <!-- AGE -->
  221. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  222. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  223. <center><span style="font-family: georgia,palatino; font-size: 11px;"><span style="color: #96682f;">6</span></strong></span></center>
  224. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  225. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  226.  
  227. </div>
  228. <center><span style="font-family: georgia,palatino; font-size: 14px;"><span style="color: #96682f;">Species</span></strong></span><br></center>
  229. <div style="height: 35px; width: 172px;
  230. border: 6px double #96682f; background-color: #f5e4cb; border-radius: 10px; margin-bottom: 5px;">
  231.  
  232. <!-- SPECIES -->
  233. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  234. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  235. <center><span style="font-family: georgia,palatino; font-size: 11px;"><span style="color: #96682f;">CRAZY</span></strong></span></center>
  236. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  237. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  238.  
  239.  
  240. </div>
  241. </div>
  242. <div style="height: 350px; width: 200px; margin-left: 700px; margin-top: 170px;
  243. padding: 8px; border: 11px double #96682f; background-color: #ebd0a9;
  244. box-shadow: 3px 3px 30px rgba(64, 21, 0,0.8); border-radius: 10px; position:absolute;">
  245.  
  246. <div style="height: 70px; width: 70px; margin-top: 20px; margin-left: 50px; z-index: 5;
  247. border-radius: 20px; background-color: #f5e4cb; border: 11px double #96682f; position:absolute;">
  248. <i class="fa-solid fa-music fa-2x" style="color: #96682f; margin-left: 10px; margin-top: 10px; "></i>
  249.  
  250.  
  251. <!-- MUSIC, replace "-Jo7cZ5VJlI" with yr own link-->
  252. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  253. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  254. <iframe src="https://www.youtube.com/embed/-Jo7cZ5VJlI?modestbranding=1"
  255. style="position:absolute; top: 0; bottom:0; left:0; right:0; opacity: .001" class="h-100 w-100" frameborder="0">
  256. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  257. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  258.  
  259.  
  260. </iframe></div>
  261.  
  262. <ul class="nav flex" id="v-pills-tab" role="tablist" >
  263.  
  264.  
  265.  
  266. <!-- HOME BUTTON -->
  267. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  268. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  269. <li class="nav-item">
  270. <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true" style="height: 90px; width: 120px; margin-top: 100px; margin-left: 25px; z-index: 5;
  271. border-radius: 20px; background-color: #f5e4cb; border: 11px double #96682f; position:absolute;">
  272. <i class="fa-solid fa-house fa-3x" style="color: #96682f; margin-left: 11px; margin-top: 5px; "></i>
  273. </a> </li>
  274. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  275. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  276.  
  277.  
  278. <!-- MORE INFO BUTTON -->
  279. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  280. <!-- aaaaaaaaaaaaaaaaaaaaaa -->
  281. <li class="nav-item">
  282. <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false" style="height: 90px; width: 120px; margin-top: 200px; margin-left: 25px; z-index: 5;
  283. border-radius: 20px; background-color: #f5e4cb; border: 11px double #96682f; position:absolute;">
  284. <i class="fa-solid fa-circle-info fa-3x" style="color: #96682f; margin-left: 13px; margin-top: 5px;"></i>
  285. </a></li>
  286. <!-- OOOOOOOOOOOOOOOOOOOOO -->
  287. <!-- OOOOOOOOOOOOOOOOOOOOOO -->
  288.  
  289. </ul>
  290. <center>
  291. <div style="margin-top: 300px;">
  292. <a href="https://toyhou.se/Roskakala">
  293. <i class="fa-solid fa-code" style="color:#96682f;"></i>
  294. </a></div></center>
  295. </div>
  296.  
  297.  
  298. <div style="height: 530px; width: 370px; margin-left: 290px; margin-top: 70px;
  299. padding: 8px; border: 8px double #96682f; background-color: #ebd0a9; overflow: visible;
  300. box-shadow: 3px 3px 30px rgba(64, 21, 0,0.8); border-radius: 50px;">
  301.  
  302.  
  303.  
  304.  
  305. </div>
  306.  
  307.  
  308.  
  309.  
  310. </div>
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!