aesthetic
New Member
welcome to my character storage. feel free to track or comment or say what characters you like as I continue to add more, but please don't steal any of these beauties. they are all completely originally my work, and i'd hate to have my bootiful peoples elsewhere without me. if you want to take inspiration from my characters, that's completely fine! just please let me know first.
Character Table of Contents:
WIP
Code:
[nobr][div=height: 370px;
width: 349px;
padding: 10px;
position: relative;
top: 10px;
background: white;
border: 1px solid #f1f1f1;
box-shadow: 1px 1px 2px grey;
margin: auto][div=height: 130px;
width: 325px;
background-image: url(https://66.media.tumblr.com/70b9f9fcdc28a7699676aad1249041c1/tumblr_nzh3uzdiQi1sgla6so3_500.gif);
background-size: 100%;
background-position: 50% 25%;
opacity: 0.9;
position: relative;
left: 12px;
top: 10px;
text-align: right;
font-size: 20px;
color: #fff;
letter-spacing: 0.5px]
[div=height: 10px;
width: 315px;
padding: 5px;
font-size: 15px;
position: relative;
text-align: right;
top: 90px;
left: -5px][font=Quicksand]
kai com trikru
[div=height: 10px;
width: 315px;
padding: 5px;
font-size: 9px;
position: relative;
text-align: right;
top: -10px;
left: -6px]secretive; mysterious; serious; reserved; aggressive[/div][/font]
[div=height: 10px;
width: 315px;
padding: 5px;
font-size: 9px;
position: relative;
text-align: right;
top: -10px;
left: -6px][/div][/div][/div]
[div=height: 210px;
width: 322px;
border-top: 1px solid #BEBCBA;
border-bottom: 1px solid #BEBCBA;
padding-left: 1px;
padding-right: 1px;
padding-top: 1px;
padding-bottom: 5px;
opacity: 0.9;
position: relative;
left: 13px;
top: 15px;
overflow: hidden][div=width: 100%; padding-right: 20px; height: 109%; overflow-y: auto; text-align: justify;]
[div=height: 1px;
width: 135px;
position: relative;
top: 0px;
left: -10px]
[div=height: 100px;
width: 95px;
background-image: url(https://images2.imgbox.com/f3/cf/fmJzBoen_o.gif);
background-size: 180%;
background-position: 40% 50%;
position: relative;
top: 5px;]
[div=height: 98px;
width: 95px;
background-image: url(https://i.gifer.com/8Fdo.gif);
background-size: 200%;
background-position: 30% 80%;
position: relative;
left: 0px;
top: 105px][/div][/div][/div]
[div=height: 0px;
padding-top: 10px;
padding-bottom: 10px;
background-color: #BEBCBA;
width: 230px;
position: relative;
top: 11px;
left: 93px][div=height: 5px;
width: 210px;
position: relative;
top: -13px;
left: 5px;
font-size: 15px;
font-weight: 700;
color: #191919;
text-shadow: 2px 0px 0px #BEBCBA][font=lato]"violence is the final answer"[/font][/div][/div]
[div=height: 155px;
width: 208px;
padding: 10px;
border: 1px solid #BEBCBA;
position: relative;
top: 10px;
left: 93px;
overflow: auto;
font-size: 11px;
color: black;]some
[br][/br]
stats
[br][/br]
can
[br][/br]
go
[br][/br]
here
[br][/br]
it
[br][/br]
has
[br][/br]
overflow
[/div][br][/br][br][/br]
[div=height: 1px;
width: 105%;
background-color: #BEBCBA;
position: relative;
top: -10px][/div][br][/br]
[div=height: 0px;
padding-top: 10px;
padding-bottom: 10px;
background-color: #BEBCBA;
width: 322px;
position: relative;
top: -5px;
left: 0px][div=height: 5px;
width: 307px;
position: relative;
top: -35px;
left: 10px;
text-align: right;
font-size: 25px;
font-weight: 700;
color: #191919;
text-shadow: 2px 0px 0px #BEBCBA][font=Satisfy]persona and relations[/font][/div][/div]
[div=height: 145px;
width: 300px;
padding: 10px;
border: 1px solid #BEBCBA;
position: relative;
top: -5px;
left: 0px;
overflow: auto;
font-size: 11px;
color: black]some
[br][/br]
stats
[br][/br]
can
[br][/br]
go
[br][/br]
here
[br][/br]
it
[br][/br]
has
[br][/br]
overflow
[/div][br][/br][br][/br]
[div=height: 1px;
width: 105%;
background-color: #BEBCBA;
position: relative;
top: -20px][/div][br][/br]
[div=height: 0px;
padding-top: 10px;
padding-bottom: 10px;
background-color: #BEBCBA;
width: 322px;
position: relative;
top: -25px;
left: 0px][div=height: 5px;
width: 207px;
position: relative;
top: -30px;
left: 10px;
font-size: 25px;
font-weight: 700;
color: #191919;
text-shadow: 2px 0px 0px #BEBCBA][font=Satisfy]history and trivia[/font][/div][/div]
[div=height: 145px;
width: 300px;
padding: 10px;
border: 1px solid #BEBCBA;
position: relative;
top: -25px;
left: 0px;
overflow: auto;
font-size: 11px;
color: black]some
[br][/br]
stats
[br][/br]
can
[br][/br]
go
[br][/br]
here
[br][/br]
it
[br][/br]
has
[br][/br]
overflow
[/div][/div][/div][/div]
[div=opacity: 0; width: 100%; margin: auto][size=8px]@undine[/size][/div][/nobr]
Code:
[div class=container][div class=bigimage][div class=img1][/div][div class=img2 style=display:none;][/div][div class=img3 style=display:none;][/div][div class=img4 style=display:none;][/div][/div][div class=header][div class=hname][font=Raleway]ash hunter[/font][/div] [div=display:inline-block;font-variant:small-caps;color: var(--bg-color);font-size:15px;margin-right:5px;margin-top:10px;float:right;][font=Lato][/font][/div]
[div class=tag]twentytwo[/div][div class=tag]male[/div][div class=tag]asshole[/div][div class=tag]aussie[/div][/div]
[div class=tabcon][div class=tab1 style=display:none][div class=appearance][div class=scroll][font=Lato][div class=bigtext]faceclaim[/div]
ash stymest
[div class=bigtext]appearance[/div]
TEXT
[div class=bigtext]height[/div] 6'2"
[div class=bigtext]weight[/div] 162 lbs
[div class=bigtext]eye colour[/div] silver-blue
[div class=bigtext]hair colour[/div] black
[div class=bigtext]style[/div] TEXT
[/font][/div][/div][div=width:243px;height:60px;margin-top:10px;background: var(--img-5);background-size:100%;background-position:50% 15%;][/div]
[/div][div class=tab2][div class=scroll][font=Lato][div class=bigtext2]personality[/div]
TEXT
[div class=bigtext2]likes[/div]
graffiti
rap music
weed
[div class=bigtext2]dislikes[/div]
TEXT
TEXT
TEXT
[div class=bigtext2]quirks[/div]
TEXT
TEXT
TEXT
[/font][/div][/div][div class=tab3 style=display:none][div class=scroll][font=Lato][div class=bigtext]history[/div]
TEXT
[div class=bigtext]reason for choice[/div]
TEXT
[div class=bigtext]residence[/div]
TEXT
[div class=bigtext]extra[/div]
oof
[/font][/div][/div][div class=tab4 style=display:none][div class=combat][div class=scroll][font=Lato][div class=bigtext2]weapon[/div]
n/a
[div class=bigtext2]powers[/div]
n/a
[/font][/div][/div][div=width:243px;height:60px;margin-top:10px;background: var(--img-6);background-size:100%;background-position:50% 35%;][/div]
[/div]
[/div][div class=buttoncon][div class=button1]appearance[/div][div class=button2]personality[/div][div class=button3]history[/div][div class=button4]combat[/div]
[/div][div=height:77px;width:136px;background:url('https://66.media.tumblr.com/c7f9d4db3d0378212d4e6f3fa9f2b576/tumblr_n0y95h0lgw1skgqd1o1_400.gif');background-size:100%;background-position:60% 60%;margin-top:8px;margin-left:1px;][/div]
[div=height:20px;width:100px;position:relative;z-index:6;opacity:0.6;color: var(--color-2);margin:auto;top:-30px;][font=Open Sans]⠀♡coded by uxie♡[/font][/div][/div]
[nobr]
[class=container]
--img-1: url('https://66.media.tumblr.com/c6b5772fba3b6d6ebdadeb787b416e52/tumblr_mtmziy7OmB1qcdcmro1_250.gif');
--img-2: url('https://66.media.tumblr.com/0d00286daab6215d14e9213aa5581544/tumblr_inline_o6j4r5k4Md1rwb8ah_500.gif');
--img-3: url('https://66.media.tumblr.com/40bbd7d5eb9a563bdcdb989ebd6f14b9/tumblr_mhrv1o0IvZ1rcb67po3_250.gif');
--img-4: url('http://68.media.tumblr.com/7c395c2340b87edbda981fc0a5bab3d2/tumblr_mhrv1o0IvZ1rcb67po1_250.gif');
--img-5: url('https://media1.tenor.com/images/0f7dbcbed643291d0e58452e190338da/tenor.gif?itemid=12479666');
--img-6: url('https://66.media.tumblr.com/58418eea064c3bc339586cb1d16ddd8a/tumblr_inline_mx4a86q3yE1rmuftu.gif');
--bg-color:#F6D3D7;
--color-1:#C5B9A1;
--color-2: #E4AEC6;
--color-3:#A7AED8;
--color-4: #67B6B4;
--color-5: #FCEAAE;
--bcolor-1: #C6A5CA;
--bcolor-2:#F5CF94;
--bcolor-3: #889ACC;
--bcolor-4: #C4DBA0;
--btcolor-1:#BF9886;
--tcolor-1: #757161;
--tcolor-2: #485356;
height:360px;
width:390px;
margin:auto;
padding:10px;
background-color: var(--bg-color);
position:relative;
[/class]
[class=bigimage]
height:125px;
width:125px;
border:1px solid var(--color-1);
float:left;
position:relative;
padding:5px;
[/class]
[class=img1]
height:125px;
width:125px;
background: var(--img-1);
background-size:100%;
position:absolute;
[/class]
[class=img2]
height:125px;
width:125px;
background: var(--img-2);
background-size:100%;
position:absolute;
[/class]
[class=img3]
height:125px;
width:125px;
background: var(--img-3);
background-size:100%;
position:absolute;
[/class]
[class=img4]
height:125px;
width:125px;
background: var(--img-4);
background-size:100%;
position:absolute;
[/class]
[class=header]
height:70px;
width:243px;
background-color: var(--color-2);
float:left;
margin-left:10px;
[/class]
[class=hname]
color: white;
margin-left:10px;
position:relative;
top:-2px;
text-shadow:1.5px 1.5px var(--bg-color);
font-variant: small-caps;
font-size:28px;
font-weight:bold;
letter-spacing:1.5px;
display:inline-block;
[/class]
[class=tag]
height:17px;
min-width:10px;
font-size:10px;
background-color: var(--color-3);
color: var(--bg-color);
display:inline-block;
padding-right:3px;
padding-left:3px;
padding-top:2px;
text-transform:uppercase;
letter-spacing:0.5px;
margin-left:6px;
position:relative;
top:-5px;
[/class]
[class=buttoncon]
height:110px;
width:125px;
padding:5px;
border:1px solid var(--color-1);
margin-top:123px;
[/class]
[class=button1]
height:25px;
width:125px;
background-color: var(--bcolor-1);
color: var(--bg-color);
font-size:15px;
font-variant:small-caps;
text-align:center;
letter-spacing:1.5px;
font-weight:400;
margin-bottom:2.5px;
transition:0.3s;
[/class]
[class name=button1 state=hover]
background-color: var(--color-2);
color: var(--bcolor-1);
cursor:pointer;
transition:0.3s;
[/class]
[script class=button1 on=click]
hide img2
hide img3
hide img4
hide tab2
hide tab3
hide tab4
show img1
show tab1
[/script]
[class=button2]
height:25px;
width:125px;
background-color: var(--bcolor-2);
color: var(--btcolor-1);
font-size:15px;
font-variant:small-caps;
text-align:center;
letter-spacing:1.5px;
font-weight:400;
margin-bottom:2.5px;
transition:0.3s;
[/class]
[class name=button2 state=hover]
background-color: var(--color-2);
color: var(--bcolor-2);
cursor:pointer;
transition:0.3s;
[/class]
[script class=button2 on=click]
hide img1
hide img3
hide img4
hide tab1
hide tab3
hide tab4
show img2
show tab2
[/script]
[class=button3]
height:25px;
width:125px;
background-color: var(--bcolor-3);
color: var(--bg-color);
font-size:15px;
font-variant:small-caps;
text-align:center;
letter-spacing:1.5px;
font-weight:400;
margin-bottom:2.5px;
transition:0.3s;
[/class]
[class name=button3 state=hover]
background-color: var(--color-2);
color: var(--bcolor-3);
cursor:pointer;
transition:0.3s;
[/class]
[script class=button3 on=click]
hide img2
hide img1
hide img4
hide tab2
hide tab1
hide tab4
show img3
show tab3
[/script]
[class=button4]
height:25px;
width:125px;
background-color: var(--bcolor-4);
color: var(--btcolor-1);
font-size:15px;
font-variant:small-caps;
text-align:center;
letter-spacing:1.5px;
font-weight:400;
margin-bottom:2.5px;
transition:0.3s;
[/class]
[class name=button4 state=hover]
background-color: var(--color-2);
color: var(--bcolor-4);
cursor:pointer;
transition:0.3s;
[/class]
[script class=button4 on=click]
hide img2
hide img3
hide img1
hide tab2
hide tab3
hide tab1
show img4
show tab4
[/script]
[class=tabcon]
height:270px;
width:245px;
position:relative;
left:3px;
float:right;
margin-top: 10px;
[/class]
[class=scroll]
height: 100%;
width: calc(100% + 14px);
overflow-y:scroll;
padding-right:5px;
[/class]
[class=bigtext]
font-size:10px;
font-weight:bold;
display:inline-block;
background-color: var(--color-3);
padding-left:3px;
padding-right:3px;
color: var(--color-5);
text-transform:uppercase;
letter-spacing:0.8px;
margin-bottom:3px;
margin-top:3px;
text-align:center;
[/class]
[class=bigtext2]
font-size:10px;
font-weight:bold;
display:inline-block;
background-color: var(--bcolor-2);
padding-left:3px;
padding-right:3px;
color: var(--bcolor-3);
text-transform:uppercase;
letter-spacing:0.8px;
margin-bottom:3px;
margin-top:3px;
text-align:center;
[/class]
[class=tab1]
height:270px;
width:240px;
position:absolute;
font-size:10px;
[/class]
[class=appearance]
height:190px;
width:233px;
padding:5px;
overflow:hidden;
background-color: var(--bcolor-2);
font-size: 10px;
color: var(--tcolor-1);
text-align:justify;
[/class]
[class=tab2]
height:260px;
width:230px;
position:absolute;
font-size:10px;
background-color: var(--bcolor-3);
overflow:hidden;
padding:5px;
color: var(--tcolor-2);
text-align:justify;
[/class]
[class=tab3]
height:260px;
width:230px;
position:absolute;
font-size:10px;
background-color: var(--bcolor-4);
overflow:hidden;
padding:5px;
color: var(--tcolor-2);
text-align:justify;
[/class]
[class=combat]
height:190px;
width:233px;
padding:5px;
overflow:hidden;
background-color: var(--bcolor-1);
font-size: 10px;
color: var(--tcolor-2);
text-align:justify;
[/class][/nobr]Character Table of Contents:
WIP
Last edited:
