API tools faq
paste
Advertisement
animemetrash

howl - character profile code

animemetrash
Mar 16th, 2018 (edited)
2,240
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.41 KB | None | 0 0
raw download clone embed print report
  1. <div class="container rounded" style="width:850px">
  2.  
  3. <div class="row">
  4. <div class="col-6 col-md-4" style="text-align:center;">
  5. <img src="https://file.toyhou.se/images/6884170_KS3Xt6s3ugKlLm7.png" class="img-thumbnail">
  6. </div>
  7. <div class="col-6 col-md-4" style="text-align:center;">
  8. <img src="https://file.toyhou.se/images/6884170_KS3Xt6s3ugKlLm7.png" class="img-thumbnail">
  9. </div>
  10. <div class="col-6 col-md-4" style="text-align:center;">
  11. <img src="https://file.toyhou.se/images/6884170_KS3Xt6s3ugKlLm7.png" class="img-thumbnail">
  12. </div>
  13. </div>
  14. <hr /><center><h1 class="display-1">name</h1></center>
  15. <hr />
  16. <div class="row">
  17.  
  18. <div class="col-6 col-md-4">
  19. <div class="card card-outline-dark card-bg-dark h-100">
  20. <h1 class="card-header bg-dark text-light" style="text-align:center;">basics</h1>
  21. <div class="card-block bg-light text-dark" >
  22. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>name</strong> / x</p>
  23. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>aliases</strong> / x</p>
  24. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>age</strong> / x</p>
  25. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>pronouns</strong> / x</p>
  26. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>species</strong> / x</p>
  27. </div>
  28. </div>
  29. </div>
  30. <div class="col-6 col-md-4">
  31. <div class="card card-outline-dark card-bg-dark h-100">
  32. <h1 class="card-header text-light bg-dark" style="text-align:center;"></i>personality</h1>
  33. <div class="card-block bg-light text-dark" >
  34. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> basic traits here</p>
  35. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> here's a list</p>
  36. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <a href="http://ideonomy.mit.edu/essays/traits.html">ta-dah</a></p>
  37. </div>
  38. </div>
  39. </div>
  40. <div class="col-6 col-md-4">
  41. <div class="card card-outline-dark card-bg-dark h-100">
  42. <h1 class="card-header bg-dark text-light" style="text-align:center;">physical</h1>
  43. <div class="card-block bg-light text-dark">
  44. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>height</strong> / x</p>
  45. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>weight</strong> / x</p>
  46. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>build</strong> / x</p>
  47. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>hair color</strong> / x</p>
  48. <p><i class="fa fa-arrow-right" aria-hidden="true"></i> <strong>eye color</strong> / x</p>
  49. </div>
  50. </div>
  51. </div>
  52. </div>
  53.  
  54. <hr />
  55. <div class="row">
  56. <div class="col">
  57. <div class="card card-outline-dark card-bg-dark h-100">
  58. <h1 class="card-header bg-dark text-light"><i class="fa fa-star" aria-hidden="true"></i> about</h1>
  59. <div class="card-block bg-light text-dark">
  60. <img src="https://file.toyhou.se/images/6884165_nJSRw6mfJbcS9S3.png" style="max-width:175px;height:auto;" class="img-thumbnail float-right" alt="...">
  61. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque justo orci, viverra vel turpis id, tempus dapibus velit. Ut varius lorem id ipsum faucibus tincidunt. Praesent tincidunt dignissim mi pretium lobortis. Cras fermentum felis purus, nec facilisis orci laoreet et. Phasellus convallis luctus neque sit amet congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla ac pretium metus, eget molestie risus.</p>
  62. <p>Aenean sed pharetra velit. Maecenas eu nisi vulputate, fermentum velit ac, volutpat turpis. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed in fringilla massa. Vivamus venenatis convallis mauris, non convallis quam scelerisque eu. Praesent id mauris sapien. Ut placerat varius ex at bibendum.</p>
  63. <p>Donec id scelerisque magna. Praesent ultricies nisi nisl, a congue justo elementum et. Quisque sit amet aliquam tellus. In ut accumsan erat. Nunc pellentesque fringilla diam mollis accumsan. Curabitur vitae nisi fermentum ipsum pretium facilisis. Morbi ex diam, condimentum sed odio eget, vulputate molestie massa. Quisque enim odio, feugiat eu elit non, scelerisque pulvinar nulla. In scelerisque massa dolor, sit amet fermentum turpis hendrerit a. Aenean tincidunt, nibh eu sodales ultrices, augue ipsum blandit urna, a maximus sapien orci eu arcu. Praesent lobortis porta feugiat. Integer non tortor hendrerit, feugiat est nec, rutrum elit. Ut varius sagittis tellus quis dictum. Vestibulum viverra, dui lobortis bibendum tincidunt, ipsum erat bibendum leo, sit amet consectetur justo est in ex. Sed luctus erat odio, non finibus dui tempus vitae. Etiam venenatis id massa eu scelerisque.</p>
  64. </div>
  65. </div>
  66. </div>
  67. </div>
  68. <br />
  69. <div class="row">
  70. <div class="col">
  71. <div class="card card-outline-dark card-bg-dark h-100">
  72. <h1 class="card-header bg-dark text-light" style="text-align:right;">background <i class="fa fa-star" aria-hidden="true"></i></h1>
  73. <div class="card-block bg-light text-dark" >
  74. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque justo orci, viverra vel turpis id, tempus dapibus velit. Ut varius lorem id ipsum faucibus tincidunt. Praesent tincidunt dignissim mi pretium lobortis. Cras fermentum felis purus, nec facilisis orci laoreet et. Phasellus convallis luctus neque sit amet congue. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla ac pretium metus, eget molestie risus.</p>
  75. <p>Aenean sed pharetra velit. Maecenas eu nisi vulputate, fermentum velit ac, volutpat turpis. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed in fringilla massa. Vivamus venenatis convallis mauris, non convallis quam scelerisque eu. Praesent id mauris sapien. Ut placerat varius ex at bibendum.</p>
  76. </div>
  77. </div>
  78. </div>
  79. </div>
  80.  
  81. <hr />
  82.  
  83. <div class="row">
  84. <div class="col-6 col-sm-3" style="text-align:center;">
  85. <img src="https://file.toyhou.se/images/6884162_rjZoETAt4I6RWRr.png" style="height:100px;width:auto;" class="img-thumbnail">
  86. <br /><br /><a class="btn btn-outline-secondary" href="/" role="button">Link</a>
  87. </div>
  88. <div class="col-6 col-sm-3" style="text-align:center;">
  89. <img src="https://file.toyhou.se/images/6884162_rjZoETAt4I6RWRr.png" style="height:100px;width:auto;" class="img-thumbnail">
  90. <br /><br /><a class="btn btn-outline-secondary" href="/" role="button">Link</a>
  91. </div>
  92. <div class="col-6 col-sm-3" style="text-align:center;">
  93. <img src="https://file.toyhou.se/images/6884162_rjZoETAt4I6RWRr.png" style="height:100px;width:auto;" class="img-thumbnail">
  94. <br /><br /><a class="btn btn-outline-secondary" href="/" role="button">Link</a>
  95. </div>
  96. <div class="col-6 col-sm-3" style="text-align:center;">
  97. <img src="https://file.toyhou.se/images/6884162_rjZoETAt4I6RWRr.png" style="height:100px;width:auto;" class="img-thumbnail">
  98. <br /><br /><a class="btn btn-outline-secondary" href="/" role="button">Link</a>
  99. </div>
  100. </div>
  101.  
  102. <hr />
  103.  
  104. <center><h1>playlist</h1></center>
  105. <div class="row">
  106. <div class="col-6 col-md-4" style="text-align:center;">
  107. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a><br />
  108. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a><br />
  109. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a>
  110. </div>
  111. <div class="col-6 col-md-4" style="text-align:center;">
  112. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a><br />
  113. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a><br />
  114. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a>
  115. </div>
  116. <div class="col-6 col-md-4" style="text-align:center;">
  117. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a><br />
  118. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a><br />
  119. <i class="fa fa-play-circle" aria-hidden="true"></i> <a href="/">link</a>
  120. </div>
  121. </div>
  122.  
  123. <hr />
  124.  
  125. <div class="row">
  126. <div class="col-6 col-sm-3" style="text-align:center;">
  127. <img src="https://file.toyhou.se/images/6884157_qdgn1cu0BObXY9P.png" style="height:200px;width:auto;" class="img-thumbnail">
  128. </div>
  129. <div class="col-6 col-sm-3" style="text-align:center;">
  130. <img src="https://file.toyhou.se/images/6884157_qdgn1cu0BObXY9P.png" style="height:200px;width:auto;" class="img-thumbnail">
  131. </div>
  132. <div class="col-6 col-sm-3" style="text-align:center;">
  133. <img src="https://file.toyhou.se/images/6884157_qdgn1cu0BObXY9P.png" style="height:200px;width:auto;" class="img-thumbnail">
  134. </div>
  135. <div class="col-6 col-sm-3" style="text-align:center;">
  136. <img src="https://file.toyhou.se/images/6884157_qdgn1cu0BObXY9P.png" style="height:200px;width:auto;" class="img-thumbnail">
  137. </div>
  138. </div>
  139. <hr />
  140. <center><small><sub>code by <a href="https://toyhou.se/m_eaty">m_eaty</a></sub></small></center>
  141. </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!