pixle_squared | Persona 3 (Male MC and Female MC) - Themed CR Chart

PREVIEW

This CR Chart spans 850px in width and includes various versions depending on how the CR has been going much like the game (Normal, Reversed, Maxed & Broken)
INSTRUCTIONS
♠ Copy the code as much as needed
♠ MAKE SURE YOU EDIT IN HTML MODE AND CLICK DISABLE AUTO-FORMATTING!
♠ Get your Persona Card images from this album: RIGHT HERE. (Cards are made by

twilitfall! Please credit if you use them somewhere else)
♠ If you use the CR chart, I would like if you please keep the credit at the end. I coded it from scratch + got the cards for you to use so all I ask is credit. Thank you! ♥

MALE MC
TOP AREA (Copy just once for top)

CENTRAL AREA (NORMAL RANK) (Recopy for each character you add)

<table style="width: 850px; background-color: #0b8cf2; vertical-align: middle; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin-bottom: -8px;">
  <tr>
    <td valign="top" style="width:100px;"> <center> <img src="DREAMWIDTH_ICON_LINK_GOES_HERE" style="width:100px; height:100px; border: 4px solid #1c3d8a; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; "><BR><img src="ARCANA_IMAGE_GOES_HERE" width="63" height="90" style="border: 4px solid #1c3d8a; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px;"></td>
    <td rowspan="2" style="vertical-align:top; width:100%;">  <table style="width:100%; margin-top: 5px; background-color: #002c47; height:40px; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td><div style="font-family: Verdana, Geneva, sans-serif; color: #f4fcff; font-size: 20pt; text-align: left; font-weight:bold; letter-spacing: 3px; position:relative" >NAME_OF_CHARACTER</div></td></tr></table>
     <table style="width:100%; margin-top: 5px; background-color: #4da7ff; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td>
  
    <p style="color: #0b60a1; font-size: 14pt; font-family:Verdana, Geneva, sans-serif;  text-align: left; letter-spacing: -1px;"><b>ARCANA RANK: NUMBER GOES HERE</B></p>
          <p style="color: #032741; font-size: 13px; text-align: justify; margin-left: 5px; margin-top: -20px; margin-right: 5px; font-family:Verdana, Geneva, sans-serif; line-height: 15px;"> CHARACTER TEXT GOES HERE</P></td></tr></table>
    <td style="width:5px;"></td>
  </tr>
</table>

CENTRAL AREA (MAX RANK) (Recopy for each character you add)

<table style="width: 850px; background-color: #0b8cf2; vertical-align: middle; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin-bottom: -8px;">
  <tr>
    <td valign="top" style="width:100px;"> <center> <img src="DREAMWIDTH_ICON_LINK_GOES_HERE" style="width:100px; height:100px; border: 3px solid #56abff; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 2px #d6ebff;"><BR><img src="ARCANA_IMAGE_GOES_HERE" width="63" height="90" style="border: 3px solid #56abff; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 2px #d6ebff;"></td>
    <td rowspan="2" style="vertical-align:top; width:100%;">  <table style="width:100%; margin-top: 5px; background-color: #002c47; height:40px; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td><div style="font-family: Verdana, Geneva, sans-serif; color: #f4fcff; font-size: 20pt; text-align: left; font-weight:bold; letter-spacing: 3px; position:relative" >NAME_OF_CHARACTER</div></td></tr></table>
     <table style="width:100%; margin-top: 5px; background-color: #4da7ff; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td>
  
    <p style="color: #0b60a1; font-size: 14pt; font-family:Verdana, Geneva, sans-serif;  text-align: left; letter-spacing: -1px; "><b>ARCANA RANK: MAX</B></p>
          <p style="color: #032741; font-size: 13px; text-align: justify; margin-left: 5px; margin-top: -20px; margin-right: 5px; font-family:Verdana, Geneva, sans-serif; line-height: 15px;"> CHARACTER TEXT GOES HERE</P></td></tr></table>
    <td style="width:5px;"></td>
  </tr>
