[67] Kinky Tier List

[lina_trinch]

Code:
<div style="margin: auto; width: 650px; min-height: 500px; display: grid; grid-template-columns: 100px 1fr; grid-template-rows: repeat(5, 100px); gap: 1px; background: #000; font-family: Arial, Helvetica, sans-serif; border: 1px solid #000; cursor: default;"> <div style="grid-area: 1 / 1 / 2 / 2; background: #ff7f7f; display: grid; align-items: center; justify-content: center; color: #000;">Faves</div> <div style="grid-area: 2 / 1 / 3 / 2; background: #ffbf7f; display: grid; align-items: center; justify-content: center; color: #000;">Yes</div> <div style="grid-area: 3 / 1 / 4 / 2; background: #ffdf7f; display: grid; align-items: center; justify-content: center; color: #000;">Maybe</div> <div style="grid-area: 4 / 1 / 5 / 2; background: #ffff7f; display: grid; align-items: center; justify-content: center; color: #000;">IC No</div> <div style="grid-area: 5 / 1 / 6 / 2; background: #bfff7f; display: grid; align-items: center; justify-content: center; color: #000;">OOC No</div> <!--FAVES--> <div style="grid-area: 1 / 2 / 2 / 3; background: #1a1a17; overflow-y: auto;"> <!--block--> <div style="display: inline-block; margin: 1px; padding: 2px; border-radius: 5px; background: #eee; color: #000; font-size: 12px;"> Kink </div> <!--ADD MORE FAVES KINKS ABOVE THIS LINE--> </div> <!--YES--> <div style="grid-area: 2 / 2 / 3 / 3; background: #1a1a17; overflow-y: auto;"> <!--block--> <div style="display: inline-block; margin: 2px; padding: 2px; border-radius: 5px; background: #eee; color: #000; font-size: 12px;"> Kink </div> <!--ADD MORE YES KINKS ABOVE THIS LINE--> </div> <!--MAYBE--> <div style="grid-area: 3 / 2 / 4 / 3; background: #1a1a17; overflow-y: auto;"> <!--block--> <div style="display: inline-block; margin: 2px; padding: 2px; border-radius: 5px; background: #eee; color: #000; font-size: 12px;"> Kink </div> <!--ADD MORE MAYBE KINKS ABOVE THIS LINE--> </div> <!--IC NO--> <div style="grid-area: 4 / 2 / 5 / 3; background: #1a1a17; overflow-y: auto;"> <!--block--> <div style="display: inline-block; margin: 2px; padding: 2px; border-radius: 5px; background: #eee; color: #000; font-size: 12px;"> Kink </div> <!--ADD MORE IC NO KINKS ABOVE THIS LINE--> </div> <!--OOC NO--> <div style="grid-area: 5 / 2 / 6 / 3; background: #1a1a17; overflow-y: auto;"> <!--block--> <div style="display: inline-block; margin: 2px; padding: 2px; border-radius: 5px; background: #eee; color: #000; font-size: 12px;"> Kink </div> <!--ADD MORE OOC NO KINKS ABOVE THIS LINE--> </div> </div> <div style="width: 650px; margin: 10px auto; font-size: 8px; font-family: monospace; font-weight: bold; letter-spacing: 2px; text-align: left; color: #000; text-transform: uppercase;"> <a href="https://killthecake.dreamwidth.org/" style="color: #000; text-decoration: none;"> CODE </a> </div>

❖ These codes were released early on the Patreon! Feel free to check out things over there if you want early codes or some exclusive content. ❖ Also, this was a request from someone! If you ever have a request for a code you want to see and don't care how long it takes (or that it'll be public), you can always throw me suggestions here. ❖ Make sure Disable Auto-Formatting is checked when you copy/paste the code into your post. ❖ This was made to look like those TierMaker lists. You can customize this as much as you want, even use it for something other than kink lists. ❖ Each box scrolls, too. Ctrl+F & Replace: ❖ Kink - Placeholder text for each bubble. There's one in each row by default, but copy/paste as many as you like. #ff7f7f #ffbf7f #ffdf7f #ffff7f #bfff7f Row header backgrounds. #000 The main background, borders, and text. #1a1a17 Background of each cell in the info column. #eee The background of each "kink bubble" as I'm calling them.