Profile
9:59 pm
Library
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. 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.
pls tw for me: thing, about thing, thing in this context.
Before You Interact
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.
Do Not Interact
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.
Song Title
<!-------------------------------------------------
Pride Carrds — Agender 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
→ black --------------- #382d27
→ grey ---------------- #84796f
→ white --------------- #e0d7c5
→ green --------------- #aeb067
→ background ----------- #fefefe
→ grid-bg -------------- #ededed
→ text ----------------- #464346
use control/command + f to quickly change the colours!
------------------------------------------------->
<!--
→ the default background is a white bg with a custom grid!!
→ if you want, you can use the reverse (white grid, custom bg) here:
https://64.media.tumblr.com/2adde365cfa8297b633fe2468cf0bc05/tumblr_nnh0zu3ixz1telelro2_250.png
→ credits to [help-with-coding.tumblr.com]
-->
<div class="py-sm-5 p-3" style="border-radius:40px;
background-image:url(https://64.media.tumblr.com/3f8d9d8c9f63a36d4e6d7162c99eea7d/tumblr_nnh0zu3ixz1telelro1_250.png);
background-color:#ededed;
background-size:#;
background-position:#;
">
<div class="mx-auto my-sm-4 my-3" style="color:#464346; max-width:400px; font-size:10pt;">
<div class="shadow card border-0 p-3" style="background-color:#382d27; border-radius:35px">
<!-------------------------------------------------
DECOR HEADER
------------------------------------------------->
<div class="card border-0 rounded-0 py-2 px-3 text-center" style="border-radius:25px 25px 0 0;background-color:#84796f;">
<div class="text-white text-monospace">
9:59 pm
</div>
</div>
<div class="card border-0 rounded-0 p-3" style="background-color:#fefefe;">
<!-------------------------------------------------
DECOR BUTTON
------------------------------------------------->
<div class="text-left mb-2" style="color:#aeb067">
<i class="fas fa-angle-left mr-1"></i>
Library
</div>
<!-------------------------------------------------
PEAK AT YOU
------------------------------------------------->
<div class="row no-gutters">
<!-- ICON
----------------------------------------------->
<!--
→ best of 200x200 or squared
-->
<div class="col-4 p-1 pr-2">
<img src="https://pbs.twimg.com/media/EbLYBwIUMAAwi4F.jpg"
class="img-thumbnail p-2 border-0"
style="border-radius:15px; background:linear-gradient(
#181717 0%, #181717 14%,
#c7c5bc 14%, #c7c5bc 28%,
#fff 28%, #fff 42%,
#b3c46e 42%, #b3c46e 56%,
#fff 56%, #fff 70%,
#c7c5bc 70%, #c7c5bc 84%,
#181717 84%, #181717 100%
)">
</div>
<!-- BREIF LOOK
----------------------------------------------->
<div class="col-8 p-1 pl-2 flex-column">
<!-- NAME ------------------------------>
<div style="font-weight:800; font-size:20px">
gumi
</div>
<!-- PRONOUNS ------------------------------>
<div class="mt-n1 mb-3 align-items-center faded">
no pronouns, use name only
</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:#aeb067; border-radius:10px">
subscribe
</a>
<i class="fas fa-circle-ellipsis fa-lg" style="color:#aeb067"></i>
</div>
</div>
</div>
<hr class="w-100" style="border-color:#464346; opacity:0.2">
<!-------------------------------------------------
SOCIAL LINKS
------------------------------------------------->
<div class="text-center mb-2" style="letter-spacing:10px;">
<a href="LINK_HERE" style="color:#464346; text-decoration:none">
<i class="fas fa-id-card fa-lg fa-fw"></i>
</a>
<a href="LINK_HERE" style="color:#464346; text-decoration:none">
<i class="fab fa-twitter fa-lg fa-fw"></i>
</a>
<a href="LINK_HERE" style="color:#464346; text-decoration:none">
<i class="fab fa-deviantart fa-lg fa-fw"></i>
</a>
<a href="LINK_HERE" style="color:#464346; text-decoration:none">
<i class="fab fa-trello fa-lg fa-fw"></i>
</a>
<!-- add more above THIS line! -->
</div>
<!-------------------------------------------------
QUICK LINKS
------------------------------------------------->
<div class="row no-gutters">
<!-- LINK SOMEHERE
----------------------------------------------->
<div class="col p-1">
<a href="LINK_HERE"
class="btn btn-sm w-100" style="background-color:#e0d7c5; color:#382d27">
#sonas
</a>
</div>
<!-- LINK SOMEHERE
----------------------------------------------->
<div class="col p-1">
<a href="LINK_HERE"
class="btn btn-sm w-100" style="background-color:#e0d7c5; color:#382d27">
#comms
</a>
</div>
<!-- LINK SOMEHERE
----------------------------------------------->
<div class="col p-1">
<a href="LINK_HERE"
class="btn btn-sm w-100" style="background-color:#e0d7c5; color:#382d27">
#sales acc
</a>
</div>
<!-- add more above THIS line! but i think it looks best minimally ovo)b -->
</div>
<hr class="w-100" style="border-color:#464346; opacity:0.2">
<div class="accordion md-accordion" id="accordion" aria-multiselectable="true">
<!-------------------------------------------------
ABOUT
------------------------------------------------->
<div class="about">
<!-- ALBUM BUTTON
----------------------------------------------->
<div class="card border-0 bg-transparent mb-2" role="tab" id="heading1">
<a class="justify-content-between align-items-center text-reset" style="text-decoration:none"
data-toggle="collapse" data-parent="#accordion" href="#prideabout" aria-expanded="true" aria-controls="prideabout">
<span>
<img src="https://pbs.twimg.com/media/EiLj6t2VgAAXe80.jpg"
class="mr-2 rounded shadow"
style="max-width:50px; max-width:50px; object-fit:cover">
<span class="font-weight-bold" style="color:#aeb067">
About
</span>
</span>
<i class="fas fa-angle-right fa-fw"></i>
</a>
<hr class="w-100 mt-3 mb-2" style="border-color:#464346; opacity:0.2">
</div>
<!-- CONTENT
----------------------------------------------->
<div id="prideabout" class="collapse show" role="tabpanel" aria-labelledby="heading1" data-parent="#accordion">
<div class="mb-3">
<p><i class="fas fa-seedling fa-fw mr-2" style="color:#aeb067"></i>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio. Donec accumsan tempor lacus, et venenatis elit feugiat non.</p>
<p>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>
<!-------------------------------------------------
BOUNDARIES
------------------------------------------------->
<div class="boundaries">
<!-- ALBUM BUTTON
----------------------------------------------->
<div class="card border-0 bg-transparent mb-2" role="tab" id="heading1">
<a class="justify-content-between align-items-center text-reset" style="text-decoration:none"
data-toggle="collapse" data-parent="#accordion" href="#pridedni" aria-expanded="true" aria-controls="pridedni">
<span>
<img src="https://pbs.twimg.com/media/EiLj6t2VgAAXe80.jpg"
class="mr-2 rounded shadow"
style="max-width:50px; max-width:50px; object-fit:cover">
<span class="font-weight-bold" style="color:#aeb067">
Boundaries
</span>
</span>
<i class="fas fa-angle-right fa-fw"></i>
</a>
<hr class="w-100 mt-3 mb-2" style="border-color:#464346; opacity:0.2">
</div>
<!-- CONTENT
----------------------------------------------->
<div id="pridedni" class="collapse" role="tabpanel" aria-labelledby="heading1" data-parent="#accordion">
<div class="mb-3">
<!-- CW/TW FOR YOU AND/OR OTHERS ------------------------------>
<p>
<u class="font-weight-bold">pls tw for me:</u>
thing, about thing, thing in this context.
</p>
<!-- BYI ------------------------------>
<p class="font-weight-bold mb-0" style="color:#aeb067">Before You Interact</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.
</p>
<!-- DNI ------------------------------>
<p class="font-weight-bold mb-0" style="color:#aeb067">Do Not Interact</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis sollicitudin elit sed tellus blandit viverra sed eget odio.
</p>
</div>
</div>
</div>
<!-------------------------------------------------
FEATURED FRIENDS OR CHARACTERS
OR KINS
------------------------------------------------->
<div class="featuring">
<!-- ALBUM BUTTON
----------------------------------------------->
<div class="card border-0 bg-transparent mb-2" role="tab" id="heading3">
<a class="justify-content-between align-items-center text-reset" style="text-decoration:none"
data-toggle="collapse" data-parent="#accordion" href="#pridefeat" aria-expanded="true" aria-controls="pridefeat">
<span>
<img src="https://pbs.twimg.com/media/EiLj6t2VgAAXe80.jpg"
class="mr-2 rounded shadow"
style="max-width:50px; max-width:50px; object-fit:cover">
<span class="font-weight-bold" style="color:#aeb067">
Featured Peeps
</span>
</span>
<i class="fas fa-angle-right fa-fw"></i>
</a>
</div>
<!-- CONTENT
----------------------------------------------->
<div id="pridefeat" class="collapse" role="tabpanel" aria-labelledby="heading3" data-parent="#accordion">
<div class="row no-gutters mt-3 mx-n1 text-center">
<a href="LINK_TO_THEM" class="col-6 p-1 mb-1">
<img src="https://pbs.twimg.com/media/EiLj6t2VgAAXe80.jpg" style="border-radius:10px">
</a>
<a href="LINK_TO_THEM" class="col-6 p-1 mb-1">
<img src="https://pbs.twimg.com/media/EiLj6t2VgAAXe80.jpg" style="border-radius:10px">
</a>
<a href="LINK_TO_THEM" class="col-6 p-1 mb-1">
<img src="https://pbs.twimg.com/media/EiLj6t2VgAAXe80.jpg" style="border-radius:10px">
</a>
<a href="LINK_TO_THEM" class="col-6 p-1 mb-1">
<img src="https://pbs.twimg.com/media/EiLj6t2VgAAXe80.jpg" style="border-radius:10px">
</a>
</div>
</div>
</div>
</div>
</div>
<!-------------------------------------------------
MUSIC PLAYER
(does not play)
------------------------------------------------->
<div class="card border-0 rounded-0 p-3" style="background-color:#e0d7c5;">
<div class="justify-content-between align-items-center">
<!-- ALBUM COVER + SONG
----------------------------------------------->
<span>
<img src="https://pbs.twimg.com/media/EbLYBwIUMAAwi4F.jpg" class="mr-2 rounded shadow" style="max-width:50px; max-width:50px; object-fit:cover">
Song Title
</span>
<!-- BUTTON DECOR
----------------------------------------------->
<span style="font-size:20px">
<i class="fas fa-pause fa-fw"></i>
<i class="fas fa-forward fa-fw"></i>
</span>
</div>
</div>
<!-------------------------------------------------
DECOR FOOTER
------------------------------------------------->
<div class="card border-0 rounded-0 p-3" style="border-radius:0 0 25px 25px;background-color:#84796f;">
<!-- BLANK -->
</div>
</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>
Recent Images
No images.