[ F2U ] Small Pride Carrds (demiboy)

jiko

Info


Created
1 year, 10 months ago
Creator
jiko
Favorites
0

Basic Info


NOTE

Profile


Back

CW / TW . . . elit. feugiat. non.

images?q=tbn:ANd9GcRWJhtWTA53Fxv5wSWc_RL
ding
they / him

WEBSITE
comm info
SALES ACC
@username
DISCORD
discord#0000
TWITTER
@twtusername
DEVIANTART
@dAusername
YOUTUBE
@YTusername

What's New
Version History
Version 22.06.2022 2w ago
read more

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.

Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.

Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.


Preview
6527fd2decc4d74572927021830f5c73.jpg
6527fd2decc4d74572927021830f5c73.jpg
6527fd2decc4d74572927021830f5c73.jpg
6527fd2decc4d74572927021830f5c73.jpg
Finger on iPad user

More

BYI . . . Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.

DNI . . . Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.


 <!-------------------------------------------------
 
 
        Pride Carrds — Demiboy version.
        (code by jiko)
        
        ------------------------------
        
        RULES
        → read this thoroughly please, and maybe drop a small comment saying that you've read it? :'3
        thank youu [ https://toyhou.se/~bulletins/127417.code-rules ]
        
        → turn OFF WYSIWYG (in your display settings)
        → turn ON Code Editor
        
        ------------------------------
        
        TIPPY TIPS
        → insert your img links INSIDE brackets or quotation marks!!
        → looking for a good online code editor?  try [ https://th.circlejourney.net/# ] !
        
        ------------------------------
        
        PALETTE
        → blue ----------------- #89acc0
        
        
        → background ----------- #fefefe
        → border-color --------- #ededed
        → text ----------------- #464346
        
        use control/command + f to quickly change the colours!
 
 
 ------------------------------------------------->
 <!--
 the default background is a white background with the grid being customisable!!
 credits to [help-with-coding.tumblr.com]
 -->
 <div class="py-5 px-2" style="
 
 
 background-image:url(https://64.media.tumblr.com/3f8d9d8c9f63a36d4e6d7162c99eea7d/tumblr_nnh0zu3ixz1telelro1_250.png);
 
 
 background-color:#ededed;
 background-size:#;
 background-position:center;

 ">
 <div class="mx-auto my-4" style="color:#464346; max-width:600px; font-size:10.5t;">
 <div class="shadow card border-0 p-2 progress-bar-striped" style="background-color:#89acc0; border-radius:25px">
 <div class="card border-0 p-sm-4 p-3" style="
 
 background-color:#fefefe;
 background-position:center;
 border-radius:20px;">
 <!-------------------------------------------------
 
 
                 DECOR BUTTONS
 

 ------------------------------------------------->
 <div class="text-left mb-2" style="color:#89acc0">
    
    
    <i class="fas fa-angle-left mr-1"></i>
    Back
    
    
 </div>
 <!-------------------------------------------------
 
 
                 WARNINGS (FOR YOU AND OTHER USERS)
 

 ------------------------------------------------->
 <div class="card bg-transparent p-3 mb-2" style="border-color:rgba(0,0,0,0.1); border-radius:10px">
 <p>
    <b><u>CW / TW</u></b> . . .
    
    
    elit.  feugiat.  non.
    
    
 </p>
 </div>
 <!-------------------------------------------------
 
 
                 PEAK AT YOU
 

 ------------------------------------------------->
 <div class="row no-gutters">
    
    
    <!-- ICON
    ----------------------------------------------->
    <!--
    → best if 200x200 or squared
    -->
    <div class="col-4 p-1 pr-2">
        
        
        <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJhtWTA53Fxv5wSWc_RLCvjwLtlaxm--C21_Ww1QHt-leMuFAw1HwmyaBZn8Ii775OG0&usqp=CAU"
        
        
        class="rounded border-0 img-thumbnail p-2" style="background:linear-gradient(
        
        #9f9f9f 0%, #9f9f9f 14%,
        #c3c3c3 14%, #c3c3c3 28%,
        #9ad9eb 28%, #9ad9eb 42%,
        #fff 42%, #fff 56%,
        #9ad9eb 56%, #9ad9eb 70%,
        #c3c3c3 70%, #c3c3c3 84%,
        #9f9f9f 84%, #9f9f9f 100%
        
        ); border-radius:15px">
    </div>
    
    
    <!-- BREIF LOOK
    ----------------------------------------------->
    <div class="col-8 p-1 pl-2 flex-column">
        
        
        <!-- NAME ------------------------------>
        <div style="font-weight:800; font-size:20px">
            
            ding
            
        </div>
        
        
        <!-- PRONOUNS ------------------------------>
        <div class="mt-n1 faded">
            
            they / him
            
        </div>
       
       
        <!-- WORKING SUBSCRIBE BUTTON ------------------------------>
        <!--
        → insert your actual th username for users to subscribe you from here!
        -->
        <div class="mt-auto justify-content-between align-items-center">
            
            
            <a href="https://toyhou.se/YOUR_USERNAME_HERE/subscribe"
            
            
            class="btn btn-sm border-0 text-white" style="background-color:#89acc0; border-radius:10px">
                subscribe
            </a>
            <i class="fas fa-arrow-up-from-square" style="color:#89acc0"></i>
        </div>
    </div>
 </div>
 <!-------------------------------------------------
 
 
                 SOCIAL LINKS
 

 ------------------------------------------------->
 <hr class="w-100" style="border-color:rgba(0,0,0,0.1)">
 <div style="overflow-x:auto;">
 <!--
 → if you have less than 2 or 3 links, add [justify-content-center] BELOW to center the links
 -->
 <div class="row no-gutters text-center" style="flex-wrap:nowrap; font-size:90%">
    
    
    <!-- LINK
    ----------------------------------------------->
    <div class="col-auto p-1">
        <div class="mb-2" style="font-weight:600;">
            WEBSITE
        </div>
        <a href="LINK_HERE" class="text-reset faded">
            
            <i class="fas fa-id-card fa-2x fa-fw"></i>
            
        </a>
        <div class="mt-2">
            comm info
        </div>
    </div>
    <div class="col-auto px-2">
        <div class="card h-100 rounded-0 bg-transparent" style="border-width:0 1px 0 0; border-color:rgba(0,0,0,0.1)"></div>
    </div>
    
    
    <!-- LINK
    ----------------------------------------------->
    <div class="col-auto p-1">
        <div class="mb-2" style="font-weight:600;">
            SALES ACC
        </div>
        <a href="LINK_HERE" class="text-reset faded">
            
            <i class="fas fa-arrow-right-arrow-left fa-2x fa-fw"></i>
            
        </a>
        <div class="mt-2">
            <span>@</span>username
        </div>
    </div>
    <div class="col-auto px-2">
        <div class="card h-100 rounded-0 bg-transparent" style="border-width:0 1px 0 0; border-color:rgba(0,0,0,0.1)"></div>
    </div>
    
    
    <!-- LINK (to your server, if you want)
    ----------------------------------------------->
    <div class="col-auto p-1">
        <div class="mb-2" style="font-weight:600;">
            DISCORD
        </div>
        <a href="#" class="text-reset faded">
            
            <i class="fab fa-discord fa-2x fa-fw"></i>
            
        </a>
        <div class="mt-2">
            discord#0000
        </div>
    </div>
    <div class="col-auto px-2">
        <div class="card h-100 rounded-0 bg-transparent" style="border-width:0 1px 0 0; border-color:rgba(0,0,0,0.1)"></div>
    </div>
    
    
    <!-- LINK
    ----------------------------------------------->
    <div class="col-auto p-1">
        <div class="mb-2" style="font-weight:600;">
            TWITTER
        </div>
        <a href="LINK_HERE" class="text-reset faded">
            
            <i class="fab fa-twitter fa-2x fa-fw"></i>
            
        </a>
        <div class="mt-2">
            <span>@</span>twtusername
        </div>
    </div>
    <div class="col-auto px-2">
        <div class="card h-100 rounded-0 bg-transparent" style="border-width:0 1px 0 0; border-color:rgba(0,0,0,0.1)"></div>
    </div>
    
    
    <!-- LINK
    ----------------------------------------------->
    <div class="col-auto p-1">
        <div class="mb-2" style="font-weight:600;">
            DEVIANTART
        </div>
        <a href="LINK_HERE" class="text-reset faded">
            
            <i class="fab fa-deviantart fa-2x fa-fw"></i>
            
        </a>
        <div class="mt-2">
            <span>@</span>dAusername
        </div>
    </div>
    <div class="col-auto px-2">
        <div class="card h-100 rounded-0 bg-transparent" style="border-width:0 1px 0 0; border-color:rgba(0,0,0,0.1)"></div>
    </div>
    
    
    <!-- LINK
    ----------------------------------------------->
    <div class="col-auto p-1">
        <div class="mb-2" style="font-weight:600;">
            YOUTUBE
        </div>
        <a href="LINK_HERE" class="text-reset faded">
            
            <i class="fab fa-youtube fa-2x fa-fw"></i>
            
        </a>
        <div class="mt-2">
            <span>@</span>YTusername
        </div>
    </div>
    
    
 <!-- add / delete more ABOVE this line! -->
 </div>
 </div>
 <hr class="w-100" style="border-color:rgba(0,0,0,0.1)">
 <!-------------------------------------------------
 
 
                 SUMMARY
 

 ------------------------------------------------->
 <div class="mb-0">
    
    
    <!-- DECOR HEADINGS
    ----------------------------------------------->
    <div class="justify-content-between align-items-center">
        <div style="font-weight:800; font-size:20px">
            
            What's New
            
        </div>
        <div style="font-size:15px; color:#89acc0">
            
            Version History
            
        </div>
    </div>
    <div class="justify-content-between faded mb-2">
        
        <span>Version 22.06.2022</span>
        <span>2w ago</span>
        
    </div>
    
    
    <!-- COLLASPE LINK
    ----------------------------------------------->
    <a class="float-right" data-toggle="collapse" href="#pridecollaspe" style="color:#89acc0">
        read more
    </a>
    
    
    <!-- SUMMARY
    ----------------------------------------------->
    <div class="mb-0">
        
        
        <!-- INTRO ------------------------------>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.</p>
    
    
        <!-- THE HIDING ------------------------------>
        <!--
        → if you want the text to show, just add [show] in the class below
        -->
        <div class="collapse pt-3" id="pridecollaspe">
        
            <p>Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.</p>
            <p>Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis porta eros et velit blandit dapibus. Curabitur ac finibus eros. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.</p>
        
        </div>
    </div>
 </div>
 <hr class="w-100" style="border-color:rgba(0,0,0,0.1)">
 <!-------------------------------------------------
 
 
                 IMAGES
 

 ------------------------------------------------->
 <div class="mb-0">
    
    
    <!-- HEADER
    ----------------------------------------------->
    <div class="mb-2" style="font-weight:800; font-size:20px">
        
        Preview
        
    </div>
    
    
    <!-- FOUR (4) IMAGE MOODBOARD
    ----------------------------------------------->
    <div class="row no-gutters mx-n2">
        
        
        <div class="col-sm-3 col-6 p-2">
            <img src="https://i.pinimg.com/564x/65/27/fd/6527fd2decc4d74572927021830f5c73.jpg"
            class="w-100" style="border-radius:15px; max-height:130px; object-fit:cover;">
        </div>
        
        
        <div class="col-sm-3 col-6 p-2">
            <img src="https://i.pinimg.com/564x/65/27/fd/6527fd2decc4d74572927021830f5c73.jpg"
            class="w-100" style="border-radius:15px; max-height:130px; object-fit:cover;">
        </div>
        
        
        <div class="col-sm-3 col-6 p-2">
            <img src="https://i.pinimg.com/564x/65/27/fd/6527fd2decc4d74572927021830f5c73.jpg"
            class="w-100" style="border-radius:15px; max-height:130px; object-fit:cover;">
        </div>
        
        
        <div class="col-sm-3 col-6 p-2">
            <img src="https://i.pinimg.com/564x/65/27/fd/6527fd2decc4d74572927021830f5c73.jpg"
            class="w-100" style="border-radius:15px; max-height:130px; object-fit:cover;">
        </div>
        
        
    </div>
    
    
    <!-- DEVICE YOU DRAW ON / LOVE THE MOST
    ----------------------------------------------->
    <div class="mt-2 ml-2" style="font-size:15px; color:#89acc0">
        
        
        <i class="far fa-tablet fa-fw mr-2"></i> Finger on iPad user 
        
    </div>
 </div>
 <hr class="w-100" style="border-color:rgba(0,0,0,0.1)">
 <!-------------------------------------------------
 
 
                 BOUNDRIES
 

 ------------------------------------------------->
 <div class="mb-0">
    
    
    <!-- HEADER
    ----------------------------------------------->
    <div class="mb-2" style="font-weight:800; font-size:20px">
        
        More
        
    </div>
    
    
    <!-- BEFORE YOU INTERACT
    ----------------------------------------------->
    <p class="mb-3">
        
        <b><u>BYI</u></b> . . . Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis <b>placerat</b> velit <i>vitae massa sodales, eget</i> mattis nibh pellentesque.
        
    </p>
    
    
    <!-- DO NOT INTERACT
    ----------------------------------------------->
    <p>
        
        <b><u>DNI</u></b> . . . Duis sollicitudin <b>elit <u>sed</u> tellus blandit</b> viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non. Duis placerat velit vitae massa sodales, eget mattis nibh pellentesque.
        
    </p>
 </div>
 <!-------------------------------------------------
 
 
                 CREDITS
 

 ------------------------------------------------->
 </div>
 </div>
 <div class="mt-4 text-center small faded" style="letter-spacing:0.5px">
    
    <a href="https://toyhou.se/16487749.-f2u-pride-carrds" class="text-reset" style="color:#HEXCODE">
        ( code by jiko )
    </a>
    <!--
    → if credits can't be seen due to background, change [text-reset] to text-body (the theme's font colour), text-dark OR text-light
    or manually set the text colour at the [color:#HEXCODE] (delete [class="text-body"] first), as long as it is visible!
    -->
    
 </div>
 </div>
 </div>