[ F2U ] Small Pride Carrds (sapphic)

jiko

Info


Created
1 year, 10 months ago
Creator
jiko
Favorites
0

Profile


my toyhou.se
@ KATE !!

introvert minor
she / they
asian + sapphic
aries, AEST (GST+10)

spotify twt dA tumblr discord#0000

pls tw for: blood, gore, insects

(❛▿❛✿) content, content, content, content, content, content

(눈‸눈) content, content, content, content, content, content

unknown.png
BEFORE YOU INTERACT !!

lorem ipsum, dolor sit amet, consectetur adipiscing elit.

DON'T INTERACT IF !!

duis sollicitudin elit, sed tellus, blandit viverra sed eget odio.

COMFORTS !!

name (origin), name (origin), name (origin), name (origin), name (origin)

trending tags

 <!-------------------------------------------------
 
 
        Pride Carrds — Sapphic 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
        → pink ----------------- #ff8aa8
        → text in pink --------- #fcf3ff
        → purple --------------- #c868c7
        → background ----------- #fefefe
        → text ----------------- #464346
        
        use control/command + f to quickly change the colours!
 
 
 ------------------------------------------------->
 <!--
 → find more transparent pattern/image from CanadianLyynx
 [ https://toyhou.se/6259293.-f2u-transparent-patterns/gallery ]
 -->
 <div class="p-lg-5 p-4" style="border-radius:40px; background-color:#ffe1e9;
 
 background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/20541632_fGcH0QYkt9q77d9.png);
 
 background-size:#;
 background-position:#;">
 <div class="mx-auto my-sm-4" style="color:#464346; max-width:550px; font-size:10.5pt;">
 <!-------------------------------------------------
 
 
                 TOP HEADER (DECOR)
 

 ------------------------------------------------->
 <div class="card border-0 p-2 px-3 mb-2" style="background-color:#ff8aa8; border-radius:20px 20px 10px 10px">
 <div class="d-flex justify-content-between align-items-center" style="color:#fcf3ff;">
    
    
    <div style="font-weight:700; letter-spacing:1px;">
        my toyhou.se
    </div>
    
    
    <i class="fas fa-house-chimney-heart fa-lg fa-fw"></i>
    <!--
    → find more icons to use at [fontawesome.com] !
    -->
    
    
 </div>
 </div>
 <!-------------------------------------------------
 
 
                 BASIC INFOS
 

 ------------------------------------------------->
 <div class="card border-0 p-2 px-3 mb-2" style="background-color:#fefefe; border-radius:10px">
 <div class="row no-gutters">
    
    
    <!-- ICON + QUICK LINKS
    ---------------------------------------------->
    <div class="col-sm-4 col-5 my-auto p-1">
        <div class="text-center mb-2">
        <!--
        → best if 200x200 or squared
        -->
            
            
            <img src="https://pbs.twimg.com/media/FFqX_UBUcAE9MRg.jpg"
            
            class="rounded img-thumbnail p-2 border-0"
            style="background:linear-gradient(
        
            #ff8aa8 0%, #ff8aa8 33%,
            #fff 33%, #fff 66%,
            #ff8aa8 66%, #ff8aa8 100%
            );">
            
            
        </div>
        <!--
        → you know those bulletin memes?
        i was thinking of those lol
        -->
        <div class="text-left">
            
            
            <i class="fas fa-angle-right fa-fw fa-sm mr-1" style="color:#ff8aa8"></i>
            <a href="LINK_HERE" class="text-reset">rules</a><br>
            
            
            <i class="fas fa-angle-right fa-fw fa-sm mr-1" style="color:#ff8aa8"></i>
            <a href="LINK_HERE" class="text-reset">boundaries</a><br>
            
            
            <i class="fas fa-angle-right fa-fw fa-sm mr-1" style="color:#ff8aa8"></i>
            <a href="LINK_HERE" class="text-reset">faq</a><br>
            
            
            <i class="fas fa-angle-right fa-fw fa-sm mr-1" style="color:#ff8aa8"></i>
            <a href="LINK_HERE" class="text-reset">design prefs</a><br>
            
            
        <!-- add / delete above THIS line, but i think it looks best minimally ovo)b -->
        </div>
    </div>
    
    
    <!-- BRIEF INTRO
    ---------------------------------------------->
    <div class="col-sm-4 col-7 p-1 text-center my-auto">
        
        
        <!-- NAME -------------------------------->
        <div style="font-size:24px; color:#ff8aa8; font-weight:900; letter-spacing:3px;">
            
            
            <i class="faded">@</i>
            KATE
            <i class="faded">!!</i>
            
            
        </div>
        
        
        <!-- ICON DIVIDER ------------------------>
        <div class="my-2">
            <i class="fas fa-flower" style="color:#c868c7"></i>
        </div>
        
        
        <!-- INFO -------------------------------->
        <!--
        → don't need to keep the exact info format
        → use <br> whenever you want a line break :]
        -->
        <div class="my-2">
        <p>
            
            introvert <i>minor</i><br>
            <b>she / they</b> <br>
            asian + sapphic <br> 
            aries, AEST (GST+10)
            
        </p>
        </div>
        
        
        <!-- ICON DIVIDER ------------------------>
        <div class="my-2">
            <i class="fas fa-flower" style="color:#c868c7"></i>
        </div>
        
        
        <!-- SOCIAL MEDIA -------------------------------->
        <div class="mb-0">
            
            <a href="LINK_HERE" class="text-reset" style="text-decoration:underline">spotify</a>
            <a href="LINK_HERE" class="text-reset" style="text-decoration:underline">twt</a>
            <a href="LINK_HERE" class="text-reset" style="text-decoration:underline">dA</a>
            <a href="LINK_HERE/" class="text-reset" style="text-decoration:underline">tumblr</a>
            
            discord#0000
            
        </div>
    </div>
    
    
    <!-- INTERESTS
    ---------------------------------------------->
    <!--
    → code looks best with the minimum >wo)b
    -->
    <div class="col-sm-4 p-1">
        
        
        <!-- TW/CW FOR YOURSELF OR OTHER PEOPLE -->
        <div class="card p-1 px-2 bg-transparent mt-sm-0 mt-2 mb-3" style="border-color:#ff8aa8; border-width:2px">
        <p>
            
            <b>pls tw for:</b> blood, gore, insects
            
        </p>
        </div>
        
        
        <!-- LIKES -------------------------------->
        <p><span class="mr-2 p-1" style="background-color:rgba(0,0,0,0.1)">(❛▿❛✿)</span>
        
            content, content, content, content, content, content
        </p>
        
        
        <!-- DISLIKES ----------------------------->
        <p><span class="mr-2 p-1" style="background-color:rgba(0,0,0,0.1)">(눈‸눈)</span>
            
            content, content, content, content, content, content
            
        </p>
    </div>
