Custom ColorsHTMLUser

Line Count: 117
Difficulty:
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>

Password (optional)

Users must enter a password before unlocking this specific version. Please note that this password will only apply to this version.