Код:

<!--HTML-->
<link href="https://fonts.googleapis.com/css?family=Ubuntu:400,700" rel="stylesheet"> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

<center>
<div class="carolina"><div class="sogood">
<img src="https://starity.hu/images/articles/embed/2014/12/06/10844153-1511798745737614-809591437-n-1417863254.jpg"> 

<div class="goodgirl"> <table width="100%" cellspacing="0" cellpadding="0">

<td width="80"><div class="everysituation">
<div class="everysituations" style="background-image: url(https://78.media.tumblr.com/6bf1f416957c6aec463820cadeae1ea8/tumblr_inline_p83e5thMHd1szg2em_100.gif);"></div></div></td> 

<td><div class="betterswim"> 

<b>@</b>maiamitchell <br>
<span> <b>❝</b> Australian actress and singer. <b>❞</b></span>

</div></td></table>  <div class="westcoaster">

<b>@maiamitchell</b> comment the @ and username shouldn't have a space either but it keeps putting it as an alert even in code tags omfg

</div></div> </div>

<div class="wannascream">
<table width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td width="250"><div class="withoutinvitations"> maia mitchell <b><i class="fa fa-check-circle" aria-hidden="true"></i></b> 
<div class="ohsofar"> <b>987</b> posts &nbsp;  &nbsp;  <b>5,3m</b> followers &nbsp;  &nbsp;  <b>634</b> following  <br> los angeles, ca &amp; london, uk.  </div></div></td>

<td> <div class="shoutitout"  style="position: relative;">
<div class="shoutit" style="background-image: url(https://31.media.tumblr.com/acddde31aa4be36527d55f9db3d40bb0/tumblr_inline_om7tosyAl51uat7qm_500.gif);"></div></div> </td></tr></tbody></table></div></div></div>

Код:

