Profile
<!--- My first ever profile code ;0; I'm still a beginner though, so there' bound to be mistakes haha- but feel free to ask me questions :D - Put links URLs on parts where it says "LINK" - This version of the code uses bootstrap colors ---> <!--- background [you can just remove this part if you want to] ---> <div style="background-image:url(https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png); background-size: cover; background-repeat: no-repeat; background-position: top; border-radius:15px; background-attachment:fixed;"> <div class="container col-lg-10 py-5"> <div class="row no-gutters my-4"> <!--- COLUMN 1 --> <div class="col-lg-3 p-1"> <div class="bg-faded p-3 text-center" style="height: 395px; border-radius: 8px; overflow-y: auto; box-shadow: 0 0 5px #000000;"> <!--- avatar ---> <img class="mx-auto mt-1 mb-2" src="https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png" style="height:130px; width:130px; border-radius:8px;"> <p class="mb-0" style="font-size: 20px;"> <b>Name</b></p> <i class="text-secondary">"Quote Here"</i> <hr style="margin: 10px 0px"> <p class="mb-0">Prn/Prn • Age</p> <div class="col-12 row no-gutters px-2 mt-3" style="font-size:13px;"> <div class="col-auto pt-1 text-secondary"><i> Requests </i></div> <div class="col mt-2 p-1"><hr class="m-1"></div> <div class="col-auto py-1"> status </div></div> <div class="col-12 row no-gutters px-2" style="font-size:13px;"> <div class="col-auto pt-1 text-secondary"><i> Art trades </i></div> <div class="col mt-2 p-1"><hr class="m-1"></div> <div class="col-auto py-1"> status </div></div> <div class="col-12 row no-gutters px-2" style="font-size:13px;"> <div class="col-auto pt-1 text-secondary"><i> Design trades </i></div> <div class="col mt-2 p-1"><hr class="m-1"></div> <div class="col-auto py-1"> status </div></div> <div class="col-12 row no-gutters px-2" style="font-size:13px;"> <div class="col-auto pt-1 text-secondary"><i> Commissions </i></div> <div class="col mt-2 p-1"><hr class="m-1"></div> <div class="col-auto py-1"> status </div></div> </div> </div> <!--- COLUMN 2 --> <div class="col-lg-8 p-1"> <div class="bg-faded pb-3 px-3 text-center" style="height: 395px; border-radius: 8px; overflow-y: auto ;box-shadow: 0 0 5px #000000;"> <!--- tab buttons ---> <div class="card bg-faded py-3 border-right-0 border-left-0 border-top-0 sticky-top" style="position:sticky;"> <ul class="nav nav-fill m-n2"> <li class="nav-item m-2 bg-primary" style="border-radius: 8px;"> <a href="#ONE" data-toggle="tab" class="nav-link active btn btn-outline-secondary border-0" style="border-radius: 8px; color: white;"> <i class="fas fa-user-circle"></i> </a> </li> <li class="nav-item m-2 bg-primary" style="border-radius: 8px;"> <a href="#TWO" data-toggle="tab" class="nav-link btn btn-outline-secondary border-0" style="border-radius: 8px; color: white;"> <i class="fas fa-paintbrush"></i> </a> </li> <li class="nav-item m-2 bg-primary" style="border-radius: 8px;"> <a href="#THREE" data-toggle="tab" class="nav-link btn btn-outline-secondary border-0" style="border-radius: 8px; color: white;"> <i class="fas fa-user-friends"></i> </a> </li> </ul> </div> <div class="tab-content"> <!--- info ---> <div class="tab-pane fade active show" id="ONE"> <div class="col-12 text-center mt-1 p-2 pb-n5"> <span style="font-size: 24px; font-weight: bold;">Welcome to my Toyhouse<i class="fas fa-stars fa-fw ml-2 text-primary"></i></span> <p class="text-secondary"><br> This box will scroll when filled, but I suggest adding just enough so it'll look neat :D</p> <p class="text-secondary">We're no strangers to love You know the rules and so do I A full commitment's what I'm thinking of You wouldn't get this from any other guy I just want to tell you how I'm feeling Gotta make you understand Never gonna give you up, never gonna let you down Never gonna run around and desert you Never gonna make you cry, never gonna say goodbye Never gonna tell a lie and hurt you We've known each other for so long</p> </div> </div> <!--- other ---> <div class="tab-pane fade" id="TWO"> <div class="col-12 row no-gutters mt-1 pt-2 mb-n5"> <div class="order-1 col-lg-8 p-1"> <!--- you may---> <p class="mb-0 text-uppercase" style="font-size:20px; font-weight:bold;">you may <i class="fad fa-check-square mr-1 text-success"></i></p> <ul class="text-secondary"> <li>can add more bullets</li> <li>-</li> <li>-</li> </ul> <hr style="margin: 10px 0px"> <!--- you may not---> <p class="text-uppercase" style="font-size:20px; font-weight:bold;">You may not <i class="fad fa-times-square mr-1 text-danger"></i></p> <ul class="text-secondary"> <li>-</li> <li>-</li> <li>-</li> </ul> </div> <!--- little image section ---> <div class="col-4 pr-2 tooltipster hidden-md-down my-2" title="credit to artist" style="height: 240px;"> <img src="https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png" style="object-fit: cover; height: 275px; border-radius: 10px;"> </div> <!--- image end ---> </div> </div> <!--- other end ---> <!--- featured ---> <div class="tab-pane fade" id="THREE"> <div class="row no-gutters container justify-content-center"> <div class="mt-2"> <p class="text-secondary">Show off your main characters or friends here</p> <hr style="margin: 10px 0px"> <!--- friend/character ---> <div class="d-inline-flex card border-1 p-1 m-1" style="width:130px; height:130px; border-radius: 8px;"> <div class="card border-0 h-100" style="background-size:cover; background-position:center; background-image:url('https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png');"> <a class="btn btn-outline-primary border-0 btn-block h-100 tooltipster" title="Name" href="LINK" target="_blank"></a> </div> </div> <!--- friend/character ---> <div class="d-inline-flex card border-1 p-1 m-1" style="width:130px; height:130px; border-radius: 8px;"> <div class="card border-0 h-100" style="background-size:cover; background-position:center; background-image:url('https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png');"> <a class="btn btn-outline-primary border-0 btn-block h-100 tooltipster" title="Name" href="LINK" target="_blank"></a> </div> </div> <!--- friend/character ---> <div class="d-inline-flex card border-1 p-1 m-1" style="width:130px; height:130px; border-radius: 8px;"> <div class="card border-0 h-100" style="background-size:cover; background-position:center; background-image:url('https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png');"> <a class="btn btn-outline-primary border-0 btn-block h-100 tooltipster" title="Name" href="LINK" target="_blank"></a> </div> </div> <!--- friend/character ---> <div class="d-inline-flex card border-1 p-1 m-1" style="width:130px; height:130px; border-radius: 8px;"> <div class="card border-0 h-100" style="background-size:cover; background-position:center; background-image:url('https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png');"> <a class="btn btn-outline-primary border-0 btn-block h-100 tooltipster" title="Name" href="LINK" target="_blank"></a> </div> </div> <!--- friend/character ---> <div class="d-inline-flex card border-1 p-1 m-1" style="width:130px; height:130px; border-radius: 8px;"> <div class="card border-0 h-100" style="background-size:cover; background-position:center; background-image:url('https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png');"> <a class="btn btn-outline-primary border-0 btn-block h-100 tooltipster" title="Name" href="LINK" target="_blank"></a> </div> </div> <!--- friend/character ---> <div class="d-inline-flex card border-1 p-1 m-1" style="width:130px; height:130px; border-radius: 8px;"> <div class="card border-0 h-100" style="background-size:cover; background-position:center; background-image:url('https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png');"> <a class="btn btn-outline-primary border-0 btn-block h-100 tooltipster" title="Name" href="LINK" target="_blank"></a> </div> </div> <!--- friend/character ---> <div class="d-inline-flex card border-1 p-1 m-1" style="width:130px; height:130px; border-radius: 8px;"> <div class="card border-0 h-100" style="background-size:cover; background-position:center; background-image:url('https://f2.toyhou.se/file/f2-toyhou-se/images/34089533_GLNI7cdYOd33n7B.png');"> <a class="btn btn-outline-primary border-0 btn-block h-100 tooltipster" title="Name" href="LINK" target="_blank"></a> </div> </div> <!--- friends/characters icons end...you can add more above this line ---> </div> </div> </div> <!--- friends end ---> </div> <!--- tab buttons end ---> </div> </div> <!--- COLUMN 3 --> <div class="col-lg-1 no-gutters p-1"> <div class="bg-faded p-2 justify-content-center" style="max-height: 395px; border-radius: 8px; box-shadow: 0 0 5px #000000; overflow:hidden;"> <div class="row no-gutters justify-content-center"> <!--- social media icons, you can delete the ones you don't have. You can add more or change social media icons, just go and search for them in https://fontawesome.com/icons. This can hold up to 8 icons, or else it'll overflow and the last icon will be cut off ---> <span class="btn px-0 border-0 mt-lg-1 tooltipster" title="Twitch" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fab fa-2x fa-twitch"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Youtube" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fab fa-2x fa-youtube"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Artfight" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fa-solid fa-2x fa-paintbrush-pencil"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Twitter" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fab fa-2x fa-twitter"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Instagram" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="fab fa-2x fa-instagram"></i></a></span> <span class="btn px-0 border-0 tooltipster" title="Discord Tag Here" style="border-radius:8px; height:45px; width:45px;"><i class="fab fa-2x fa-discord text-primary"></i></span> <span class="btn px-0 border-0 tooltipster" title="Other links" style="border-radius:8px; height:45px; width:45px;"><a href="LINK" target="_blank"><i class="far fa-2x fa fa-link"></i></a></span> <hr class="hidden-lg-down" style="margin: 30px 0px;"> <!--- don't remove this! ---> <span class="btn px-0 border-0 tooltipster" title="Code by Vsuvi" style="border-radius:8px; height:45px; width:45px;"><a href="https://toyhou.se/16987356.-f2u-basic-profile-code" target="_blank"><i class="far fa-2x fa-code"></i></a></span> <hr class="hidden-md-down" style="margin: 200px 0px;"> </div> </div> </div> <!--- COLUMN 4 --> <div class="col-lg-12 p-1"> <div class="bg-faded" style="border-radius: 8px; box-shadow: 0 0 5px #000000;"> <!--- folder buttons you can add add more than four buttons! ---> <div class="nav nav-fill row no-gutters"> <span class="nav-item m-2 bg-primary" style="border-radius: 8px; height:34px;"> <a href="LINK" class="nav-link btn btn-outline-secondary border-0" style="font-weight:500; color:white; letter-spacing:0.5px; border-radius: 6px; height:34px;">Folder Name</a> </span> <span class="nav-item m-2 bg-primary" style="border-radius: 8px; height:34px;"> <a href="LINK" class="nav-link btn btn-outline-secondary border-0" style="font-weight:500; color:white; letter-spacing:0.5px; border-radius: 6px; height:34px;">Folder Name</a> </span> <span class="nav-item m-2 bg-primary" style="border-radius: 8px; height:34px;"> <a href="LINK" class="nav-link btn btn-outline-secondary border-0" style="font-weight:500; color:white; letter-spacing:0.5px; border-radius: 6px; height:34px;">Folder Name</a> </span> <span class="nav-item m-2 bg-primary" style="border-radius: 8px; height:34px;"> <a href="LINK" class="nav-link btn btn-outline-secondary border-0" style="font-weight:500; color:white; letter-spacing:0.5px; border-radius: 6px; height:34px;">Folder Name</a> </span> </div> <!--- folder buttons end ---> </div> </div> </div> </div> </div>
Recent Images
No images.