</table>

CENTRAL AREA (REVERSE RANK) (Recopy for each character you add)

<table style="width: 850px; background-color: #0b8cf2; vertical-align: middle; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin-bottom: -8px;">
  <tr>
    <td valign="top" style="width:100px;"> <center> <img src="DREAMWIDTH_ICON_LINK_GOES_HERE" style="width:100px; height:100px; border: 2px solid #ff0000; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 4px #ff0000;"><BR><img src="ARCANA_IMAGE_GOES_HERE" width="63" height="90" style="border: 2px solid #ff0000; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 4px #ff0000;  "></td>
    <td rowspan="2" style="vertical-align:top; width:100%;">  <table style="width:100%; margin-top: 5px; background-color: #002c47; height:40px; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td><div style="font-family: Verdana, Geneva, sans-serif; color: #f4fcff; font-size: 20pt; text-align: left; font-weight:bold; letter-spacing: 3px; position:relative" >NAME_OF_CHARACTER</div></td></tr></table>
     <table style="width:100%; margin-top: 5px; background-color: #4da7ff; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td>
  
    <p style="color: #0b60a1; font-size: 14pt; font-family:Verdana, Geneva, sans-serif;  letter-spacing: -1px; text-align: left;"><b>ARCANA RANK: REVERSE</B></p>
          <p style="color: #032741; font-size: 13px; text-align: justify; margin-left: 5px; margin-top: -20px; margin-right: 5px; font-family:Verdana, Geneva, sans-serif; line-height: 15px;"> CHARACTER TEXT GOES HERE</P></td></tr></table>
    <td style="width:5px;"></td>
  </tr>
</table>

CENTRAL AREA (RANK BROKEN) (Recopy for each character you add)

<table style="width: 850px; background-color: #0b8cf2; vertical-align: middle; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin-bottom: -8px;">
  <tr>
    <td valign="top" style="width:100px;"> <center> <img src="DREAMWIDTH_ICON_LINK_GOES_HERE" style="width:100px; height:100px; border: 2px solid #e46e8e; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 4px #ffb9cc; filter:alpha(opacity=70) !important; opacity:.7"><BR><img src="ARCANA_IMAGE_GOES_HERE" width="63" height="90" style="border: 2px solid #e46e8e; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 4px #ffb9cc; filter:alpha(opacity=70) !important; opacity:.7"></td>
    <td rowspan="2" style="vertical-align:top; width:100%;">  <table style="width:100%; margin-top: 5px; background-color: #002c47; height:40px; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top; filter:alpha(opacity=70) !important; opacity:.7;"> <tr> <td><div style="font-family: Verdana, Geneva, sans-serif; color: #f4fcff; font-size: 20pt; text-align: left; font-weight:bold; letter-spacing: 3px; position:relative" >NAME_OF_CHARACTER</div></td></tr></table>
     <table style="filter:alpha(opacity=70) !important; opacity:.7;width:100%; margin-top: 5px; background-color: #4da7ff; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td>
  
    <p style="color: #0b60a1; font-size: 14pt; font-family:Verdana, Geneva, sans-serif;  text-align: left; letter-spacing: -1px; "><b>ARCANA RANK: BROKEN</B></p>
          <p style="color: #032741; font-size: 13px; text-align: justify; margin-left: 5px; margin-top: -20px; margin-right: 5px; font-family:Verdana, Geneva, sans-serif; line-height: 15px;"> CHARACTER TEXT GOES HERE</P></td></tr></table>
    <td style="width:5px;"></td>
  </tr>
</table>

BOTTOM AREA (Copy just once when you are done with the characters)

FEMALE MC
TOP AREA (Copy just once for top)

CENTRAL AREA (NORMAL NUMBER RANK) (Recopy for each character you add)

<tr>
    <td valign="top" style="width:100px;"> <center> <img src="DREAMWIDTH_ICON_LINK_GOES_HERE" style="width:100px; height:100px; border: 4px solid #680008; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; "><BR><img src="ARCANA_IMAGE_GOES_HERE" width="63" height="90" style="border: 4px solid #680008; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px;"></td>
    <td rowspan="2" style="vertical-align:top; width:100%;">  <table style="width:100%; margin-top: 5px; background-color: #6a000a; height:40px; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td><div style="font-family: Verdana, Geneva, sans-serif; color: #f4fcff; font-size: 20pt; text-align: left; font-weight:bold; letter-spacing: 3px; position:relative" >NAME_OF_CHARACTER</div></td></tr></table>
     <table style="width:100%; margin-top: 5px; background-color: #febfec; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td>
  
    <p style="color: #a4233f; font-size: 14pt; font-family:Verdana, Geneva, sans-serif;  text-align: left; letter-spacing: -1px;"><b>ARCANA RANK: NUMBER GOES HERE</B></p>
          <p style="color: #42000e; font-size: 13px; text-align: justify; margin-left: 5px; margin-top: -20px; margin-right: 5px; font-family:Verdana, Geneva, sans-serif; line-height: 15px;"> CHARACTER TEXT GOES HERE</P></td></tr></table>
    <td style="width:5px;"></td>
  </tr>
</table>

CENTRAL AREA (MAX RANK) (Recopy for each character you add)

<table style="width: 850px; background-color: #f53997; vertical-align: middle; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin-bottom: -8px;">
  <tr>
    <td valign="top" style="width:100px;"> <center> <img src="DREAMWIDTH_ICON_LINK_GOES_HERE" style="width:100px; height:100px; border: 3px solid #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 2px #d6ebff;"><BR><img src="ARCANA_IMAGE_GOES_HERE" width="63" height="90" style="border: 3px solid #fff; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 2px #d6ebff;"></td>
    <td rowspan="2" style="vertical-align:top; width:100%;">  <table style="width:100%; margin-top: 5px; background-color: #6a000a; height:40px; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td><div style="font-family: Verdana, Geneva, sans-serif; color: #f4fcff; font-size: 20pt; text-align: left; font-weight:bold; letter-spacing: 3px; position:relative" >NAME_OF_CHARACTER</div></td></tr></table>
     <table style="width:100%; margin-top: 5px; background-color: #febfec; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td>
  
    <p style="color: #a4233f; font-size: 14pt; font-family:Verdana, Geneva, sans-serif;  text-align: left; letter-spacing: -1px; "><b>ARCANA RANK: MAX</B></p>
          <p style="color: #42000e; font-size: 13px; text-align: justify; margin-left: 5px; margin-top: -20px; margin-right: 5px; font-family:Verdana, Geneva, sans-serif; line-height: 15px;"> CHARACTER TEXT GOES HERE</P></td></tr></table>
    <td style="width:5px;"></td>
  </tr>
</table>

CENTRAL AREA (REVERSE RANK) (Recopy for each character you add)

<table style="width: 850px; background-color: #f53997; vertical-align: middle; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin-bottom: -8px;">
  <tr>
    <td valign="top" style="width:100px;"> <center> <img src="DREAMWIDTH_ICON_LINK_GOES_HERE" style="width:100px; height:100px; border: 2px solid #860026; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 4px #ff0000;"><BR><img src="ARCANA_IMAGE_GOES_HERE" width="63" height="90" style="border: 2px solid #860026; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 4px #ff0000;  "></td>
    <td rowspan="2" style="vertical-align:top; width:100%;">  <table style="width:100%; margin-top: 5px; background-color: #6a000a; height:40px; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td><div style="font-family: Verdana, Geneva, sans-serif; color: #f4fcff; font-size: 20pt; text-align: left; font-weight:bold; letter-spacing: 3px; position:relative" >NAME_OF_CHARACTER</div></td></tr></table>
     <table style="width:100%; margin-top: 5px; background-color: #febfec; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top;"> <tr> <td>
  
    <p style="color: #a4233f; font-size: 14pt; font-family:Verdana, Geneva, sans-serif;  letter-spacing: -1px; text-align: left;"><b>ARCANA RANK: REVERSE</B></p>
          <p style="color: #42000e; font-size: 13px; text-align: justify; margin-left: 5px; margin-top: -20px; margin-right: 5px; font-family:Verdana, Geneva, sans-serif; line-height: 15px;"> CHARACTER TEXT GOES HERE</P></td></tr></table>
    <td style="width:5px;"></td>
  </tr>
</table>

CENTRAL AREA (BROKEN RANK) (Recopy for each character you add)

<table style="width: 850px; background-color: #f53997; vertical-align: middle; -moz-border-radius: 6px; -webkit-border-radius: 6px; margin-bottom: -8px;">
  <tr>
    <td valign="top" style="width:100px;"> <center> <img src="DREAMWIDTH_ICON_LINK_GOES_HERE" style="width:100px; height:100px; border: 2px solid #e46e8e; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 4px #ffb9cc; filter:alpha(opacity=70) !important; opacity:.7"><BR><img src="ARCANA_IMAGE_GOES_HERE" width="63" height="90" style="border: 2px solid #e46e8e; -moz-border-radius: 10px; -webkit-border-radius: 10px; margin-top: 10px; margin-left: 10px; box-shadow: 0px 0px 10px 4px #ffb9cc; filter:alpha(opacity=70) !important; opacity:.7"></td>
    <td rowspan="2" style="vertical-align:top; width:100%;">  <table style="width:100%; margin-top: 5px; background-color: #6a000a; height:40px; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top; filter:alpha(opacity=70) !important; opacity:.7;"> <tr> <td><div style="font-family: Verdana, Geneva, sans-serif; color: #f4fcff; font-size: 20pt; text-align: left; font-weight:bold; letter-spacing: 3px; position:relative" >NAME_OF_CHARACTER</div></td></tr></table>
     <table style="width:100%; margin-top: 5px; background-color: #febfec; -moz-border-radius: 6px; -webkit-border-radius: 6px; vertical-align:top; filter:alpha(opacity=70) !important; opacity:.7;"> <tr> <td>
  
    <p style="color: #a4233f; font-size: 14pt; font-family:Verdana, Geneva, sans-serif;  text-align: left; letter-spacing: -1px; "><b>ARCANA RANK: BROKEN</B></p>
          <p style="color: #42000e; font-size: 13px; text-align: justify; margin-left: 5px; margin-top: -20px; margin-right: 5px; font-family:Verdana, Geneva, sans-serif; line-height: 15px;"> CHARACTER TEXT GOES HERE</P></td></tr></table>
    <td style="width:5px;"></td>
  </tr>
</table>

BOTTOM AREA (Copy just once when you are done with the characters)

RESULTS

SOCIAL LINKS

SHINJIRO ARAGAKI

FORTUNE RANK: 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vehicula tempor dictum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque lorem neque, facilisis non posuere nec, porttitor vel nisl. Quisque neque massa, scelerisque eu pharetra quis, suscipit a lorem. Nam tincidunt, arcu molestie luctus condimentum, libero mi posuere mi, in scelerisque diam enim ac tellus. Vestibulum gravida cursus lacinia. Proin a est ut orci pharetra eleifend eu vel arcu. In mattis auctor imperdiet. Aliquam nec odio nunc. Praesent nec pulvinar est. Ut quis odio augue, vel cursus tortor. Morbi elementum dignissim interdum. Morbi at risus metus. In imperdiet ligula eu augue sodales accumsan. Morbi eget pharetra nisi. Morbi at ipsum a tortor rutrum tincidunt.

SHINJIRO ARAGAKI

FORTUNE RANK: MAX