THU ✈ 009

[wry]

a tokimeki inspired code. while i'm not sure what you'd use this for, it can make for a great muselist or cr chart. i think... LMFAO...

Tokimeki Panel 😍 😄 😊 😐 😢 😣

OTOYA MASATO NATSUKI TOKIYA REN SYO ??? RINGO RYUUYA TOMOCHIKA ??? ???

code:
<center> <table style="width: 600px; margin-bottom: 50px;"> <tr> <td style="background: #fff; border-top-left-radius: 10px; border-bottom-left-radius: 10px; vertical-align: middle;"><div style="background: #08d3fb; width: 300px; height:390px; border-radius: 20px; -moz-border-radius: 20px; border: 4px solid #fff; vertical-align: middle;"><center><font face="ms gothic" color="#E1F2F9"><span style="text-shadow: 1px 1px 1px #fff; font-size: 12.5pt;">TITLE</span></font> <div style="width: 280px; height:225px; background: url('http://i.imgur.com/PoTdz6r.png'); border: 3px solid #fff; border-radius: 15px; -moz-border-radius: 15px; border-top-left-radius: 30px; -moz-top-left-radius: 30px; border-top-right-radius: 30px; -moz-top-right-radius: 30px; margin-top: 5px;"><img src="http://i.imgur.com/n68tJkC.png" height="225px"><div style="margin-top: -#px"><img src="HEART PICTURE" height="#px"></div><img src="USERPIC" height="75px" width="75px" style="border-radius:50%;"></div> <div style="background: #08d3fb; margin-top: 40px; border-top: 3px solid #fff; border-bottom-left-radius: 10px; -moz-border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; -moz-border-bottom-right-radius: 10px;"><center><span style="color: #fff; font-size: 25pt"><span style="background-color: #COLOR; border-radius:20%;">😍</span> <span style="background-color: #COLOR; border-radius:20%;">😄</span> <span style="background-color: #COLOR; border-radius:20%;">😊</span> <span style="background-color: #COLOR; border-radius:20%;">😐</span> <span style="background-color: #COLOR; border-radius:20%;">😢</span> <span style="background-color: #COLOR; border-radius:20%;">😣</span></span></center></div></center></div></td> <td style="background: #97E3FF; border-top-right-radius: 10px; border-bottom-right-radius: 10px; vertical-align: middle;"><div style="background: #E1F2F9; width: 300px; height:350px; border-radius: 20px; -moz-border-radius: 20px; border: 8px solid #fff; padding-top:5px;"> <center><img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <div style="float: left; position: relative; left: 12px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 23px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 35px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 50px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <div style="float: left; position: relative; left: 12px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 23px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 35px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 50px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <img src="USERPIC" height="65px" width="65px" style="border:2px solid #fff; border-radius:50%;"> <div style="float: left; position: relative; left: 12px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 23px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 35px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> <div style="float: left; position: relative; left: 50px; background: #fff; width:60px;"><font color="#08d3fb" face="ms gothic">NAME</font></div> </div></td> </tr> </table> </center>

things to note:
1. you can change the second heart size to whatever you want. just find: (img src="HEART PICTURE" height="#px") then put the height you want and using that number, add 8 to it to get a margin value to put in (div style="margin-top: -#px"). e.g. if the height is 100 then the margin should be -108... there's a little minus sign that i almost forgot about. make sure it's there. furthermore, the biggest you should go is 220/-228.
2. i won't be surprised if some of the little emotes/faces don't show up for people because some computers simply can't read them. just replace whatever emoticon you can't see with something from here which is where i got them all in the first place
3. next to all of the faces you'll see (span style="background-color: #COLOR;) if you want to have a highlighting effect, replace #COLOR with something of your choosing and you'll be set. if you don't want that then it's fine to just leave it as is
4. the number of icons on the right hand side preview should be your maximum, any more and the code doesn't work properly! but any less is fine
5. ~spread the love~ aka make sure to replace "HEART PICTURE" with one of these. hotlinking them is fine

Comments

[watchthethrone]

This would make a great shipping chart.

[popuri]

this is super cute wow