ooksie

gardenia (uxie x neon reverie)

Oct 14th, 2020 (edited)
154
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.76 KB | None | 0 0
  1. [border=transparent;
  2. --*the duo-toned background;
  3. --bg-1: #E6EFC2;
  4. --bg-2: #EBB4BD;
  5.  
  6. --*the text background;
  7. --t-bg: #fff;
  8.  
  9. --*the colours of the borders and tab buttons;
  10. --color-1: rgb(234, 171, 180, 0.9);
  11. --color-2: #f28293;
  12. --*this colour is just colour 2 but in rgb form for opacity;
  13. --color-2-o: rgb(242, 130, 147, 0.8);
  14.  
  15. --*the gradient colours// you need to search and replace them manually;
  16. --gradient-1: #EB798B;
  17. --gradient-2: #463437;
  18. --gradient-3: #46463A;
  19.  
  20. --*your text colour;
  21. --t-color: #000;
  22.  
  23. --*your icon image, put your link between the '';
  24. --img-1: url('https://i.pinimg.com/originals/37/7c/82/377c823da3e9974490f7fcb15cdf07a5.jpg');
  25.  
  26. --*your text cover image, put your link between the '';
  27. --img-2: url('https://0.soompi.io/wp-content/uploads/2020/06/01200801/chungha-12.jpeg');
  28.  
  29. --*the lineart flower;
  30. --flower: url('https://cdn.discordapp.com/attachments/763695220701134872/765559637172682772/Untitled_design-removebg-preview.png');
  31.  
  32. height:540px; width:100%; padding:60px 20px; box-sizing:border-box; margin:auto; display:flex; align-items:center; justify-content:center; line-height:0; position:relative; background-color: var(--bg-1);]
  33. [comment]----main container----[/comment]
  34. [border=transparent; height:100%; width:700px; padding:0; position:relative; z-index:2; display:flex; flex-flow: row nowrap;]
  35.  
  36. [comment]----icon area----[/comment]
  37. [border=transparent; height:100%; width:fit-content; padding:0; display:flex; flex-flow: column nowrap; justify-content:flex-start; align-items:center;]
  38. [border=transparent; height:180px; width:180px; padding:0; border:5px solid var(--color-1); background: var(--img-1); background-size:cover;][/border]
  39. [border=transparent; height:fit-content; width:100%; max-width:190px; padding:0; color: var(--t-color); font-size:35px; line-height:80%; text-align:center;][font=Yellowtail][comment]
  40. --------your character's name goes after this----------
  41. [/comment]name goes here
  42. [/font][/border]
  43. [/border]
  44. [comment]----icon area end----[/comment]
  45.  
  46. [comment]----body----[/comment]
  47. [border=transparent; height:100%; flex-grow:1; padding:0; margin-left:6%; display:flex; align-items:center; margin-top:-15px;]
  48.  
  49. [comment]----post area----[/comment]
  50. [border=transparent; height:380px; width:380px; padding:0; overflow:hidden; position:relative; z-index:3;]][border=transparent; height:100%; width:calc(100% + 17px); background-color: var(--t-bg); padding:0; overflow-y:scroll; overflow-x:hidden; line-height:0;]
  51. [comment]----image cover----[/comment]
  52. [border=transparent; height:100%; width:100%; background: var(--img-2) 50% 50%; padding:0; background-size:cover;][/border]
  53.  
  54. [comment]----post text----[/comment]
  55. [border=transparent; height:100%; width:calc(100% + 10px); padding:15px 0px; box-sizing:border-box; color:var(--t-color); display:flex; flex-direction:column;][border=transparent; height:100%; width:200%; padding:0; overflow-y:scroll;]
  56. [border=transparent; height:fit-content; width:50%; padding:0px 15px; box-sizing:border-box; font-size:12px; text-align:justify; line-height:130%;][font=Karla][comment]
  57. -----* * *your post starts after this comment--------
  58. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent mattis lorem nec orci cursus, eget maximus mauris iaculis. Proin ullamcorper aliquet justo vitae scelerisque. Aenean eu ullamcorper nunc, eget tristique tellus. Aliquam erat volutpat. Phasellus quis accumsan diam, quis varius neque. Proin eleifend et libero quis ultrices. Suspendisse non eleifend felis, eget rutrum ex. Phasellus quis ex vehicula, dictum lectus tristique, tincidunt risus. Nulla vulputate nulla non scelerisque porttitor. Proin aliquam lorem eu fringilla feugiat. Vestibulum nisl mi, bibendum a mi eu, viverra posuere ipsum. Etiam laoreet sapien eu molestie tincidunt. Aliquam et nisi augue.
  59.  
  60. Ut vel accumsan lacus, a consequat augue. Nunc lacus risus, convallis at lobortis eu, tincidunt ac diam. Aenean vitae ornare metus. Maecenas aliquam lorem dui, sodales auctor sem vehicula vitae. Duis quis ornare mi. Curabitur at risus ac libero interdum sodales ac eu nisl. Integer quis nibh at augue pharetra pharetra vitae sit amet ex. Praesent non nulla sit amet nunc facilisis tincidunt ac vel risus.
  61.  
  62. Suspendisse aliquam semper gravida. Morbi tempus ex sit amet maximus rhoncus. Nam maximus nibh a turpis facilisis dignissim. Vestibulum eleifend arcu ac elementum congue. Curabitur auctor vehicula nulla, a tristique nibh aliquam eu. Duis eu velit sit amet metus dictum blandit. Aliquam id dictum nunc. Suspendisse luctus risus id metus malesuada, sed gravida tortor rutrum. Sed viverra, mi ac dictum iaculis, est neque consequat leo, eu posuere nisl nulla vitae orci. Sed in congue lorem. Vestibulum vel ante vel dui tempus iaculis.
  63. [comment]----do not remove me!----[/comment]
  64. [border=transparent; height:40px; width:50%; background-color: var(--t-bg); padding:0; font-size:0;]filler text so none of your text is covered by the flower.[/border]
  65. [/font][/border]
  66. [/border][/border]
  67. [comment]----post text end----[/comment]
  68.  
  69. [/border][/border]
  70. [comment]----post area end----[/comment]
  71.  
  72. [comment]----tabs----[/comment]
  73. [border=transparent; height:60%; width:13%; overflow:hidden;padding:0; line-height:550%; margin-top:-20px;][border=transparent; padding:0; margin-left:-15px;][tabs]
  74.  
  75. [comment]----mood----[/comment]
  76. [tab=1][border=transparent; height:180px; width:180px; padding:8px; box-sizing:border-box; position:absolute; left:5px; top:5px; line-height:0; display:flex; align-items:flex-end;]
  77. [border=transparent; height:fit-content; width:100%; background-color: var(--color-2-o); padding:10px; box-sizing:border-box; display:flex; flex-flow: column nowrap;]
  78. [border=transparent; height:fit-content; width:100%; color: var(--t-color); font-size:20px; padding:0; line-height:50%;][font=Yellowtail]mood[/font][/border]
  79. [border=transparent; height:fit-content; width:100%; color: var(--t-color); font-size:11px; padding:0; line-height:120%; margin-top:6px;][font=Karla][comment]
  80. -----* * *your mood goes after this comment* * *----
  81. [/comment]your mood here[/font][/border]
  82. [/border]
  83. [/border][/tab]
  84.  
  85. [comment]----outfit----[/comment]
  86. [tab=2][border=transparent; height:180px; width:180px; padding:8px; box-sizing:border-box; position:absolute; left:5px; top:5px; line-height:0; display:flex; align-items:flex-end;]
  87. [border=transparent; height:fit-content; width:100%; background-color: var(--color-2-o); padding:10px; box-sizing:border-box; display:flex; flex-flow: column nowrap;]
  88. [border=transparent; height:fit-content; width:100%; color: var(--t-color); font-size:20px; padding:0; line-height:50%;][font=Yellowtail]outfit[/font][/border]
  89. [border=transparent; height:fit-content; width:100%; color: var(--t-color); font-size:11px; padding:0; line-height:120%; margin-top:6px;][font=Karla][comment]
  90. -----* * *your outfit goes between the ' ' (replace xx)* * *----
  91. [/comment][url='xx'][border=0; color: var(--t-color); padding:0;]click me![/border][/url][/font][/border]
  92. [/border]
  93. [/border][/tab]
  94.  
  95. [comment]----tags----[/comment]
  96. [tab=3][border=transparent; height:180px; width:180px; padding:8px; box-sizing:border-box; position:absolute; left:5px; top:5px; line-height:0; display:flex; align-items:flex-end;]
  97. [border=transparent; height:fit-content; width:100%; background-color: var(--color-2-o); padding:10px; box-sizing:border-box; display:flex; flex-flow: column nowrap;]
  98. [border=transparent; height:fit-content; width:100%; color: var(--t-color); font-size:20px; padding:0; line-height:50%;][font=Yellowtail]tags[/font][/border]
  99. [border=transparent; height:fit-content; width:100%; color: var(--t-color); font-size:11px; padding:0; line-height:120%; margin-top:6px;][font=Karla][comment]
  100. -----* * *your tags go after this comment* * *----
  101. [/comment]your tags here @/user/[/font][/border]
  102. [/border]
  103. [/border][/tab]
  104.  
  105. [/tabs][/border][/border]
  106.  
  107. [comment]----tab cover----[/comment]
  108. [border=transparent; height:100%; width:13%; padding:70px 0px 90px 0px; box-sizing:border-box; display:flex; flex-flow: column nowrap; justify-content:space-around; position:absolute; right:0; pointer-events:none;]
  109.  
  110. [comment]----button one----[/comment]
  111. [border=transparent; height:65px; width:100%; padding:3px 2px 3px 0px; box-sizing:border-box; display:flex; flex-flow: row nowrap; position:relative; align-items:center; overflow:hidden;]
  112. [border=transparent; height:100%; width:79%; border:1px solid var(--color-2); border-left:0; border-right:0; padding:0px; box-sizing:border-box; position:absolute;][/border]
  113. [border=transparent; height:48px; width:48px; border:1px solid var(--color-2); border-left:0; border-bottom:0; transform:rotateY(53deg) rotateZ(45deg); position:absolute; padding:0; right:-4px;][/border]
  114. [border=transparent; height:100%; width:98%; background-color: var(--color-2); padding:5px 10px 5px 5px; box-sizing:border-box; clip-path: polygon(80% 0, 100% 50%, 80% 100%, 0% 100%, 0 51%, 0% 0%); display:flex; align-items:center; justify-content:center;]
  115. [border=transparent; height:fit-content; width:fit-content; color: var(--t-color); font-size:30px; padding:0; line-height:90%; margin:-5px 0 0 -8px;][font=Yellowtail]mood[/font][/border]
  116. [/border]
  117. [/border]
  118.  
  119. [comment]----button two----[/comment]
  120. [border=transparent; height:65px; width:100%; padding:3px 2px 3px 0px; box-sizing:border-box; display:flex; flex-flow: row nowrap; position:relative; align-items:center; overflow:hidden;]
  121. [border=transparent; height:100%; width:79%; border:1px solid var(--color-2); border-left:0; border-right:0; padding:0px; box-sizing:border-box; position:absolute;][/border]
  122. [border=transparent; height:48px; width:48px; border:1px solid var(--color-2); border-left:0; border-bottom:0; transform:rotateY(53deg) rotateZ(45deg); position:absolute; padding:0; right:-4px;][/border]
  123. [border=transparent; height:100%; width:98%; background-color: var(--color-2); padding:5px 10px 5px 5px; box-sizing:border-box; clip-path: polygon(80% 0, 100% 50%, 80% 100%, 0% 100%, 0 51%, 0% 0%); display:flex; align-items:center; justify-content:center;]
  124. [border=transparent; height:fit-content; width:fit-content; color: var(--t-color); font-size:30px; padding:0; line-height:90%; margin:-5px 0 0 -8px;][font=Yellowtail]outfit[/font][/border]
  125. [/border]
  126. [/border]
  127.  
  128. [comment]----button three----[/comment]
  129. [border=transparent; height:65px; width:100%; padding:3px 2px 3px 0px; box-sizing:border-box; display:flex; flex-flow: row nowrap; position:relative; align-items:center; overflow:hidden;]
  130. [border=transparent; height:100%; width:79%; border:1px solid var(--color-2); border-left:0; border-right:0; padding:0px; box-sizing:border-box; position:absolute;][/border]
  131. [border=transparent; height:48px; width:48px; border:1px solid var(--color-2); border-left:0; border-bottom:0; transform:rotateY(53deg) rotateZ(45deg); position:absolute; padding:0; right:-4px;][/border]
  132. [border=transparent; height:100%; width:98%; background-color: var(--color-2); padding:5px 10px 5px 5px; box-sizing:border-box; clip-path: polygon(80% 0, 100% 50%, 80% 100%, 0% 100%, 0 51%, 0% 0%); display:flex; align-items:center; justify-content:center;]
  133. [border=transparent; height:fit-content; width:fit-content; color: var(--t-color); font-size:30px; padding:0; line-height:90%; margin:-5px 0 0 -8px;][font=Yellowtail]tags[/font][/border]
  134. [/border]
  135. [/border]
  136.  
  137. [/border]
  138. [comment]----tab cover end----[/comment]
  139.  
  140. [comment]----shadow----[/comment]
  141. [border=transparent; height:380px; width:380px; padding:0; position:absolute; margin-top:35px; margin-left:25px; background: linear-gradient(to top right, #EB798B, #463437, #46463A); z-index:-1;][/border]
  142.  
  143. [comment]----flower----[/comment]
  144. [border=transparent; height:150px; width:150px; padding:0; position:absolute; bottom:-25px; margin-left:-70px; z-index:5; background: var(--flower); background-size:100%;][/border]
  145.  
  146. [/border]
  147. [comment]----body end----[/comment]
  148.  
  149. [/border]
  150. [comment]----main container end----[/comment]
  151.  
  152. [comment]----two-toned background----[/comment]
  153. [border=transparent; height:50%; width:100%; background-color: var(--bg-2); padding:0; position:absolute; bottom:0; z-index:1;][/border]
  154.  
  155. [comment]----signature! (do not remove!)----[/comment]
  156. [bg=transparent; height:10px;width:fit-content; margin:auto; z-index:4;color: var(--gradient-1);opacity:0.9;font-size:10px;text-align:center; line-height:120%; position:absolute; align-self:flex-end; margin-left:90px; margin-bottom:-5px;][font=Open Sans]♡design by neon reverie, coded by uxie♡[/font][/bg]
  157. [/border]
Add Comment
Please, Sign In to add comment