<!--- floaty by onethird
thank you for using! rules are here: https://toyhou.se/~forums/16.htmlcss-graphics/241166.-onethird-s-f2u-codes-
i used this site to make the logo under the icon, tested it and it should work with the settings i used: https://www11.flamingtext.com/net-fu/dynamic.cgi?script=supermarket-logo&text=roziist&fontname=Porky%27s+Heavy&fillTextColor=%2392c9e7&fillOutlineColor=%237ba6be&fillOutline2Color=%235d7f92&insetHighlightColor=%23fff&shadowType=5&shadowSelfXOffset=5&shadowSelfYOffset=7&backgroundRadio=0#enterText
dont just link it from there though, use an image hosting site (or discord) to host the image on
accent: #970937
text color: white
--->
<div class="container p-0" style="max-width:400px; font-size:11.5px; font-family:trebuchet ms; letter-spacing:.3px;">
<div class="row no-gutters">
<!--- first column --->
<div class="col-5">
<!--- icon --->
<div class="mx-auto" style="height:120px; width:120px;">
<img src="IMGURL" class="w-100 h-100 img-thumbnail" style="object-fit:cover; background:transparent; border-radius:100px; border: 1px solid #970937">
</div>
<!--- image username or wtvr (adjust height if ur text is too big) --->
<div class="justify-content-center" style="height:50px;">
<img src="IMGURL" alt="IMGTEXT" class="h-100" style="object-fit:cover; margin-top:-23px">
</div>
<!--- basic info --->
<div class="card w-100 border-0 p-1" style="max-height:135px; background:#970937; border-radius:10px; margin-top:-30px; color:white;">
<p class="font-weight-bold text-center m-auto">name . age . prns</p>
</div>
<!--- art info --->
<div class="card w-100 border-0 p-1 mt-2" style="height:105px; background:#970937; border-radius:10px; color:white;">
<h3 class="font-weight-bold my-auto">art info...</h3>
<ul class="list-unstyled" style="margin-top:-5px">
<li>commissions: x</li>
<li>art trades: x</li>
<li>requests: x</li>
</ul>
</div>
</div>
<!--- 2nd column --->
<div class="col-7 pl-2">
<div class="float-left mt-4" style="clip-path:polygon(100% 0, 100% 100%, 0 100%); height:15px; width:12px; background:#970937"></div>
<div class="card border-0 p-1" style="min-height:60px; border-radius:10px; background:#970937; color:white">
<p class="text-center m-auto">blurb. chicken sandwich.</p>
</div>
<!--- info --->
<div class="card mt-2 w-100 p-1" style="height:210px; border-radius:10px; border: 1px solid #970937; background:transparent;">
<!--- about --->
<h3 class="font-weight-bold" style="color:#970937">about... <img src="https://64.media.tumblr.com/7056bb1c383e636dabd6e182152139e3/5807ec89b0828275-53/s75x75_c1/9def6ba51a183099f868127d54521513c7929b87.gifv" style="height:13px"></li></h3></h3>
<p style="margin-top:-5px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.</p>
<!--- favs --->
<h3 class="font-weight-bold" style="color:#970937">favs... <img src="https://64.media.tumblr.com/5b32f14433a446494276dacbcfc576b2/5807ec89b0828275-46/s75x75_c1/09bce26e5bda62505c8b96a7593d3c4760307e81.gifv" style="height:13px"></li></h3>
<ul class="list-unstyled" style="margin-top:-5px;">
<li>list</li>
<li>list</li>
<li>list</li>
<li>list</li>
</ul>
</div>
</div>
</div>
<!--- socials --->
<div class="card mt-2" style="background:#970937; height:30px; border-radius:10px;">
<div class="row p-1">
<!--- instagram --->
<div class="col justify-content-center">
<h3> <a href="URLLINK" style="color:white;"><i class="fa-brands fa-instagram"></i></a> </h3>
</div>
<!--- tumblr --->
<div class="col justify-content-center">
<h3> <a href="URLLINK" style="color:white;"><i class="fa-brands fa-tumblr"></i></a> </h3>
</div>
<!--- artfight --->
<div class="col justify-content-center">
<h3> <a href="URLLINK" style="color:white;"><i class="fa-solid fa-paintbrush-pencil"></i></a> </h3>
</div>
<!--- carrd --->
<div class="col justify-content-center">
<h3> <a href="URLLINK" style="color:white;"><i class="fa-solid fa-id-card"></i></a> </h3>
</div>
</div>
</div>
</div>
<!--- credit, do not remove --->
<div class="col-12 p-0 mx-auto text-right" style="width:400px;">
<a href="https://toyhou.se/onethird" data-toggle="tooltip" title="code by onethird" style="color:#970937"><i class="fa-solid fa-code fa-xs"></i></a>
</div>