[ F2U ] User Bounce (CODE (Bootstrap))

jiko

Profile


<!-----------------------------------------------
    
    
    F2U User Bounce (Bootstrap Version)
    > code by jiko
    > last updated 11/03/2026
    
    
    -- RULES -----------------------------------
    
    > read my TOS before using!
      [ https://toyhou.se/36148309.jikos-tos ]
    
    
    -- HOW TO USE CODE -------------------------
    
    > go to your display settings
      [ https://toyhou.se/~account/display ]
    
    > turn OFF WYSIWYG for Profile Text
    > turn ON Code Editor
    
    > go to character/user profile and paste code!
    
    
    -- CUSTOMISATION ---------------------------
    
    > edit the VARIABLES below and the rest of the
    code will automatically adjust itself!
    
    > to change anything outside the given list,
    you must manually edit the code
    
    
----------------------------------------------->
<div id="VARIABLES" style="



/* == ANIMATION ============================= */;

--fa-animation:  fa-bounce;
                 /* to disable animation, replace [fa-bounce] with [none] */
                 /* you could also use different fa-animations too! */

--fa-speed:      2s;
                 /* adjust animation speed from [1s] OR MORE */



">
<div class="mx-auto my-5 text-center" style="scrollbar-color:var(--color-primary) rgba(0,0,0,0); font-size:12pt;

max-width:250px;"><!-- change width here -->
    
    
    
    <!-- NAME
    --------------------------------------------->
    <div class="text-primary" style="
        
        font-weight:700;
        letter-spacing:1px;
        
        font-size:15pt;
        
    ">
        <i>name here</i>
        
    </div>
    
    
    
    <!-- BASIC INFO / CAPTION
    --------------------------------------------->
    <div class="mt-1" style="font-family:'Menlo', monospace; font-size:small;">
        
        word
        
        <i class="fa-regular fa-plus mx-1"></i>
        
        word
        
        <i class="fa-regular fa-plus mx-1"></i>
        
        word
        
    </div>
    
    
    
    <!-- CARD DECRIPTION
    --------------------------------------------->
    <!--
    > replace [block] with [none] to "delete" it
    -->
    <div class="d-block mt-3 card p-3 bg-faded" style="overflow-y:auto; scrollbar-width:thin;
    
    max-height:150px;"><!-- change height here -->
    
    <div class="text-justify" style="font-size:small; opacity:0.7;">
        
        
        <p>this code is designed to be extremely small but here's an scrolling box if you want to write a little bit more!</p>
        
        
    </div>
    </div>
    
    
    
    <!-- PAGEDOLL
    --------------------------------------------->
    <div class="mt-3">
        
        
        <img src="https://f2.toyhou.se/file/f2-toyhou-se/characters/38188683?1773137520"
        
        
        class="d-block mx-auto"
        style="max-width:150px"><!-- change img width here -->
    </div>
    
    
    
    <!-- BOUNCING LINKS
    --------------------------------------------->
    <div class="mt-3" style="font-size:15pt"><!-- change icon size here -->
        
        
        <a href="LINK_HERE" class="m-1" style="text-decoration:none;">
            
            <i class="fa-solid fa-id-card
            
            fa-bounce" style="animation-delay:0s; animation-name:var(--fa-animation); animation-duration:var(--fa-speed);"></i>
        </a>
        
        <!--------------------------------------->
        
        <a href="LINK_HERE" class="m-1" style="text-decoration:none; opacity:0.5;">
            
            <i class="fa-brands fa-tumblr
            
            fa-bounce" style="animation-delay:0.2s; animation-name:var(--fa-animation); animation-duration:var(--fa-speed);"></i>
        </a>
        
        <!--------------------------------------->
        
        <a href="LINK_HERE" class="m-1" style="text-decoration:none;">
            
            <i class="fa-brands fa-bluesky
            
            fa-bounce" style="animation-delay:0.4s; animation-name:var(--fa-animation); animation-duration:var(--fa-speed);"></i>
        </a>
        
        <!--------------------------------------->
        
        <a href="LINK_HERE" class="m-1" style="text-decoration:none; opacity:0.5;">
            
            <i class="fa-solid fa-link
            
            fa-bounce" style="animation-delay:0.6s; animation-name:var(--fa-animation); animation-duration:var(--fa-speed);"></i>
        </a>
        
        
        
    <!-- add more above this line! -->
    </div>
    
    
    
    <!-- CREDITS 
    --------------------------------------------->
    <div class="mt-3 faded" style="font-family:'Menlo', monospace; font-size:10px;">
        <a href="https://toyhou.se/38202852." title="CODE BY JIKO" data-toggle="tooltip" class="m-1 text-reset" style="text-decoration:none;">
            <i class="fa-regular fa-code"></i>
        </a>
        
        +
        
        <!-- ARTIST CREDIT -->
        <a data-toggle="tooltip" class="m-1 text-reset" style="text-decoration:none;"
            
            href="LINK_HERE"
            title="ART BY USERNAME" >
            
            <i class="fa-regular fa-paintbrush"></i>
        </a>
    </div>
</div>
</div><!-- code ends -->