<!--HTML--><style type="text/css">
.instag {width:380px;background-color:#fff;border:1px solid #f0f0f0;padding:20px;}
.instag1 {margin-right:15px;margin-bottom:15px;width:100px;height:100px;border-radius:100%;-moz-border-radius:100%;-webkit-border-radius:100%;-o-border-radius:100%;}
.instag2 {width:230px;font-family:arial;font-size:10px;color:#444;letter-spacing:0px;text-align:justify;}
.instag3 {margin-bottom:10px;font-size:15px;font-weight:bold;}
.aka {font-family:calibri;font-size:10px;color:#919191;}
.aka a{color: #919191!important;}
</style>

<center><div class="instag"><table><td><div class="instag1" style="background-image:url(100PX BY 100PX CHARACTER AVATAR);"></div></td><td><div class="instag2"><div class="instag3">

CHARACTER'S USER ALAIS

</div><b>

CHARACTER NAME

</b> A LITTLE INFO ABOUT YOUR CHARACTER

<div style="margin-top:10px;"><b>

# OF POSTS

</b> posts <font color="#fafafa">XX</font> <b>

# OF FOLLOWERS

</b> followers <font color="#fafafa">XX</font> <b>

# OF FOLLOWING

</b> following</div></div></td></table><table><tr><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td></tr><tr><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td></tr><tr><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td><td>

<img src="SQUARE IMAGE SHOULD SHRINK TO FIT" width="120" height="120">

</td></tr></table></div><div class="aka"></div></center>

Код:

<!--HTML--><style type="text/css">
.insta {width:328px;background-color:#fff;border-top:1px solid #eee;border-left:1px solid #eee;border-right:1px solid #eee;padding:10px;}
.insta1 {width:25px;height:25px;border-radius:100%;-moz-border-radius:100%;-webkit-border-radius:100%;-o-border-radius:100%;}
.insta2 {margin-left:5px;width:260px;font-family:arial;font-size:12px;color:#1256a5;text-align:left;}
.insta3 {width:25px;font-family:arial;font-size:12px;color:#aaa;}
.insta4 {width:348px;border:1px solid #eee;}
.insta5 {width:328px;background-color:#fff;border-left:1px solid #eee;border-right:1px solid #eee;border-bottom:1px solid #eee;padding:10px;}
.insta6 {width:75px;font-family:arial;font-size:10px;color:#1256a5;text-align:left;letter-spacing:0px;}
.insta7 {width:240px;font-family:arial;font-size:10px;color:#444;text-align:left;letter-spacing:0px;}
.insta8 {margin-top:10px;width:318px;border-top:1px solid #eee;padding-top:10px;}
.insta9 {width:25px;font-size:20px;color:#aaa;}
.insta10 {width:255px;font-family:arial;font-size:15px;font-color:#aaa;text-align:left;}
.aka {font-family:calibri;font-size:10px;color:#919191;}
.aka a{color: #919191!important;}
</style>


<center><div class="insta"><table><td><div class="insta1" style="background-image:url(25PX BY 25PX CHARACTER USER IMAGE HERE);"></div></td><td><div class="insta2"><b>

CHARACTER'S ONLINE ALIAS

</b>

</br><font color="#4090e1">YOU CAN ADD A LOCATION, REMOVE THIS LINE IF YOU DON'T WANT TO HAVE ONE</font>

</div></td><td><div class="insta3">

#m FOR MINUTES h FOR HOURS d FOR DAYS

</div></td></table></div><div class="insta4">

<img src="IMG HERE SHOULD BE NO SMALLER THAT 348PX BY 348PX" width="348">

</div><div class="insta5"><table><td><div class="insta6 "><b>

CHARACTER'S ONLINE ALIAS

</b></div></td><td><div class="insta7">

YOU MAY PUT A MESSAGE HERE IF YOU LIKE

</div></td></table><div class="insta8"><table><td><div class="insta9" style="margin-right:5px;"><i class="fa fa-heart-o"></i></div></td><td><div class="insta10">Add a comment...</div></td><td><div class="insta9"><i class="fa fa-ellipsis-h"></i>
</div></td></table></div></div></center>

Код:

<!--HTML--><link href="https://fonts.googleapis.com/css?family=Jaldi:400,700|Rajdhani:400,700|Teko:300,500" rel="stylesheet">
<div id="socesout">
<div class="soctopim">
<img src="http://placehold.it/550x170.png">
</div>

<div class="socesbot">

<div class="botleftsoc">
<div class="socleftim">
<div class="socleftimin">
<img src="http://placehold.it/200x200.png">
</div>
</div>
<div class="leftaboutsoc">
<b>about</b> words in here about the page owner ✧｡٩(ˊᗜˋ*)و✧｡ some more words [≡] 〆(・⺫・‶)
</div>

<div class="leftphotosoc">
<b>latest images</b>
<img src="http://placehold.it/100x100.png">
<img src="http://placehold.it/100x100.png">
<img src="http://placehold.it/100x100.png">

<img src="http://placehold.it/100x100.png">
<img src="http://placehold.it/100x100.png">
<img src="http://placehold.it/100x100.png">

<img src="http://placehold.it/100x100.png">
<img src="http://placehold.it/100x100.png">
<img src="http://placehold.it/100x100.png">
</div>
</div>

<div class="botrightsoc">
<div class="socstats">
<h1><n>firstname m. lastname</n></h1>
<li><b>12345</b> followers</li> <li><b>230</b> following</li> <li><b>2398</b> posts</li> <li><b>2341</b> likes</li>
</div>

<div class="essocposts">

<div class="postsoc">
<div class="soctext">
<p>writing some words inside of here that are a post</p>
</div>
</div>

<div class="postsoc">
<img src="http://placehold.it/400x400.png">
<div class="soctext">
<p>words inside here that are words that are a caption or they're post a who knows</p>
</div>
</div>

<div class="postsoc">
<div class="soctext">
<p>words inside here that are words that are a caption or they're post a who knows</p>
</div>
</div>

<div class="postsoc">
<div class="soctext">
<p>words inside here that are words that are a caption or they're post a who knows</p>
</div>
</div>


</div>

</div>

</div>
</div>
<div class="escredit"><a href="http://candylandcouture.jcink.net/index.php?showuser=3840">essi</a></div>
<style type="text/css">
.escredit {
   margin: auto;
   margin-toP: 3px;
   text-align: center;
   font-size: 7px;
   font-family: arial;
   text-transform: uppercase;
   letter-spacing: 3px;
margin-bottom: 50px;
}

#socesout {
   width: 530px;
   margin: 50px auto;
margin-bottom: 0;
   background: #f3f3f3;
   overflow: hidden;
   border: 3px solid #fff;
   border-radius: 10px;
   position: relative;
   font-size: 12px;
   letter-spacing: .6px;
   line-height: 20px;
}
.soctopim {
   border-top-right-radius: 6px;
     border-top-left-radius: 6px;
   overflow: hidden;
}

.soctopim img {
   width: 550px;
   height: 170px;
}

.socesbot {
   position: relative;
}

.botleftsoc {
   float: left;
   width: 190px;
   margin-top: -5px;
   height: 360px;
   background:#f3f3f3;
   border-top: 3px solid #fff;
}

.socleftim {
   margin-left: 33px;
   width: 106px;
   margin-top: -60px;
   padding: 8px;
   background:#f3f3f3;
   border-radius:100%;
}

.socleftimin {
   padding:3px;
   height: 100px;
   width: 100px;
   border-radius:100%;
   /* Permalink - use to edit and share this gradient: [URL=http://colorzilla.com/gradient-editor/#a27ff4+0,9ea9ef+12,e085f7+45,e88253+71,d6ac4a+92]http://colorzilla.com/gradient-editor/#a27ff4+0,9ea9ef+12,e085f7+45,e88253+71,d6ac4a+92[/URL] */
background: rgb(162,127,244); /* Old browsers */
background: -moz-linear-gradient(top, rgba(162,127,244,1) 0%, rgba(158,169,239,1) 12%, rgba(224,133,247,1) 45%, rgba(232,130,83,1) 71%, rgba(214,172,74,1) 92%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(162,127,244,1) 0%,rgba(158,169,239,1) 12%,rgba(224,133,247,1) 45%,rgba(232,130,83,1) 71%,rgba(214,172,74,1) 92%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(162,127,244,1) 0%,rgba(158,169,239,1) 12%,rgba(224,133,247,1) 45%,rgba(232,130,83,1) 71%,rgba(214,172,74,1) 92%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a27ff4', endColorstr='#d6ac4a',GradientType=0 ); /* IE6-9 */
}

.socleftimin img {
   width: 90px;
   height: 90px;
   margin: 2px;
   padding:2px;
   border: 1PX SOLID #FFf;
   border-radius:100%
}

.leftaboutsoc {
   margin: 15px 20px;
   margin-top: 8px;
   text-align: justify;
   font-family: jaldi;
   letter-spacing: .5px;
  font-size: 11px; 
   height: 83px;
}

.leftaboutsoc b {
   text-transform: uppercase;
   font-size: 10px;
   color:#aaa;
   letter-spacing: 3px;
   display: block;
   margin-bottom: 3px;
}

.leftphotosoc {
   margiN: 10px 20px;
   font-family: jaldi;
}

.leftphotosoc b {
   display: block;
       text-transform: uppercase;
   font-size: 10px;
   color:#aaa;
   letter-spacing: 3px;
       margin-bottom: 5px;
}

.leftphotosoc img {
   display: inline-block;
   width: 47px;
   height: 47px;
   margin-bottom: -4px;
   border-radius: 4px;
}

.botrightsoc::-webkit-scrollbar {
   display: none;
}


.botrightsoc {
       border-top: 3px solid #fff;
   float: left;
   background: #f3f3f3;
   margin-left: 0px;
   margin-top: -5px;
   padding: 10px;
   width: 310px;
   padding-right: 20px;
   height: 340px;
   overflow: auto;
}

.socstats {
   padding: 3px 0px;
   text-align: center;
   font-family: jaldi;
   border-radius: 10px;
   overflow: hidden;
   margin: -12px;
   margin-left: -10px;
   margin-bottom: 15px;
   margin-top: 1px;
   /* Permalink - use to edit and share this gradient: [URL=http://colorzilla.com/gradient-editor/#a27ff4+0,9ea9ef+12,e085f7+45,e88253+71,d6ac4a+92]http://colorzilla.com/gradient-editor/#a27ff4+0,9ea9ef+12,e085f7+45,e88253+71,d6ac4a+92[/URL] */
background: rgb(162,127,244); /* Old browsers */
background: -moz-linear-gradient(top, rgba(162,127,244,1) 0%, rgba(158,169,239,1) 12%, rgba(224,133,247,1) 45%, rgba(232,130,83,1) 71%, rgba(214,172,74,1) 92%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(162,127,244,1) 0%,rgba(158,169,239,1) 12%,rgba(224,133,247,1) 45%,rgba(232,130,83,1) 71%,rgba(214,172,74,1) 92%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(162,127,244,1) 0%,rgba(158,169,239,1) 12%,rgba(224,133,247,1) 45%,rgba(232,130,83,1) 71%,rgba(214,172,74,1) 92%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a27ff4', endColorstr='#d6ac4a',GradientType=0 ); /* IE6-9 */

}

.socstats h1 {
   margin: 0;
   font-family: jaldi;
   text-transform: lowercase;
   font-weight: 800;
   font-size: 20px;
   letter-spacing: .8px;
   color:#9ca0b9;
       background:#fff;
   padding: 0px 10px;
   padding-bottom: 0;
   margin: -4px -5px;
   line-height: 50px;
   height: 48px;
   margin-bottom: 3px;
   }

.socstats h1 n {
   display: block;
   margin: 0 -10px;
}

.socstats li {
   display: inline-block;
   background:#f8f8f8;
   margin: 7px 1px;
   padding: 2px 6px;
   height: 14px;
   line-height: 15px;
   text-transform: uppercase;
   border-radius: 4px;
   letter-spacing: .6px;
   font-size:9px;
   color:#999;
}

.socstats li b {
   font-family: rajdhani;
   font-size: 10px;
   color:#8975b7;
}

.essocposts {
   height: 227px;
   overflow: visible;
   margin-top: 0px;
   padding: 15px 0;
   margin: 0 -10px;
}

.postsoc {
   margin-top: -15px;
   margin-bottom: 30px;
   background:#e9e9e9;
   border-radius: 8px;
   text-align: center;
   overflow: hidden;
}

.postsoc::before {
   content:"posted 06/23/18 23:32";
   font-size: 8px;
   text-transform: uppercase;
   font-family: rajdhani;
   text-align: right;
   display: block;
   padding: 0px 13px;
   background:#d6cfe8;
   color:#fff;
   font-weight: 800;
   letter-spacing: 1px;
}

.postsoc img {
   width: 300px;
background:#fff;
   padding: 15px;
   margin-bottom: -5px;
}

.soctext {  
   display: block;
   padding: 5px;
}

.soctext p {
   display: block;
   margin: 1px;
   border-radius: 5px;
   background:#fff;
   padding: 15px 25px;
   text-align: justify;
   line-height: 15px;
   font-family: jaldi;
}
</style>

Код:

<!--HTML-->
<center>
<div id="POSTNUMBERHERE">
<div class="ignamebar"><a href="http://candyland-couture.com/index.php?showuser=1603" target="_blank"><img src="http://files.jcink.net/uploads/berryskellington//insta_header1.jpg"></a></div>
<div class="igusericon"><img src="http://placehold.it/30x30" width="30"> 
<div class="igusername">username</div></div>
<div style="width: 311px; overflow: hidden; padding: 0px 2px 7px 2px; background-color: #fff; position: relative;">
<img src="http://placehold.it/300" width="300"></div>
<div style="width: 315px; overflow: hidden; position: relative; background-color: #fff;"><a href="http://candyland-couture.com/index.php?showuser=1603" target="_blank"><img src="http://files.jcink.net/uploads/berryskellington//comment_copy_JPG.jpg" width="315"></a></div>
<div class="igpostcap"><b><font size="3">&hearts;</font> 721 likes</b><br>
<b>username</b> caption goes here! caption goes here! caption goes here! caption goes here! caption goes here! caption goes here! 
<br><i>#hashbrowns</i></div>
</div></center><style type="text/css">
#POSTNUMBERHERE { width: 320px; border-radius: 10px; border: 1px solid #ccc; background-color: #fff; }
.ignamebar { width: 315px; background-color: #fff;  position: relative; overflow: hidden; padding-top: 5px; display: inline-block; border-radius: 10px; }
.igusericon { width: 303px; height: 30px; position: relative; padding: 5px 5px 5px 7px; background-color: #fff; text-align: left; overflow: hidden; } .igusericon img { border-radius: 100px; }
.igusername { width: 200px; position: relative; padding: 4px; color: #222; font-family: 'Calibri'; font-size: 13px; font-weight: bold; text-align: left; top: -26px; left: 35px; text-transform: lowercase; }
.igpostcap { width: 301px; position: relative; padding: 7px; font-family: 'Calibri', sans-serif; font-size: 12px; color: #222; overflow: auto; background-color: #ffffff; text-align: justify; line-height: 13px;  line-height: 11px; border-radius: 6px;} .igpostcap i { color: #093351; } .igpostcap b { color: #222; font-family: Calibri'; font-size: 12px; font-weight: bold; }
</style>

Код:

<!--HTML--><style type="text/css">
#CHAR'S-IG { width: 320px; background-color: #fff; border: solid 1px #ccc;  border-radius: 10px;}
.iguserbar { width: 315px; background-image: url(http://files.jcink.net/uploads/berryskellington//insta_user1_JPG.jpg);  position: relative; overflow: hidden; padding-top: 5px; display: inline-block; border-radius: 10px; }
.userigname { width: 200px; height: 15px; font-family: 'Arial'; font-size: 14px; font-weight: bold; position: relative; left: -35px; color: #000; text-align: left; text-transform: none; padding: 15px 1px 1px 1px; }
.userigprofile { width: 295px; background-color: #fff; padding: 1px; position: relative; color: #222; display:inline-block; }
.dotheavatar { width: 85px; height: 85px; position: relative; display: inline-block; top: -20px; }
.dotheavatar img { border-radius: 100px; }
.demfollowcount { width: 185px; position: relative; display: inline-block; left: 10px; margin-top: 20px;}
.demfollowcount td { font-size: 13px; color: #222; }
.infothingie { width: 275px; background-color: #fff; font-family: Calibri; font-size: 13px; font-color: #222; display: inline-block;  text-align: left; line-height: 90%; }
.infothingie b { font-weight: 800; }
.infothingie i { color: #105687; font-style: normal; }
.tinybubbles { width: 315px; overflow: hidden; background-color: #fff; }
.smolavatar { width: 23px; height: 23px; position: relative; right: -120px; top: 30px; display: inline-block;}
.smolavatar img { border-radius: 100px; }
</style>
<center>
<div id="CHAR'S-IG">
<div class="iguserbar"><div class="userigname">username</div>
</div>
<div class="userigprofile">
<div class="dotheavatar"><a href="http://candyland-couture.com/index.php?showuser=1603"><img src="http://placehold.it/80x80" width="80" height="80"></a></div>
<div class="demfollowcount"><table width="180" align="center" cellpadding="0" style="font-family: Calibri; font-size: 13.5px; color: #222;">
<tr><td align="center" width="80px"><b>700</b><br><font color="#a2a2a2" style="font-size:11px;">posts</font></td>
<td align="center" width="80px"><b>730</b><br><font color="#a2a2a2" style="font-size:11px;">followers</font></td>
<td align="center" width="80px"><b>760</b><br><font color="#a2a2a2" style="font-size:11px;">following</font></td>
</tr>
<tr><td colspan="3"></td></tr>
<tr><td colspan="3" align="center" height="5" style="padding:3px; border: 1px solid #ccc; border-radius: 5px;">
<b><font color="#222" style="font-size:12px;">EDIT YOUR PROFILE</font></b>
</td></tr>
</table></div>
<div class="infothingie"><b>name here</b>
<br> bio info here. 
<br> <i>linkcangohere.com</i>
</div>
</div>
<div style="width: 309px; background-color: #fff; overflow: hidden;"><img src="http://files.jcink.net/uploads/berryskellington//insta_selfoptions1_JPG.jpg" width="300"></div>
<div class="tinybubbles">
<table cellpadding="1"><tr><td><img src="http://placehold.it/100x100" width="100"></td>
<td><img src="http://placehold.it/100x100" width="100"></td>
<td><img src="http://placehold.it/100x100" width="100"></td>
</tr>
<tr><td><img src="http://placehold.it/100x100" width="100"></td>
<td><img src="http://placehold.it/100x100" width="100"></td>
<td><img src="http://placehold.it/100x100" width="100"></td></tr>
</table>
</div>
<div style="width: 314px; background-color: #fff; overflow: hidden; margin-top: -20px;"><div class="smolavatar"><img src="http://placehold.it/23" width="23" height="23"></div><img src="http://files.jcink.net/uploads/berryskellington//insta_home1.jpg" width="305"></div>
</div>
</center>