API tools faq
paste
ooksie

MIKU MIKU BEAM! (thread header)

ooksie
Aug 29th, 2025
14
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.96 KB | None | 0 0
raw download clone embed print report
  1. [comment]coded by uxie!
  2.  
  3. [font=Pixelify Sans]title[/font]
  4. [font=DotGothic16]header[/font]
  5. [font=Host Grotesk]body[/font]
  6.  
  7. to replace fonts, add/replace them here, and then in the variables below under *fonts; check uxie's tech support in nine lives for more details ( ‾́ ◡ ‾́ )
  8.  
  9. [/comment][div=
  10.  
  11. /*window background/border*/
  12. --bg-color: #ff70a6;
  13. /*window line border*/
  14. --border: #D73E97;
  15. /*cursor!*/
  16. --cursor: url('https://i.imgur.com/g9Jf9Bk.png'), auto!important;
  17.  
  18. /*you can ignore the following*/
  19. --white: #fff;
  20. --black: #000;
  21.  
  22. /*accent colours -- no particular main one, just make sure they're unique and distinct against white*/
  23. --color-1: #FCFBC1;
  24. --color-2: #FBBEC7;
  25. --color-3: #BEFAFA;
  26. --color-4: #DCBBFC;
  27. --color-5: var(--border);
  28.  
  29. /*text colour*/
  30. --t-color: #aa1e6e;
  31.  
  32. /*fonts used*/
  33. --title: 'Pixelify Sans', sans-serif;
  34. --header: 'DotGothic16', sans-serif;
  35. --body: 'Host Grotesk', sans-serif;
  36. --body-fs: 13px;
  37.  
  38. /*put 'block' under the type you're using and 'none' under the type you're NOT using! show at least one please!!! i.e. if i want the sticker to show up, it's --sticker-dis: block; and --image-dis: none;*/
  39. --sticker-dis: block;
  40. --image-dis: none;
  41. --sticker: url('https://i.imgur.com/MjVkPb4.png');
  42. --image: url('https://i.imgur.com/duAKHkG.png');
  43.  
  44. height:auto; width:100%; max-width:520px; line-height:0; position:relative; display:flex; flex-flow:column nowrap; cursor: var(--cursor); margin:30px auto 40px auto;]
  45.  
  46. [comment]----thread title----[/comment]
  47. [div=height:auto; width:fit-content; width:-moz-fit-content; background: var(--white); border:2px solid var(--border); box-shadow:-2px 2px var(--border); border-radius:20px; padding:8px 15px; box-sizing:border-box; font-family: var(--title); font-size:18px; color: var(--color-5); line-height:100%; position:relative; left:20%;][div=height:40px; width:20px; clip-path: polygon(0 56%, 100% 56%, 100% 100%, 0% 100%); position:absolute; bottom:-17.8px; left:15px;][div=height:18px; width:18px; transform: rotate(70deg) skew(25deg, 25deg); border:2px solid var(--border); box-sizing:border-box; background: var(--white); border-radius:0 0 5px 0; position:relative; top:10px; box-shadow:-4px 4px var(--border);][/div][/div][comment]
  48.  
  49. ----* * * sticker text here----
  50.  
  51. [/comment]welcome to thread![/div]
  52.  
  53. [comment]----main container----[/comment]
  54. [div=height:auto; width:100%; display:flex; flex-flow:row wrap; align-items:center;]
  55. [comment]----icon block----[/comment]
  56. [div=height:180px; width:auto; min-width:160px; flex-shrink:0; margin-top:10px;]
  57. [div=height:180px; width:180px; background: var(--sticker); background-size:contain; display: var(--sticker-dis);][/div]
  58. [div=height:140px; width:145px; border:2px solid var(--border); box-sizing:border-box; border-radius:20px; background: var(--color-1); padding:8px; position:relative; margin:25px 0 0 15px; display: var(--image-dis);][div=height:100%; width:100%; border:2px solid var(--border); box-sizing:border-box; border-radius:13px;
  59.  
  60. /*edit role image to match variables here*/ background: var(--image);
  61.  
  62. background-size:cover;][/div][/div]
  63. [/div]
  64. [comment]----icon block end----[/comment]
  65.  
  66. [comment]----window block----[/comment]
  67. [div=height:auto; flex:1; margin:5px 10px 0 clamp(-32px, 300px - 20vw, 0px);]
  68. [comment]----main window----[/comment]
  69. [div=height:auto; width:100%; border:2px solid var(--border); border-radius:15px; overflow:hidden; position:relative; z-index:5; margin-bottom:5px;]
  70. [comment]----window header----[/comment]
  71. [div=height:25px; width:100%; background: var(--color-2); display:flex; flex-flow:row nowrap; align-items:center; padding:0 15px; box-sizing:border-box; border-bottom:2px solid var(--border);]
  72. [div=height:auto; width:auto; max-width:60%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color: var(--color-5); font-family: var(--title); line-height:100%; font-size:15px; margin-top:1px;][comment]
  73.  
  74. ----* * * window name here----
  75.  
  76. [/comment]gm_name is typing...[/div]
  77.  
  78. [div=height:100%; width:auto; margin-left:auto; border:2px solid var(--border); border-top:0; border-bottom:0; box-sizing:border-box; display:flex; justify-content:center;]
  79. [div=height:100%; width:28px; display:flex; justify-content:center; align-items:center; color: var(--border); font-size:14px;][fa]fas fa-window-minimize[/fa][/div]
  80. [div=height:100%; width:32px; border:2px solid var(--border); border-top:0; border-bottom:0; box-sizing:border-box; display:flex; justify-content:center; align-items:center; color: var(--border); font-size:14px;][fa]far fa-window-maximize[/fa][/div]
  81. [div=height:100%; width:28px; display:flex; justify-content:center; align-items:center; color: var(--border); font-size:18px;][fa]fas fa-times[/fa][/div]
  82. [/div]
  83. [/div]
  84. [comment]----window header end----[/comment]
  85.  
  86. [comment]----window contents----[/comment]
  87. [div=height:auto; width:100%; background: var(--white);][div=height:auto; max-height:170px; width:100%; padding:15px 0 18px 0; box-sizing:border-box; display:flex; flex-direction:column; background: var(--white);][div=height:auto; width:100%; padding:0 20px 0 22px; box-sizing:border-box; scrollbar-width:none; overflow-y:scroll; overflow-x:hidden; --mts: 35px;][div=height:0; width:100%; margin-bottom:calc(var(--mts) * -1);][/div]
  88.  
  89. [comment]----copy this whole thing to add another text section----[/comment]
  90. [div=height:auto; width:100%; margin-top: var(--mts);]
  91.  
  92. [comment]----text contents here----[/comment]
  93. [div=height:auto; width:100%; padding:0 0 0 2px; box-sizing:border-box; color: var(--t-color); font-size:var(--body-fs); text-align:justify; font-family: var(--body); line-height:130%;][comment]
  94.  
  95. ----* * * text starts here----
  96.  
  97. [/comment]hi everyone! this is a thread header for you to do whatever you want in! invite your roleplayers to ask some questions, chat a little, or introduce the thread! yay
  98. [/div]
  99. [/div]
  100. [comment]----copy me too! (text section end)----[/comment]
  101.  
  102. [/div][/div][/div]
  103. [comment]----window contents end----[/comment]
  104. [/div]
  105. [comment]----main window end----[/comment]
  106.  
  107. [comment]----roleplay tags----[/comment]
  108. [div=height:auto; width:100%; display:flex; flex-flow:row wrap; justify-content:flex-end; position:relative; z-index:10; box-sizing:border-box; margin:-3px 0 0 3.5px; --mt: 8px 0 0 8px;]
  109.  
  110. [comment]----copy this whole thing to add another rp tag/links----[/comment]
  111. [div=height:auto; width:fit-content; width:-moz-fit-content; display:flex; flex-flow:row nowrap; border:2px solid var(--border); border-radius:15px; box-sizing:border-box; padding:5px 12px; margin: var(--mt);
  112.  
  113. /*alternate the colours between your tags!*/ background: var(--color-1);
  114.  
  115. ]
  116. [div=height:auto; width:auto; color: var(--color-5); font-family: var(--header); letter-spacing:1px; font-size:11px; line-height:100%; font-weight:bold; text-transform:uppercase;][comment]
  117.  
  118. ----* * * tag content/link here----
  119.  
  120. [/comment][url='xx'][div=display:inline; color: var(--color-5);]ooc[/div][/url][/div]
  121. [/div]
  122. [comment]----copy me too!----[/comment]
  123.  
  124. [comment]----copy this whole thing to add another rp tag/link----[/comment]
  125. [div=height:auto; width:fit-content; width:-moz-fit-content; display:flex; flex-flow:row nowrap; border:2px solid var(--border); border-radius:15px; box-sizing:border-box; padding:5px 12px; margin: var(--mt);
  126.  
  127. /*alternate the colours between your tags!*/ background: var(--color-3);
  128.  
  129. ]
  130. [div=height:auto; width:auto; color: var(--color-5); font-family: var(--header); letter-spacing:1px; font-size:11px; line-height:100%; font-weight:bold; text-transform:uppercase;][comment]
  131.  
  132. ----* * * tag content/link here----
  133.  
  134. [/comment][url='xx'][div=display:inline; color: var(--color-5);]apps[/div][/url][/div]
  135. [/div]
  136. [comment]----copy me too!----[/comment]
  137.  
  138. [comment]----copy this whole thing to add another rp tag/link----[/comment]
  139. [div=height:auto; width:fit-content; width:-moz-fit-content; display:flex; flex-flow:row nowrap; border:2px solid var(--border); border-radius:15px; box-sizing:border-box; padding:5px 12px; margin: var(--mt);
  140.  
  141. /*alternate the colours between your tags!*/ background: var(--color-4);
  142.  
  143. ]
  144. [div=height:auto; width:auto; color: var(--color-5); font-family: var(--header); letter-spacing:1px; font-size:11px; line-height:100%; font-weight:bold; text-transform:uppercase;][comment]
  145.  
  146. ----* * * tag content/link here----
  147.  
  148. [/comment]magical☆cure![/div]
  149. [/div]
  150. [comment]----copy me too!----[/comment]
  151.  
  152. [/div]
  153. [comment]----roleplay tags end----[/comment]
  154.  
  155. [/div]
  156. [comment]----windows block end----[/comment]
  157. [comment]----signature! *** do not remove!! ***----[/comment]
  158. [div=height:auto; width:auto; position:absolute; z-index:6; top:40px; right:16px; opacity:0.1; color: var(--border); font-size:9px;text-align:center; line-height:100%;][font=Open Sans]♡coded by uxie♡[/font][/div]
  159. [/div]
  160. [comment]----main container end----[/comment]
  161. [/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!