konata
created by:wytchstarr
Custom ColorsHTMLUser
Copy
<!-- COLOURS!! use 'ctrl+f' to find and replace the colours to your liking :) borders: #0620f3 background colour: #57a9ff text: #b4ffc7 --> <!-- CONTAINER --> <div class="row justify-content-center"> <div class="card" style="width:600px; background-image:url(https://img1.picmix.com/output/stamp/normal/5/7/0/6/916075_d80cf.gif); background-position: center; background-attachment: fixed; background-size: cover; background-repeat:no-repeat; border-style:solid; border-width:3px; border-color:#0620f3; margin:50px;"> <!-- BG --> <div class="row justify-content-center"> <div class="card" style="width:600px; background-color:#57a9ff; border-style:solid; border-width:3px; border-color:#0620f3; margin:10px; margin-left:25px; margin-right:25px;"> <!-- HEADER --> <div class="row no-gutters align-items-start"> <!-- COLUMN 1 --> <div class="col-6 col-lg"> </div> <!-- COLUMN 2 --> <div class="col-6 col-lg"> <div style="text-align:center; letter-spacing:2px; color:#b4ffc7;">www.yourusername.net</div> </div> <!-- COLUMN 3 --> <div class="col-6 col-lg"> <div style="text-align:right;"><i class="fa-solid fa-window-minimize" style="color:#b4ffc7; padding: 5px;"></i> <i class="fa-regular fa-window-restore" style="color:#b4ffc7; padding: 5px;"></i> <i class="fa-solid fa-x" style="color:#b4ffc7; padding: 5px;"></i> </div> </div> </div> <!-- MAIN PART --> <div class="row no-gutters align-items-start mb-2"> <!-- COLUMN 1 --> <div class="col-6 col-lg"> <div style="height: 300px; border-top:solid 3px; border-bottom:solid 3px; border-color: #0620f3;"> <div style="text-align:center; font-size:20px; text-decoration: underline; color:#b4ffc7;"><b> about me !! </b></div> <div style="text-align:center; color:#b4ffc7;">write a short bio about you here!! try not to make it go over (or under) 4 lines or the code wont line up properly!!</div> <div style="text-align:center;"><img src="https://i.ibb.co/C5CT62zn/ezgif-32f20ccbf37d56.gif" style="width:170px;"></div> <div style="text-align:center; font-size:20px; text-decoration: underline; color:#b4ffc7;"><b>my fav ocs !!</b></div> <div style="text-align:center; margin-bottom:3px;"><a href="LINK_HERE"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRKSbbhyvxal447n2B057Ol6sP-ubZJD8dSDQ&s" style="width:60px;"></a> <a href="LINK_HERE"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRW17i8Z_X-pcwxlf4gcHSknwOQQo64EojfYVG1hl2X_Ja3Sdif0iD_Vf6OjHO4tKX6x2g&usqp=CAU" style="width:60px;"></a></div> <div style="text-align:center;"><a href="LINK_HERE"><img src="https://images.hobbydb.com/processed_uploads/subject_photo/subject_photo/image/82321/1639006046-862-6805/thinking_400x400_large.png" style="width:60px;"></a> <a href="LINK_HERE"><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTSmwMQt8Lvm--ZovWBZTqGk6LbQKSqBQpjimj-HBUqs1_eDvY1ZioE_Qji89Zz9lryF_Q&usqp=CAU" style="width:60px;"></a></div> </div> </div> <!-- COLUMN 2 --> <div class="col-6 col-lg"> <div style="height: 300px; border:solid 3px; border-color: #0620f3;"> <div style="text-align:center; font-size:20px; text-decoration: underline; color:#b4ffc7;"><b>your name !!</b></div> <div style="text-align:center; color:#b4ffc7;">pronouns . age . idk</div> <div style="text-align:center;"><img src="https://i.ibb.co/C5CT62zn/ezgif-32f20ccbf37d56.gif" style="width:170px;"></div> <div style="text-align:center;"><img src="https://i.ibb.co/B5024833/ezgif-62afd371553e02.gif" style="width:170px;"></div> <div style="text-align:center;"><img src="https://i.ibb.co/C5CT62zn/ezgif-32f20ccbf37d56.gif" style="width:170px;"></div> <div style="text-align:center;"><img src="https://i.ibb.co/d4mpD2XN/konata-blinkie-by-cyberdaydream-dg0pvft.gif" style="width:170px;"></div> </div> </div> <!-- COLUMN 3 --> <div class="col-6 col-lg"> <div style="height: 300px; border-top:solid 3px; border-bottom:solid 3px; border-color: #0620f3;"> <div style="text-align:center; font-size:20px; text-decoration: underline; color:#b4ffc7;"><b>my interests !!</b></div> <div style="text-align:center; color:#b4ffc7;">• put<br> • your<br> • interests<br> • here</div> <div style="text-align:center;"><img src="https://i.ibb.co/C5CT62zn/ezgif-32f20ccbf37d56.gif" style="width:170px;"></div> <div style="text-align:center; font-size:20px; text-decoration: underline; color:#b4ffc7;"><b>my socials !!</b></div> <p style="text-align:center;"> <!-- LINK 1 --> <a href="LINK_HERE"><i class="fa-brands fa-instagram" style="color:#b4ffc7; padding: 5px;"></i></a> <!-- LINK 2 --> <a href="LINK_HERE"><i class="fa-brands fa-twitter" style="color:#b4ffc7; padding: 5px;"></i></a> <!-- LINK 3 --> <a href="LINK_HERE"><i class="fa-brands fa-tumblr" style="color:#b4ffc7; padding: 5px;"></i></a> <!-- LINK 4 --> <a href="LINK_HERE"><i class="fa-solid fa-id-card" style="color:#b4ffc7; padding: 5px;"></i></a> </p> <div style="text-align:center;"><img src="https://media.tenor.com/4oa9147FpNAAAAAm/konata-izumi-lucky-star.webp" style="width:105px;"></div> </div> </div> </div> <!-- FOOTER --> <div class="row no-gutters align-items-start"> <div class="col-6 col-lg"> </div> <div class="col-6 col-lg"> </div> <!-- CREDIT DO NOT REMOVE --> <div class="col-6 col-lg"> <div style="text-align:right; padding-bottom:6px;"><p><a href="https://toyhou.se/wytchstarr"><i class="fa-solid fa-code" style="color:#b4ffc7; padding: 0px;"></i></a> </p></div> </div> </div> </div> </div> </div> </div>