kay_kodes

dino || profile text

Mar 9th, 2022 (edited)
27
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.67 KB | None | 0 0
  1. ♡ welcome back! i am back as well with our very first profile text! so now all the categories on our website are all filled. but anyways...we have many more projects coming so i'm really excited about that! but back to this code right here, our lovely coder, Izzy made this code! it looks amazing and you deffo should use it...but you're here might as well! have fun and keep the credits! ♡
  2.  
  3. best dreams,
  4. kay <3
  5.  
  6.  
  7. --CODE STARTS BELOW THIS TEXT--
  8. <html>
  9. <center>
  10. <style>
  11. /*Scrollbar*/
  12. ::-webkit-scrollbar {width: 0px;}
  13. ::-webkit-scrollbar-thumb {background: #fff;}
  14. ::-webkit-scrollbar-thumb:hover {background: #fff;}
  15.  
  16. .page{
  17. text-decoration: none;
  18. color:black;
  19. text-align: justify
  20.  
  21. }
  22. h3{
  23. font-family:'Itim';
  24. font-size:20px;
  25. }
  26. p{
  27. font-family:'Mali';
  28. }
  29. .tab button {
  30. background:rgba(0,0,0,.0);
  31. width:150px;
  32. height:60px;
  33. margin-top:1px;
  34. float:center;
  35. overflow: auto;
  36. border: 2px double #8ABD91;
  37. font-family: 'Itim';
  38. font-size: 20px;
  39. border-radius: 15px;
  40. background: #8ABD91
  41. }
  42. </style>
  43. <div class="page">
  44. <div style="background:#9CAF88;border:12px solid #8ABD91;height:850px;width: 720px;overflow:auto">
  45. <a name="one">
  46. <img src="https://ih1.redbubble.net/image.2144334823.3256/flat,750x1000,075,f.jpg" style="width:150px;height:150px;float:right;margin-top:10px;margin-right:10px;border-radius:100%;">
  47. <img src="https://ih1.redbubble.net/image.2144334823.3256/flat,750x1000,075,f.jpg" style="width:150px;height:150px;float:left;margin-top:10px;margin-left:10px;border-radius:100%;">
  48. <center><img src="https://pic.funnygifsbox.com/uploads/2020/06/funnygifsbox.com-2020-06-19-08-13-29-16.gif" style="width:150px;height:150px;border:5px solid #8ABD91;border-radius:100%;margin-top:10px">
  49. <h1 style="font-family:'Allura';font-size:70px;margin-bottom:2px;">Insert Name Here</h1>
  50. <h1 style="font-family:'Allura';font-size:20px;margin-bottom:2px;">❝ insert quote here ❞</h1>
  51. </center>
  52.  
  53. <hr style="border:2px dashed">
  54. <div class="tab">
  55. <center>
  56. <button class="tablinks" onclick="openCity(event, 'one')" id="defaultOpen"><img src="https://fontmeme.com/permalink/220309/270ff4666dc11b2e981808ad97a7ec3c.png" alt="style-script-font" border="0" style="margin-top:10px;width:70px"></button>
  57. <button class="tablinks" onclick="openCity(event, 'two')"><img src="https://fontmeme.com/permalink/220309/d9d9cda0c6517b2b9d7c15ce67c1500c.png" alt="style-script-font" border="0" style="margin-top:10px;width:130px"></button>
  58. <button class="tablinks" onclick="openCity(event, 'three')"><img src="https://fontmeme.com/permalink/220309/473ee29aee06cf3e0b0f7b28aceb6453.png" alt="style-script-font" border="0" style="margin-top:10px;width:100px"></button>
  59. <button class="tablinks" onclick="openCity(event, 'four')"><img src="https://fontmeme.com/permalink/220309/a2bd53f606809a8a8b3ad622b458beb0.png" alt="style-script-font" border="0" style="margin-top:10px;width:100px"></button>
  60. </center>
  61.  
  62. <div id="one" class="tabcontent">
  63. <div style="margin-left: 10px;margin-right: 10px">
  64. <center><h2>about</h2></center>
  65. <p>hihihi! yes it is i once again, izzy, with a profile text code! this is just my hello and important reminders, <b>feel free to delete this once you're done reading and understanding everything</b>! to the requester, thank you so so much! they asked for a sage-colored profile text with four buttons specifically! i hope you like it and have lots of fun editing! this code is free for everyone so feel free to use it as long as you <b>keep the credits</b> or else... anyway thank you for understanding and hopefukky doing so if you decide to use the code!
  66. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nibh mauris cursus mattis molestie a iaculis at erat. Et malesuada fames ac turpis egestas sed tempus urna et. At auctor urna nunc id. Malesuada fames ac turpis egestas sed tempus urna et pharetra. Id nibh tortor id aliquet lectus proin nibh nisl. Velit sed ullamcorper morbi tincidunt ornare massa eget egestas. At auctor urna nunc id cursus metus. Sit amet consectetur adipiscing elit duis tristique. Eu augue ut lectus arcu bibendum at varius vel pharetra. Volutpat diam ut venenatis tellus in metus. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Vel turpis nunc eget lorem dolor.
  67. <center>
  68. <div style="background: #9CAF88;padding:5%;border:#fff 2px double;width:450px;height:340px;margin-right:10px;margin-left:10px;float:center">
  69. <p><b>name →</b> insert name
  70. <br><b>nicknames →</b> insert nicknames
  71. <br><b>age →</b> insert age
  72. <br><b>birthdate →</b> insert birthdate
  73. <br><b>gender →</b> insert gender
  74. <br><b>orientation →</b> insert orientation
  75. <p><b>house/kingdom/etc →</b> insert house/kingdom/etc
  76. <br><b>relationship status →</b> insert relationship status
  77. <br><b>occupation →</b> insert occupation
  78. <br><b>nationality →</b> insert nationality
  79.  
  80. <p><b>hair color →</b> insert hair color
  81. <br><b>eye color →</b> insert eye color
  82. <br><b>skin color →</b> insert skin color
  83. <br><b>height →</b> insert height
  84. <br><b>more →</b> for example, freckles, glasses, contacts, etc.</div>
  85.  
  86. </div>
  87. </div>
  88. <div id="two" class="tabcontent">
  89. <div style="margin-left:10px;margin-top:-10px;margin-right:10px">
  90. <center><h2>personality</h2></center>
  91. <img src="https://c.tenor.com/LYkcjIcC9okAAAAC/aesthetic.gif" style="width:30%;float:right;margin-left:5px;margin-right:10px"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nibh mauris cursus mattis molestie a iaculis at erat. Et malesuada fames ac turpis egestas sed tempus urna et. At auctor urna nunc id. Malesuada fames ac turpis egestas sed tempus urna et pharetra. Id nibh tortor id aliquet lectus proin nibh nisl. Velit sed ullamcorper morbi tincidunt ornare massa eget egestas. At auctor urna nunc id cursus metus. Sit amet consectetur adipiscing elit duis tristique. Eu augue ut lectus arcu bibendum at varius vel pharetra. Volutpat diam ut venenatis tellus in metus. Imperdiet massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada. Vel turpis nunc eget lorem dolor.</p>
  92. <img src="https://pa1.narvii.com/6653/64749d293fd712616394af8c2980307845faa07e_hq.gif" style="width:30%;float:left;margin-right:10px">
  93. <p>Massa sapien faucibus et molestie ac feugiat. Id donec ultrices tincidunt arcu non sodales. Risus quis varius quam quisque id diam. At erat pellentesque adipiscing commodo elit at imperdiet dui accumsan. Nibh tellus molestie nunc non blandit massa enim nec dui. Id consectetur purus ut faucibus. Nulla pharetra diam sit amet nisl suscipit. Arcu non sodales neque sodales. Massa tempor nec feugiat nisl. Praesent semper feugiat nibh sed pulvinar proin gravida hendrerit. Fringilla ut morbi tincidunt augue interdum velit. Elit sed vulputate mi sit amet mauris commodo quis. Iaculis eu non diam phasellus. Lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci. Nulla posuere sollicitudin aliquam ultrices. Pharetra sit amet aliquam id diam maecenas. Libero enim sed faucibus turpis in eu mi. Blandit aliquam etiam erat velit scelerisque in dictum non consectetur. Sed tempus urna et pharetra pharetra massa.</p>
  94. <p>Et ultrices neque ornare aenean euismod. Tellus rutrum tellus pellentesque eu tincidunt tortor aliquam nulla facilisi. Maecenas volutpat blandit aliquam etiam erat velit. Rhoncus est pellentesque elit ullamcorper dignissim cras. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Vel orci porta non pulvinar neque laoreet. Tortor id aliquet lectus proin nibh nisl condimentum id. Interdum velit euismod in pellentesque massa.
  95. </div>
  96.  
  97. </div>
  98.  
  99. <div id="three" class="tabcontent">
  100. <div style="margin-left:10px">
  101. <center><h2>aesthetics</h2></center>
  102. <center><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTUkYPe6SqtkjwZy13e201kHxPdf6BVKPtvkg&usqp=CAU" style="width:170px;height:200px;border:5px double #8ABD91">
  103.  
  104. <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSSUte9IoLME4VcbiMz-4pV0no8qzoOFjGS2Q&usqp=CAU" style="width:170px;height:200px;border:5px double #8ABD91">
  105.  
  106. <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRmDi-mc1bYDhvlIAQ3o2J1Aad-LvprZmswsQ&usqp=CAU" style="width:170px;height:200px;border:5px double #8ABD91">
  107.  
  108. <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcShYJf-3ZZg8pweQognk1I7vPmkmZaqZ_QRrg&usqp=CAU" style="width:170px;height:200px;border:5px double #8ABD91">
  109.  
  110. <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWf_BYQCIYYMQGrlx053SkRO9sFv1aor5-nA&usqp=CAU" style="width:170px;height:200px;border:5px double #8ABD91">
  111.  
  112. <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ7x8Gv6HO_zStxQ4XlJDfCstnSAQJFWKFEDg&usqp=CAU" style="width:170px;height:200px;border:5px double #8ABD91">
  113. <br>
  114. <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRZbWvxzcV7-fGbkbWnEB_0G6onTR8DxHQ8TQ&usqp=CAU" style="width:170px;height:200px;border:5px double #8ABD91">
  115.  
  116. <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQlaqLkew6FSKjje2FuCpRdus6ruJGmH3snlQ&usqp=CAU" style="width:170px;height:200px;border:5px double #8ABD91">
  117.  
  118. <img src="https://i.pinimg.com/474x/cf/d6/b8/cfd6b8593093d08d7c6e35bd82e1aa76.jpg" style="width:170px;height:200px;border:5px double #8ABD91">
  119. </div>
  120. </div>
  121. <div id="four" class="tabcontent">
  122. <div style="margin-left: 10px">
  123. <center><h2>relations</h2></center>
  124. <div style="background: #9CAF88;padding:5%;border:#9CAF88 2px double;width:450px;height:120px;margin-right:10px;margin-left:10px;float:center">
  125. <img src="https://pic.funnygifsbox.com/uploads/2020/06/funnygifsbox.com-2020-06-19-08-13-29-16.gif" style="width:120px;height:120px;border:solid #8ABD91;border-radius:100%;float:left;margin-left:-10px;margin-bottom:10px;margin-right:10px">
  126. <p><b>Relation | Name</b></p>
  127. <p> Relation Description
  128. </div>
  129. <br><br>
  130. <div style="background: #9CAF88;padding:5%;border:#9CAF88 2px double;width:450px;height:120px;margin-right:10px;margin-left:10px;float:center">
  131. <img src="https://pic.funnygifsbox.com/uploads/2020/06/funnygifsbox.com-2020-06-19-08-13-29-16.gif" style="width:120px;height:120px;border:solid #8ABD91;border-radius:100%;float:left;margin-left:-10px;margin-bottom:10px;margin-right:10px">
  132. <p><b>Relation | Name</b></p>
  133. <p> Relation Description
  134. </div>
  135. <br><br>
  136. <div style="background: #9CAF88;padding:5%;border:#9CAF88 2px double;width:450px;height:120px;margin-right:10px;margin-left:10px;float:center">
  137. <img src="https://pic.funnygifsbox.com/uploads/2020/06/funnygifsbox.com-2020-06-19-08-13-29-16.gif" style="width:120px;height:120px;border:solid #8ABD91;border-radius:100%;float:left;margin-left:-10px;margin-bottom:10px;margin-right:10px">
  138. <p><b>Relation | Name</b></p>
  139. <p> Relation Description
  140. </div>
  141. <br><br>
  142. <div style="background: #9CAF88;padding:5%;border:#9CAF88 2px double;width:450px;height:120px;margin-right:10px;margin-left:10px;float:center">
  143. <img src="https://pic.funnygifsbox.com/uploads/2020/06/funnygifsbox.com-2020-06-19-08-13-29-16.gif" style="width:120px;height:120px;border:solid #8ABD91;border-radius:100%;float:left;margin-left:-10px;margin-bottom:10px;margin-right:10px">
  144. <p><b>Relation | Name</b></p>
  145. <p> Relation Description
  146. </div>
  147. <br><br>
  148.  
  149. <br><br>
  150. </div>
  151. </div>
  152. <center><a href="https://kkodes.wixsite.com/dreamer" style="color:#000;font-size:12px;"><b><u>kay kodes</u></b></a></p></div>
  153.  
  154. <link rel="preconnect" href="https://fonts.googleapis.com">
  155. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  156. <link href="https://fonts.googleapis.com/css2?family=Allura&display=swap" rel="stylesheet">
  157. <script>
  158. function openCity(evt, cityName) {
  159. var i, tabcontent, tablinks;
  160. tabcontent = document.getElementsByClassName("tabcontent");
  161. for (i = 0; i < tabcontent.length; i++) {
  162. tabcontent[i].style.display = "none";
  163. }
  164. tablinks = document.getElementsByClassName("tablinks");
  165. for (i = 0; i < tablinks.length; i++) {
  166. tablinks[i].className = tablinks[i].className.replace(" active", "");
  167. }
  168. document.getElementsByClassName("tablinks");
  169. for (i = 0; i < tablinks.length; i++) {
  170. tablinks[i].className = tablinks[i].className.replace(" active", "");
  171. }
  172. document.getElementById(cityName).style.display = "block";
  173. evt.currentTarget.className += " active";
  174. }
  175.  
  176. // Get the element with id="defaultOpen" and click on it
  177. document.getElementById("defaultOpen").click();
  178. </script>
Add Comment
Please, Sign In to add comment