</div>
</div>
 <!-------------------------------------------------
 
 
                 INTERACTION BOUNDARIES
 

 ------------------------------------------------->
 <div class="card border-0 p-2 px-3 mb-2" style="background-color:#fefefe; border-radius:10px">
 <div class="clearfix">
    
    
    <!-- PAGEDOLL
    ---------------------------------------------->
    <div class="text-center">
        <img src="https://cdn.discordapp.com/attachments/704981844843692094/990102348586188800/unknown.png" class="m-2 ml-sm-3 float-sm-right" style="max-width:200px">
    </div>
    
    
    <!-- BEFORE YOU INTERACT
    ---------------------------------------------->
    <div class="mb-3">
        <div style="font-size:16px; color:#ff8aa8; font-weight:900; letter-spacing:1px;">
            
            BEFORE YOU INTERACT
            <i class="faded">!!</i>
            
        </div>
        <p>
            
            <b>lorem ipsum</b>, dolor sit amet, consectetur adipiscing elit.
            
        </p>
    </div>
    
    
    <!-- NO INTERACT
    ---------------------------------------------->
    <div class="mb-3">
        <div style="font-size:16px; color:#ff8aa8; font-weight:900; letter-spacing:1px;">
            
            DON'T INTERACT IF
            <i class="faded">!!</i>
            
        </div>
        <p>
            
            duis sollicitudin elit, <b>sed tellus</b>, blandit viverra sed eget odio.
            
        </p>
    </div>
    
    
    <!-- COMFORTS / KINS / FAVOURITE (THING)
    ---------------------------------------------->
    <div class="mb-3">
        <div style="font-size:16px; color:#ff8aa8; font-weight:900; letter-spacing:1px;">
            
            <i class="faded far fa-heart"></i>
            COMFORTS
            <i class="faded">!!</i>
            
        </div>
        <p>
            
            name (origin), name (origin), name (origin), name (origin), name (origin)
            
        </p>
    </div>
    
    
 <!-- add /delete above THIS line! -->
 </div>
 </div>
 <!-------------------------------------------------
 
 
                 EXTRA LINKS (3)
                 
                 this can be:
                 → friends
                 → ocs
                 → folders on your account
                 → tags on your account (e.g. sonas, story, adopts)
 

 ------------------------------------------------->
 <div class="card border-0 p-2 px-3 mt-3" style="background-color:#ff8aa8; border-radius:10px">
    <div class="text-center" style="font-size:16px; color:#fcf3ff; font-weight:700; letter-spacing:1px;">
        
        trending tags
        
    </div>
</div>
<div class="row no-gutters mx-n1 mt-2 mb-2">
    
    <div class="col p-1">
        <a href="LINK_HERE" class="btn btn-sm w-100" style="color:#c868c7; background:#fefefe; border-radius:10px; text-decoration:underline">
            
            #tag
            
        </a>
    </div>
    
    
    <div class="col p-1">
        <a href="LINK_HERE" class="btn btn-sm w-100" style="color:#c868c7; background:#fefefe; border-radius:10px; text-decoration:underline">
            
            #tag
            
        </a>
    </div>
    
    
    <div class="col p-1">
        <a href="LINK_HERE" class="btn btn-sm w-100" style="color:#c868c7; background:#fefefe; border-radius:10px; text-decoration:underline">
            
            #tag
            
        </a>
    </div>
</div>
 <!-------------------------------------------------
 
 
                 FOOTER
 

 ------------------------------------------------->
 <div class="card border-0 p-3" style="color:#fcf3ff; background-color:#ff8aa8; border-radius:10px 10px 20px 20px">
    
    <!-- BLANK -->
    
 </div>
 </div>
 </div>
<!-------------------------------------------------
 
 
                 CREDITS
 

 ------------------------------------------------->
 <div class="mt-3 text-center small faded" style="letter-spacing:0.5px">
    
    <a href="https://toyhou.se/16487749.-f2u-pride-carrds" class="text-body" style="color:#HEXCODE">
        ( code by jiko )
    </a>
    <!--
    → if credits can't be seen due to background, change [text-body] to 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>