[f2u] pspspsps (code (collar))

Zylphide

Info


Created
3 years, 3 months ago
Creator
Zylphide
Favorites
26

Profile


<!-------------------------------------------
    |         PSPSPSPS (collar)        | 
    |          by Zylphide             | 
---------------------------------------------

main card background color: rgb(65,61,61)
info card background color: rgb(57,54,54)
text color: #FAFAFA
border color: #595555
fur color: (250,250,250,1)
cat ears / toe beans color: #E18A9D
fish color: #89A0C3
fishing line color: #eeeeee
stripes colors: #DC7088 + #E8A0B0
collar color: (232,112,136,1)

-------------------------------------------->

<div class="row justify-content-center">
    <div class=col-lg-9>
    <div class="card p-4 border-0" style="border-radius:35px; background: repeating-linear-gradient(45deg, #DC7088, #DC7088 40px, #E8A0B0 40px, #E8A0B0 80px);">
    
    <div class="col-12 px-0 py-3" style="background: rgb(65,61,61);                
        border-top-right-radius:30px;
        border-top-left-radius:30px;
        border-bottom-right-radius:30px;
        border-bottom-left-radius:30px;">
        
        <!---- paw row top ----->
        <div class="row no-gutters mt-2 align-items-center">
            
            <!---- paw top ---->
            <div class="col-lg-8">
                <!--- change rgba numbers to change fur color ---->
                <div class="card p-2" style="background: rgba(255,255,255,1);
                border-top-right-radius:30px;
                border-top-left-radius:0px;
                border-bottom-right-radius:30px;
                border-bottom-left-radius:0px;">
                    
                    <!---- change color hex code to change toe bean color ----->
                    <span style="text-align: right; color: #E18A9D"><i class="fas fa-paw fa-rotate-90" style="font-size: 2rem"></i></span>             
                </div>
            </div>
            <!---- paw top END ---->
            
            <!---- fish toy top ---->
            <div class="col-lg-1 d-none d-lg-block" style="text-align: right">
                <span style="color: #89A0C3;"><i class="fas fa-fish" style="font-size: 4rem"></i></span>
            </div>
            <div class="col-lg-3 d-none d-lg-block">
                <hr style="background-color: #eeeeee">
            </div>
            <!---- fish toy top END ---->
            
        </div>    
        <!---- paw row top END ----->
        
        <!---- info area ----->
        <div class="row no-gutters justify-content-center">
        <div class="col-lg-11 p-3 mx-2 my-3" style="background: rgb(65,61,61); border: solid 1px #595555;
            border-top-right-radius:10px;
            border-top-left-radius:10px;
            border-bottom-right-radius:10px;
            border-bottom-left-radius:10px;">
            
            <div class="row no gutters">
                <!---- profile picture area ----->
                <div class="col-lg-4 my-auto" style="background: url('https://i.imgur.com/zI32hZt.png'); background-size: contain; background-repeat: no-repeat;">
                    <!---- cat ears ------>
                    <div class="col-12 justify-content-center" style="margin-bottom: -10px">
                        <span class="fa-stack fa-2x">
                          <!----outer ear part ---->
                          <i class="fas fa-triangle fa-stack-2x" style="color:rgb(250,250,250)"></i>
                          <!----outer ear part ---->
                          <i class="fas fa-triangle fa-stack-1x fa-inverse" style="color:rgb(225,138,157)"></i>
                        </span>
                                   
                        <span class="fa-stack fa-2x">
                          <!----outer ear part ---->
                          <i class="fas fa-triangle fa-stack-2x" style="color:rgb(250,250,250)"></i>
                          <!----outer ear part ---->
                          <i class="fas fa-triangle fa-stack-1x fa-inverse" style="color:rgb(225,138,157)"></i>
                        </span>            
                    </div>
                    <!---- cat ears END ------>
                    
                    <!---- profile picture ------>
                    <div class="col-12 justify-content-center">
                        <div class="card-transparent border-0" style="width: 200px; height: 200px; border-top-right-radius:20px; border-top-left-radius: 20px; border-bottom-right-radius:20px; border-bottom-left-radius: 20px;">
                            
                            <!---- profile image URL goes here, use square image for best results ----->
                            <img src="https://images.unsplash.com/photo-1606425270259-998c37268501?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=998&q=80" style="                
                            border-top-right-radius:20px;
                            border-top-left-radius: 20px;
                            border-bottom-right-radius:20px;
                            border-bottom-left-radius: 20px;">
                        </div>
                    </div>
                    <!---- profile picture END------>
                    
                    <!---- collar ---->
                    <div class="col-12 justify-content-center">
                        <div class="card border-0 " style="width: 200px; height: 20px; background: rgba(232,112,136,1); margin-top:-3px">
                            <i class="text-center fas fa-bell mb-3" style="color: #eeeeeee ;font-size: 2.3rem"></i>
                        </div>
                    </div>
                    <!---- collar END ---->
                </div>
                <!---- profile picture area END ----->
                
                <!---- text area ---->
                <div class="col-lg-8 my-2" style="color: #FAFAFA">
                    <!--- name/title ---->
                    <div class="col-12 display-4 justify-content-center p-2" style="font-size: 1.8em;">like nyah?</div>
                    <!---- info area ----->
                    <!---- stats ----->
                    <div class="col-10 mx-auto">
                        <!---- stat row 1 ---->
                        <div class="row">
                            <div class="col-lg-6">
                                <span style="color: #BDBAB9"><b>stat</b></span> 
                                <span class="pull-right">info</span>    
                            </div>
                            
                            <div class="col-lg-6">
                                <span style="color: #BDBAB9"><b>stat</b></span> 
                                <span class="pull-right">info</span>     
                            </div>
                        </div>
                        <!---- stat row 1 END ---->
                        
                        <hr class="my-1" style="background-color: #595555">
                        
                        <!---- stat row 2---->
                        <div class="row">
                            <div class="col-lg-6">
                                <span style="color: #BDBAB9"><b>stat</b></span> 
                                <span class="pull-right">info</span>    
                            </div>
                            
                            <div class="col-lg-6">
                                <span style="color: #BDBAB9"><b>stat</b></span> 
                                <span class="pull-right">info</span>     
                            </div>
                        </div>
                        <!---- stat row 2 END ---->
                        
                        <hr class="my-1" style="background-color: #595555">
                        
                        <!---- stat row 3 ----->
                        <div class="row">
                            <div class="col-lg-6">
                                <span style="color: #BDBAB9"><b>stat</b></span> 
                                <span class="pull-right">info</span>    
                            </div>
                            
                            <div class="col-lg-6">
                                <span style="color: #BDBAB9"><b>stat</b></span> 
                                <span class="pull-right">info</span>     
                            </div>
                        </div>
                        <!---- stat row 3 END ---->
                    </div>
                    <!---- stats END ----->
                    <br>
                    <!---- biography, type as much or as little as you want ------>
                    <p>Caticus cuteicus hunt by meowing loudly at 5am next to human slave food dispenser, annoy kitten brother with poking. Love to play with owner's hair tie chew the plant but dead stare with ears cocked so this is the day so eat too much then proceed to regurgitate all over living room carpet while humans eat dinner, pooping rainbow while flying in a toasted bread costume in space. This is the day . Murr i hate humans they are so annoying. Jump around on couch, meow constantly until given food, eat all the power cords</p>
                    
                    <!---- biography END ---->
                </div>
                <!---- text area ---->
            </div>
        </div>    
        </div>
        <!---- info area END ----->
        
        <!---- paw row bottom ----->        
        <div class="row no-gutters align-items-center mb-2">    

            <!---- fish toy bottom ---->
            <div class="col-lg-3  d-none d-lg-block">
                <hr style="background-color: #eeeeee">
            </div>
            
            <div class="col-lg-1  d-none d-lg-block">
                <span style="color: #89A0C3"><i class="fas fa-fish fa-rotate-180" style="font-size: 4rem"></i></span>
            </div>
            <!---- fish toy bottom END ---->
            
            <!---- paw bottom ---->
            <div class="col-lg-8">
                <!--- change rgba numbers to change fur color ---->
                <div class="card p-2" style="background: rgba(250,250,250,1);
                border-top-right-radius:0px;
                border-top-left-radius:30px;
                border-bottom-right-radius:0px;
                border-bottom-left-radius:30px;">
                    <!---- change color hex code to change toe beans color ----->
                    <span style="color: #E18A9D"><i class="fas fa-paw fa-rotate-270" style="font-size: 2rem"></i></span>    
                    
                </div>
            </div>
            <!---- paw bottom END ---->
        </div>
        <!---- paw row bottom END ----->
    </div>
    </div>
    </div>
</div>
<!---- credits, do not remove! ------>
 <a class="d-block text-center pt-2" style="font-size:12px" href="https://toyhou.se/Zylphide"><i class="fas fa-dragon fa-flip-horizontal" data-placement="left" title="code by Zylphide"></i></a>