• This section is for roleplays only.
    ALL interest checks/recruiting threads must go in the Recruit Here section.

    Please remember to credit artists when using works not your own.

Fantasy [kGs] BoD_OOC

Reader mode
Main
Here
Characters
Here
Lore
Here
ElenaIsCool said:
*Me whos making a single bi cook*

Ahems

Also since my drawing for some reason doesn’t work with the code unless it’s a url, imma just use a Picrew or sth idk
Click to expand...
upload it to Imgur and use “copy image url” on it and then paste , boom u gold
 
Remembrance said:
upload it to Imgur and use “copy image url” on it and then paste , boom u gold
Click to expand...
mine didn't work when i did that till I added the .jpg at the end of the link as it was originally.

So, that was also a thingie.
 
now.. what pompous and over achieving class name can I give a farming headman...?
 
"Oh great Patriarch of the Field, sower of dynasties, how have you achieved such an advanced age?"

"Not going to war yea damned sprout thats for sure.

You see the type of crap those cultivators put in their bodies? nonesense, straight nonesense, eat yer greens or so help me I'll cultivate you up an ass kicking."
 
prepare to reach into the furthest depths of the land of death, because one of the old coots decided to die on you and you need to grab him back to finish his damn job.
 
Orikanyo Orikanyo Heya, I just color coded the BBCode to hopefully make it a bit easier to use, same goes for anyone else who may find this useful!

The Red text is the stuff you should replace with your own information.
The Brown text is highlighted just to aid you, no need to change it.
The Blue text is stuff you should delete after you are done.

When you are fully done, press Control+A, click the little Color Pallete icon at the top of the text box, and click on the eraser.

Code: 
[comment]
Designed and coded by [USER=20950]@Nano[/USER].
Please do not remove the credits or claim the code as your own work.
 
[font=Nanum Brush Script].[/font]
[font=Marcellus].[/font]
[font=Macondo].[/font]
[font=Reem Kufi].[/font]
[font=Reenie Beanie].[/font]
[font=Ma Shan Zheng].[/font]
[/comment][comment]
 
// accents
 
[/comment][border=0; padding: 0;
     --bgpattern: url('https://i.imgur.com/HwYJoQ6.jpg') center no-repeat;
     --bg2color: url('https://i.imgur.com/swJp0ZL.jpg') center/cover repeat;
     --maincolor: black;
     --grey: #cccccc;
     --textcolor: #333333;
 
     --img01: url('https://i.imgur.com/xnhjlaB.jpg') center/cover no-repeat; /* Main Profile FC  */
     --img02: url('https://i.imgur.com/ACTBmww.jpg?1') center/cover no-repeat; /* Minimized FC */
     --img03: url('https://i.imgur.com/1gJBEnp.jpg?1') center/cover no-repeat;
 
     background: var(--bgpattern);
     padding: 75px 0;
     width: 100%;
     font-size: initial;
     box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.45);
][border=0; display: flex; flex-flow: row wrap; justify-content: center; margin: 0 auto; padding: 0; width: 100%; max-width: 1000px; min-width: 250px; box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.45);][comment]
 
// start of left side //
 
[/comment][border=0; padding: 0; flex: 2; width: 100%; max-width: 500px; min-width: 250px; height: 70vh; max-height: 600px; min-height: 400px; background: var(--img01); filter: grayscale(30%); position: relative; overflow: hidden; pointer-events: none; z-index: 1;][comment]
 
// start of nameplate //
 
[/comment][border=0; bottom: 35px; left: 35px; padding: 0; width: calc(100% - 35px); position: absolute; pointer-events: auto;][border=0; padding: 0; font-family: 'Nanum Brush Script'; font-size: 1.3em; line-height: 80%; color: white; text-shadow: 2px 2px var(--textcolor); text-transform: uppercase;]Class Name[/border][border=0; padding: 0; font-family: 'Nanum Brush Script'; font-size: 4.0em; font-weight: 500; line-height: 80%; color: white; text-shadow: 3px 3px var(--textcolor); text-transform: uppercase;]Name[/border][/border][comment]
 
// end of nameplate //
 
[/comment][/border][comment]
 
// end of left side --- start of right side //
 
[/comment][border=0; padding: 0; flex: 3; width: 100%; max-width: 600px; min-width: 250px; height: 70vh; max-height: 600px; min-height: 400px; background: var(--bg2color); position: relative;][comment]
 
// start of tab covers //
 
[/comment][border=0; left: -13px; top: 47px; padding: 0; position: absolute; pointer-events: none; z-index: 2;][border=2px solid var(--grey); display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg);][border=0; padding: 0; height: 13px; width: 13px; background: var(--grey);][/border][/border][border=2px solid var(--grey); display: flex; justify-content: center; align-items: center; margin-top: 18px; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg);][border=0; padding: 0; height: 13px; width: 13px; background: var(--grey);][/border][/border][border=2px solid var(--grey); display: flex; justify-content: center; align-items: center; margin-top: 18px; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg);][border=0; padding: 0; height: 13px; width: 13px; background: var(--grey);][/border][/border][border=2px solid var(--grey); display: flex; justify-content: center; align-items: center; margin-top: 18px; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg);][border=0; padding: 0; height: 13px; width: 13px; background: var(--grey);][/border][/border][/border][comment]
 
...
 
[/comment][border=0; padding: 0; width: 100%; height: 70vh; max-height: 600px; min-height: 400px; background: var(--bg2color); position: absolute; z-index: 1; pointer-events: none;][/border][comment]
 
// end of tab covers ------- start of tabs //
 
[/comment][border=0; margin-top: 40px; margin-left: -40px; padding: 0; width: 100%; height: 300px; line-height: 38px; overflow: hidden;][tabs]
 
 
 
 
 
[tab=xxxBASIC INFORMATIONxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx][border=2px solid var(--grey); top: 47px; left: -13px; display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg); position: absolute; z-index: 2;][border=0; padding: 0; height: 13px; width: 13px; background: var(--maincolor);][/border][/border][border=0; left: 30px; top: 30px; padding: 0; width: calc(100% - 30px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; position: absolute; z-index: 2; overflow: hidden; line-height: initial;][border=0; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; overflow-y: scroll;][comment]
 
// start of profile icon + stat bars //
 
[/comment][border=0; display: flex; flex-flow: row-reverse wrap; margin-left: -15px; padding: 0; width: calc(100% + 15px);][comment]
 
// start of profile icon //
 
[/comment][border=0px; margin-left: 15px; padding: 0; flex: 2; width: 100%; min-width: 180px;][border=1px solid var(--grey); box-sizing: border-box; margin-bottom: 15px; padding: 10px; width: 100%;][border=0; padding: 0; width: 100%; padding-top: 100%; background: var(--img02);][/border][/border][/border][comment]
 
// end of profile icon ------ start of stat bars //
 
[/comment][border=0; display: flex; flex-flow: column nowrap; justify-content: space-between; margin-left: 15px; margin-bottom: 15px; padding: 0; flex: 5; width: 100%; min-width: 200px;][comment]
 
--- stat one ---
 
[/comment][border=0; margin-top: 5px; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: 0.8em; line-height: 100%; color: peru; text-align: left; text-transform: uppercase;][color=brown]Authority[/color][/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: peru;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
--- stat two ---
 
[/comment][border=0; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: .8em; line-height: 100%; color: slateblue; text-align: left; text-transform: uppercase;][color=brown]Expertise[/color][/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: slateblue;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
--- stat three ---
 
[/comment][border=0; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: .8em; line-height: 100%; color: #3B6499; text-align: left; text-transform: uppercase;][color=brown]Cunning[/color][/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: #3B6499;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
--- stat four ---
 
[/comment][border=0; margin-bottom: 5px; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: .8em; line-height: 100%; color: darkolivegreen; text-align: left; text-transform: uppercase;][color=brown]Resolve[/color][/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: darkolivegreen;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
--- stat five ---
 
[/comment][border=0; margin-bottom: 5px; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: .8em; line-height: 100%; color: firebrick; text-align: left; text-transform: uppercase;][color=brown]Instinct[/color][/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: firebrick;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
 
[/comment][/border][comment]
 
// end of stats //
 
[/comment][/border][comment]
 
// end of profile icon + stat bars ------ start of quote box //
 
[/comment][border=0; margin: 35px 0 25px; padding: 0; width: 100%; position: relative;][border=0; top: -22px; left: -5px; padding: 0; font-family: 'Nanum Brush Script', serif; font-size: 185px; line-height: 70%; color: var(--grey); position: absolute;]“[/border][border=0; bottom: -80px; right: -5px; padding: 0; font-family: 'Reenie Beanie', serif; font-size: 185px; line-height: 70%; color: var(--grey); position: absolute;]”[/border][comment]
 
// quote //
 
[/comment][border=0; margin: 0 auto; padding: 0; width: calc(100% - 20px); font-family: 'Reenie Beanie', cursive; font-size: 1.5em; line-height: 100%; color: var(--textcolor); text-align: center; position: relative;][color=red]Character's quote.[/color][/border][comment]
 
// end of quote //
 
[/comment][/border][comment]
 
// end of quote box ------ start of basic information //
 
[/comment][comment]
 
--- row 1 ---
 
[/comment][border=0; display: flex; flex-flow: row wrap; margin-left: -20px; padding: 0;][comment]
 
------ stat 01 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi'; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Full Name[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);][color=red]Family Name, Given Name.[/color][/border][/border][comment]
 
------ stat 02 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Courtesy Name[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);][color=blue]Courtesy Name:[/color] [color=red]A self-chosen style name, to be addressed by peers and equals.[/color][/border][/border][/border][comment]
 
--- row 2 ---
 
[/comment][border=0; display: flex; flex-flow: row wrap; margin-left: -20px; padding: 0;][comment]
 
------ stat 03 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Class[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);][color=blue]Class and Alignment (Fire, Wood...etc):[/color] [color=red]A designation that describes your character's occupational capacity and their Wu Xing alignment.[/color][/border][/border][comment]
 
------ stat 04 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Title/Moniker[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);][color=red]An alias or title conferred upon them.[/color][/border][/border][/border][comment]
 
--- row 3 ---
 
[/comment][border=0; display: flex; flex-flow: row wrap; margin-left: -20px; padding: 0;][comment]
 
------ stat 05 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Gender[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);][color=blue]Gender:[/color][color=red]Self-explanatory.[/color][/border][/border][comment]
 
------ stat 06 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Height[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);][color=blue]Height:[/color] [color=red]In both imperial and metrics for ease of reference.[/color][/border][/border][/border][comment]
 
--- row 4 ---
 
[/comment][border=0; display: flex; flex-flow: row wrap; margin-left: -20px; padding: 0;][comment]
 
------ stat 07 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Culture Group[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);][color=blue]Culture Groups:[/color][color=red]Refer to Culture Groups section in Lore.[/color][/border][/border][comment]
 
------ stat 08 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Age[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);][color=red]How old are they? (Subject to change as the story progresses)[/color][/border][/border][/border][comment]
 
// end of basic information ------ start of appearance //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); margin-top: 60px; padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Appearance[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][color=blue]Appearance:[/color] [color=red]A brief description of how others perceive them physically, as well as any distinguishing features that are not included in your faceclaims.
(Optional if you deem your faceclaims to be sufficient.)[/color][/border][comment]
 
// end of appearance ------ start of personality //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); margin-top: 60px; padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Personality[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][color=blue]Personality:[/color][color=red]A brief description of their personality, interests, etc.[/color]
[/border][comment]
 
// end of personality //
 
[/comment][/border][/border][/tab]
 
 
 
 
 
[tab=xxxBACKSTORYxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx][border=2px solid var(--grey); top: 90px; left: -13px; display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg); position: absolute; z-index: 2;][border=0; padding: 0; height: 13px; width: 13px; background: var(--maincolor);][/border][/border][border=0; left: 30px; top: 30px; padding: 0; width: calc(100% - 30px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; position: absolute; z-index: 2; overflow: hidden; line-height: initial;][border=0; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; overflow-y: scroll;][comment]
 
// start of backstory //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Biography[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][color=blue]Backstory: [/color] [color=red]Describe their life and how they ended up in service of Dao Chaolong in Weilang. Feel free to write as much as you like, so long as you address their aspirations. Dependent on their skills, mindset and background described within this section, certain court positions may be more compatible than others when conferred upon in-character.[/color]
[/border][comment]
 
// end of backstory ------ start of filler image //
 
[/comment][border=1px solid var(--grey); margin-top: 25px; margin-bottom: 25px; padding: 10px; box-sizing: border-box;][border=0; padding: 0; width: 100%; height: 175px; background: var(--img03);][/border][/border][comment]
 
// end of filler image ------ start of relationships //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Relationships[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo', cursive; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;][color=red]Surname, Given[/color][/border][color=red]Relationship details.[/color]
 
[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo', cursive; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;][color=red]Surname, Given[/color][/border][color=red]Relationship details.[/color]

[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo', cursive; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;][color=red]Surname, Given[/color][/border][color=red]Relationship details.[/color]
 
[/border][comment]
 
// end of relationships //
 
[/comment][/border][/border][/tab]
 
 
 
 
 
[tab=xxxancillariesxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx][border=2px solid var(--grey); top: 133px; left: -13px; display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg); position: absolute; z-index: 2;][border=0; padding: 0; height: 13px; width: 13px; background: var(--maincolor);][/border][/border][border=0; left: 30px; top: 30px; padding: 0; width: calc(100% - 30px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; position: absolute; z-index: 2; overflow: hidden; line-height: initial;][border=0; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; overflow-y: scroll;][comment]
 
// start of ancillaries //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Traits & Ancillaries[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Administrative Talents[/border][color=red][b]Name of Administrative Talent[/b]

When governing or overseeing civil development, what area of expertise do they specialize in? Examples include but are not limited to: agricultural, industrial, commercial, governmental, and education reforms.
You may have 1 administrative talent for now. Disregard if non-applicable.[/color]
 
[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Battlefield Talents[/border][color=red][b]Name of Battlefield Talent[/b]

When leading an army or engaged in combat, in what capacity can they offer to aid their troops and allies? Examples include but are not limited to: logistical support, terrain advantage, morale control, situational doctrines, and unique formations.
You may have 1 battlefield talent for now. Disregard if non-applicable.[/color]

[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Baqi[/border][color=red][b]Name of Ability[/b]

This area is reserved for qi cultivators and magic practitioners. If they follow a martial school or sect, you have creative liberty with this section to elaborate on their peculiar practices and abilities. Disregard if non-applicable.[/color]


[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Personal Equipment[/border][color=blue]Equipment:[/color][color=red] This section pertains to their personal gears and anything else of note that they carry on them. They may possess 1 weapon, 1 armor, and 2 extra pieces of personal items on them.

[Weapon Name]
What do they wield into battle? Leave blank if non-applicable.

[Armor Name]
What do they usually wear that distinguish them from others? Refer to Armor Grade in the Lore.

[Ancillary 1]
First free slot. Disregard if non-applicable.

[Ancillary 2]
Second free slot. Disregard if non-applicable.[/color]

[/border][comment]
 
// end of ancillaries //
 
[/comment][/border][/border][/tab]
 
 
 
 
 
[tab=xxxRETINUESxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx][border=2px solid var(--grey); top: 176px; left: -13px; display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg); position: absolute; z-index: 2;][border=0; padding: 0; height: 13px; width: 13px; background: var(--maincolor);][/border][/border][border=0; left: 30px; top: 30px; padding: 0; width: calc(100% - 30px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; position: absolute; z-index: 2; overflow: hidden; line-height: initial;][border=0; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; overflow-y: scroll;][comment]
 
// start of retinues //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Retinue[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Reem Kufi'; font-weight: 700; font-size: 2em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]CUSTOM NAME[/border][row][column=span3][IMG]https://i.imgur.com/paa1qYb.jpg[/IMG][/column][column=span5]Retinue Name: [color=red]Self-explanatory.[/color]
Retinue Type: [color=red]Swordsmen, spearmen, archers, cavalry, siege engineers, etc.[/color]
Retinue Weapon: [color=red]What signature arm do they wield in battle?[/color]
Retinue Armor Grade: [color=red]Refer to Armor Grade in Lore.[/color]
Retinue Abilities:
[color=red] What special ability or formation can these troops perform? You may have two abilities.[/color]
[/column][/row]

[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Retinue History / Legend[/border][color=red]A brief description of their retinue's history or legend. You may include roles, order of battle and organization. Refer to Wu Xing section for the type of troops available to your class.
You may disregard the entirety of this page if it does not apply to your character.[/color]

[/border][comment]
 
// end of extras //
 
[/comment][/border][/border][/tab]
 
 
 
[/tabs][/border][comment]
 
// end of tabs //
 
[/comment][/border][comment]
 
// end of right side //
 
[/comment][/border][comment]
 
// visible credit -- please don't remove!!! //
 
[/comment][border=0px; margin: 8px auto 0; padding: 0; width: 100%; max-width: 1000px; height: 0; font-size: .6em; text-align: center; color: var(--textcolor); text-transform: uppercase; opacity: .5;]code by Nano[comment][USER=20950]@Nano[/USER][/comment][/border][/border]
[/comment]

Just as a note, this code itself isn't too finiky but do be careful with pressing Enter and Backspace, changing the spacing in between lines can get messy. Also, you'll just have to guess on the percentages for stats until you do that final step, no way to highlight and show it at the same time.
 
Last edited:
dragonsfire said:
Orikanyo Orikanyo Heya, I just color coded the BBCode to hopefully make it a bit easier to use, same goes for anyone else who may find this useful!

The Red text is the stuff you should replace with your own information.
The Brown text is highlighted just to aid you, no need to change it.
The Blue text is stuff you shouldn't change or alter.

When you are fully done, press Control+A, click the little Color Pallete icon at the top of the text box, and click on the eraser.

Code: 
[comment]
Designed and coded by [USER=20950]@Nano[/USER].
Please do not remove the credits or claim the code as your own work.
 
[font=Nanum Brush Script].[/font]
[font=Marcellus].[/font]
[font=Macondo].[/font]
[font=Reem Kufi].[/font]
[font=Reenie Beanie].[/font]
[font=Ma Shan Zheng].[/font]
[/comment][comment]
 
// accents
 
[/comment][border=0; padding: 0;
     --bgpattern: url('https://i.imgur.com/HwYJoQ6.jpg') center no-repeat;
     --bg2color: url('https://i.imgur.com/swJp0ZL.jpg') center/cover repeat;
     --maincolor: black;
     --grey: #cccccc;
     --textcolor: #333333;
 
     --img01: url('https://i.imgur.com/xnhjlaB.jpg') center/cover no-repeat; /* Main Profile FC  */
     --img02: url('https://i.imgur.com/ACTBmww.jpg?1') center/cover no-repeat; /* Minimized FC */
     --img03: url('https://i.imgur.com/1gJBEnp.jpg?1') center/cover no-repeat;
 
     background: var(--bgpattern);
     padding: 75px 0;
     width: 100%;
     font-size: initial;
     box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.45);
][border=0; display: flex; flex-flow: row wrap; justify-content: center; margin: 0 auto; padding: 0; width: 100%; max-width: 1000px; min-width: 250px; box-shadow: 0px 0px 10px 10px rgba(0,0,0,0.45);][comment]
 
// start of left side //
 
[/comment][border=0; padding: 0; flex: 2; width: 100%; max-width: 500px; min-width: 250px; height: 70vh; max-height: 600px; min-height: 400px; background: var(--img01); filter: grayscale(30%); position: relative; overflow: hidden; pointer-events: none; z-index: 1;][comment]
 
// start of nameplate //
 
[/comment][border=0; bottom: 35px; left: 35px; padding: 0; width: calc(100% - 35px); position: absolute; pointer-events: auto;][border=0; padding: 0; font-family: 'Nanum Brush Script'; font-size: 1.3em; line-height: 80%; color: white; text-shadow: 2px 2px var(--textcolor); text-transform: uppercase;]Class Name[/border][border=0; padding: 0; font-family: 'Nanum Brush Script'; font-size: 4.0em; font-weight: 500; line-height: 80%; color: white; text-shadow: 3px 3px var(--textcolor); text-transform: uppercase;]Name[/border][/border][comment]
 
// end of nameplate //
 
[/comment][/border][comment]
 
// end of left side --- start of right side //
 
[/comment][border=0; padding: 0; flex: 3; width: 100%; max-width: 600px; min-width: 250px; height: 70vh; max-height: 600px; min-height: 400px; background: var(--bg2color); position: relative;][comment]
 
// start of tab covers //
 
[/comment][border=0; left: -13px; top: 47px; padding: 0; position: absolute; pointer-events: none; z-index: 2;][border=2px solid var(--grey); display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg);][border=0; padding: 0; height: 13px; width: 13px; background: var(--grey);][/border][/border][border=2px solid var(--grey); display: flex; justify-content: center; align-items: center; margin-top: 18px; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg);][border=0; padding: 0; height: 13px; width: 13px; background: var(--grey);][/border][/border][border=2px solid var(--grey); display: flex; justify-content: center; align-items: center; margin-top: 18px; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg);][border=0; padding: 0; height: 13px; width: 13px; background: var(--grey);][/border][/border][border=2px solid var(--grey); display: flex; justify-content: center; align-items: center; margin-top: 18px; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg);][border=0; padding: 0; height: 13px; width: 13px; background: var(--grey);][/border][/border][/border][comment]
 
...
 
[/comment][border=0; padding: 0; width: 100%; height: 70vh; max-height: 600px; min-height: 400px; background: var(--bg2color); position: absolute; z-index: 1; pointer-events: none;][/border][comment]
 
// end of tab covers ------- start of tabs //
 
[/comment][border=0; margin-top: 40px; margin-left: -40px; padding: 0; width: 100%; height: 300px; line-height: 38px; overflow: hidden;][tabs]
 
 
 
 
 
[tab=xxxBASIC INFORMATIONxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx][border=2px solid var(--grey); top: 47px; left: -13px; display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg); position: absolute; z-index: 2;][border=0; padding: 0; height: 13px; width: 13px; background: var(--maincolor);][/border][/border][border=0; left: 30px; top: 30px; padding: 0; width: calc(100% - 30px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; position: absolute; z-index: 2; overflow: hidden; line-height: initial;][border=0; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; overflow-y: scroll;][comment]
 
// start of profile icon + stat bars //
 
[/comment][border=0; display: flex; flex-flow: row-reverse wrap; margin-left: -15px; padding: 0; width: calc(100% + 15px);][comment]
 
// start of profile icon //
 
[/comment][border=0px; margin-left: 15px; padding: 0; flex: 2; width: 100%; min-width: 180px;][border=1px solid var(--grey); box-sizing: border-box; margin-bottom: 15px; padding: 10px; width: 100%;][border=0; padding: 0; width: 100%; padding-top: 100%; background: var(--img02);][/border][/border][/border][comment]
 
// end of profile icon ------ start of stat bars //
 
[/comment][border=0; display: flex; flex-flow: column nowrap; justify-content: space-between; margin-left: 15px; margin-bottom: 15px; padding: 0; flex: 5; width: 100%; min-width: 200px;][comment]
 
--- stat one ---
 
[/comment][border=0; margin-top: 5px; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: 0.8em; line-height: 100%; color: peru; text-align: left; text-transform: uppercase;]Authority[/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: peru;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
--- stat two ---
 
[/comment][border=0; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: .8em; line-height: 100%; color: slateblue; text-align: left; text-transform: uppercase;]Expertise[/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: slateblue;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
--- stat three ---
 
[/comment][border=0; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: .8em; line-height: 100%; color: #3B6499; text-align: left; text-transform: uppercase;]Cunning[/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: #3B6499;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
--- stat four ---
 
[/comment][border=0; margin-bottom: 5px; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: .8em; line-height: 100%; color: darkolivegreen; text-align: left; text-transform: uppercase;]Resolve[/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: darkolivegreen;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
--- stat five ---
 
[/comment][border=0; margin-bottom: 5px; padding: 0; width: 100%;][border=0; margin-bottom: 1px; padding: 0; padding-left: 10px; font-family: 'Reem Kufi'; font-size: .8em; line-height: 100%; color: firebrick; text-align: left; text-transform: uppercase;]Instinct[/border][border=1px solid var(--grey); box-sizing: border-box; padding: 4px; width: 100%;][border=0; padding: 0; width: 100%; height: 7px; background: var(--grey);][border=0; padding: 0; width: [COLOR=rgb(184, 49, 47)]35[/COLOR]%; height: 7px; background: firebrick;][comment]----------------------This border/box adjusts the stat value. Just change the % value of the width----------------------[/comment][/border][/border][/border][/border][comment]
 
 
[/comment][/border][comment]
 
// end of stats //
 
[/comment][/border][comment]
 
// end of profile icon + stat bars ------ start of quote box //
 
[/comment][border=0; margin: 35px 0 25px; padding: 0; width: 100%; position: relative;][border=0; top: -22px; left: -5px; padding: 0; font-family: 'Nanum Brush Script', serif; font-size: 185px; line-height: 70%; color: var(--grey); position: absolute;]“[/border][border=0; bottom: -80px; right: -5px; padding: 0; font-family: 'Reenie Beanie', serif; font-size: 185px; line-height: 70%; color: var(--grey); position: absolute;]”[/border][comment]
 
// quote //
 
[/comment][border=0; margin: 0 auto; padding: 0; width: calc(100% - 20px); font-family: 'Reenie Beanie', cursive; font-size: 1.5em; line-height: 100%; color: var(--textcolor); text-align: center; position: relative;]Character's quote.[/border][comment]
 
// end of quote //
 
[/comment][/border][comment]
 
// end of quote box ------ start of basic information //
 
[/comment][comment]
 
--- row 1 ---
 
[/comment][border=0; display: flex; flex-flow: row wrap; margin-left: -20px; padding: 0;][comment]
 
------ stat 01 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi'; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Full Name[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);]Family Name, Given Name.[/border][/border][comment]
 
------ stat 02 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Courtesy Name[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);]Courtesy Name: A self-chosen style name, to be addressed by peers and equals.[/border][/border][/border][comment]
 
--- row 2 ---
 
[/comment][border=0; display: flex; flex-flow: row wrap; margin-left: -20px; padding: 0;][comment]
 
------ stat 03 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Class[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);]Class and Alignment (Fire, Wood...etc): A designation that describes your character's occupational capacity and their Wu Xing alignment.[/border][/border][comment]
 
------ stat 04 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Title/Moniker[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);]An alias or title conferred upon them.[/border][/border][/border][comment]
 
--- row 3 ---
 
[/comment][border=0; display: flex; flex-flow: row wrap; margin-left: -20px; padding: 0;][comment]
 
------ stat 05 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Gender[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);]Gender:Self-explanatory.[/border][/border][comment]
 
------ stat 06 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Height[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);]Height: In both imperial and metrics for ease of reference.[/border][/border][/border][comment]
 
--- row 4 ---
 
[/comment][border=0; display: flex; flex-flow: row wrap; margin-left: -20px; padding: 0;][comment]
 
------ stat 07 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Culture Group[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);]Culture Groups: Refer to Culture Groups section in Lore.[/border][/border][comment]
 
------ stat 08 ------
 
[/comment][border=0; border-bottom: 1px solid var(--maincolor); margin-top: 30px; margin-left: 20px; padding: 0; flex: 1; min-width: 200px;][border=0; box-sizing: border-box; padding: 0; padding-left: 5px; font-family: 'Reem Kufi', cursive; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Age[/border][border=0; box-sizing: border-box; margin: 9px 0 15px; padding: 0; padding-left: 20px; font-family: 'Macondo', sans-serif; font-size: 0.9em; font-weight: 70; line-height: 100%; color: var(--textcolor);]How old are they? (Subject to change as the story progresses)[/border][/border][/border][comment]
 
// end of basic information ------ start of appearance //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); margin-top: 60px; padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Appearance[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;]Appearance: A brief description of how others perceive them physically, as well as any distinguishing features that are not included in your faceclaims.
(Optional if you deem your faceclaims to be sufficient.)[/border][comment]
 
// end of appearance ------ start of personality //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); margin-top: 60px; padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Personality[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;]Personality: A brief description of their personality, interests, etc.
[/border][comment]
 
// end of personality //
 
[/comment][/border][/border][/tab]
 
 
 
 
 
[tab=xxxBACKSTORYxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx][border=2px solid var(--grey); top: 90px; left: -13px; display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg); position: absolute; z-index: 2;][border=0; padding: 0; height: 13px; width: 13px; background: var(--maincolor);][/border][/border][border=0; left: 30px; top: 30px; padding: 0; width: calc(100% - 30px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; position: absolute; z-index: 2; overflow: hidden; line-height: initial;][border=0; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; overflow-y: scroll;][comment]
 
// start of backstory //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Biography[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;]Backstory: Describe their life and how they ended up in service of Dao Chaolong in Weilang. Feel free to write as much as you like, so long as you address their aspirations. Dependent on their skills, mindset and background described within this section, certain court positions may be more compatible than others when conferred upon in-character.
[/border][comment]
 
// end of backstory ------ start of filler image //
 
[/comment][border=1px solid var(--grey); margin-top: 25px; margin-bottom: 25px; padding: 10px; box-sizing: border-box;][border=0; padding: 0; width: 100%; height: 175px; background: var(--img03);][/border][/border][comment]
 
// end of filler image ------ start of relationships //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Relationships[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo', cursive; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Surname, Given[/border]Relationship details.
 
[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo', cursive; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Surname, Given[/border]Relationship details.

[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo', cursive; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Surname, Given[/border]Relationship details.
 
[/border][comment]
 
// end of relationships //
 
[/comment][/border][/border][/tab]
 
 
 
 
 
[tab=xxxancillariesxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx][border=2px solid var(--grey); top: 133px; left: -13px; display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg); position: absolute; z-index: 2;][border=0; padding: 0; height: 13px; width: 13px; background: var(--maincolor);][/border][/border][border=0; left: 30px; top: 30px; padding: 0; width: calc(100% - 30px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; position: absolute; z-index: 2; overflow: hidden; line-height: initial;][border=0; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; overflow-y: scroll;][comment]
 
// start of ancillaries //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Traits & Ancillaries[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Administrative Talents[/border]Name of Administrative Talent

When governing or overseeing civil development, what area of expertise do they specialize in? Examples include but are not limited to: agricultural, industrial, commercial, governmental, and education reforms.
You may have 1 administrative talent for now. Disregard if non-applicable.
 
[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Battlefield Talents[/border]Name of Battlefield Talent

When leading an army or engaged in combat, in what capacity can they offer to aid their troops and allies? Examples include but are not limited to: logistical support, terrain advantage, morale control, situational doctrines, and unique formations.
You may have 1 battlefield talent for now. Disregard if non-applicable.

[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Baqi[/border]Name of Ability This area is reserved for qi cultivators and magic practitioners. If they follow a martial school or sect, you have creative liberty with this section to elaborate on their peculiar practices and abilities. Disregard if non-applicable.


[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 1em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Personal Equipment[/border]Equipment: This section pertains to their personal gears and anything else of note that they carry on them. They may possess 1 weapon, 1 armor, and 2 extra pieces of personal items on them.

[Weapon Name]
What do they wield into battle? Leave blank if non-applicable.

[Armor Name]
What do they usually wear that distinguish them from others? Refer to Armor Grade in the Lore.

[Ancillary 1]
First free slot. Disregard if non-applicable.

[Ancillary 2]
Second free slot. Disregard if non-applicable.

[/border][comment]
 
// end of ancillaries //
 
[/comment][/border][/border][/tab]
 
 
 
 
 
[tab=xxxRETINUESxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx][border=2px solid var(--grey); top: 176px; left: -13px; display: flex; justify-content: center; align-items: center; padding: 0; height: 21px; width: 21px; background: var(--bg2color); transform: rotate(45deg); position: absolute; z-index: 2;][border=0; padding: 0; height: 13px; width: 13px; background: var(--maincolor);][/border][/border][border=0; left: 30px; top: 30px; padding: 0; width: calc(100% - 30px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; position: absolute; z-index: 2; overflow: hidden; line-height: initial;][border=0; padding: 0; padding-right: 50px; width: calc(100% - 15px); height: calc(70vh - 60px); max-height: 540px; min-height: 340px; overflow-y: scroll;][comment]
 
// start of retinues //
 
[/comment][border=0; border-bottom: 1px solid var(--grey); padding: 0 0 3px 0;][border=0; display: inline; border-bottom: 3px solid var(--maincolor); box-sizing: border-box; padding: 0 5px; font-family: 'Marcellus'; font-size: 1.5em; line-height: 100%; color: var(--maincolor); text-transform: uppercase;]Retinue[/border][/border][border=0; margin-top: 25px; padding: 0; font-family: 'Macondo', sans-serif; font-size: 0.95em; line-height: 140%; color: var(--textcolor); text-align: justify;][border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Reem Kufi'; font-weight: 700; font-size: 2em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]CUSTOM NAME[/border][row][column=span3][IMG]https://i.imgur.com/paa1qYb.jpg[/IMG][/column][column=span5]Retinue Name: Self-explanatory.
Retinue Type: Swordsmen, spearmen, archers, cavalry, siege engineers, etc.
Retinue Weapon: What signature arm do they wield in battle?
Retinue Armor Grade: Refer to Armor Grade in Lore.
Retinue Abilities:
What special ability or formation can these troops perform? You may have two abilities.
[/column][/row]

[border=0; margin-left: 10px; margin-bottom: 10px; padding: 0; font-family: 'Macondo'; font-weight: 700; font-size: 0.9em; line-height: 100%; color: var(--maincolor); text-align: left; text-transform: uppercase;]Retinue History / Legend[/border]A brief description of their retinue's history or legend. You may include roles, order of battle and organization. Refer to Wu Xing section for the type of troops available to your class.
You may disregard the entirety of this page if it does not apply to your character.

[/border][comment]
 
// end of extras //
 
[/comment][/border][/border][/tab]
 
 
 
[/tabs][/border][comment]
 
// end of tabs //
 
[/comment][/border][comment]
 
// end of right side //
 
[/comment][/border][comment]
 
// visible credit -- please don't remove!!! //
 
[/comment][border=0px; margin: 8px auto 0; padding: 0; width: 100%; max-width: 1000px; height: 0; font-size: .6em; text-align: center; color: var(--textcolor); text-transform: uppercase; opacity: .5;]code by Nano[comment][USER=20950]@Nano[/USER][/comment][/border][/border]
[/comment]

Just as a note, this code itself isn't too finiky but do be careful with pressing Enter and Backspace, changing the spacing in between lines can get messy. Also, you'll just have to guess on the percentages for stats until you do that final step, no way to highlight and show it at the same time.
Click to expand...
i believe the percentages for stats are the last width modifier normally set at like 30-35%
 
thank you, though those percentage bars seem abit off in the preview o.o
 
Orikanyo Orikanyo Yeah, because of how they are set up in a Border you won't be able to see them properly unless you clear their color (with the color eraser)

If you can find the percentages without the red highlight, feel free to make them colorless (Delete the [COLOR=rgb(184, 49, 47).] and [/COLOR.] parts), that was just to make it easy to locate amongst all the code.
 
Last edited:
I suddenly have the funny idea of someone sending a Renowned Beauty to the Dao court to try and disrupt us with jealousy* but the two bigwigs are gay for each other so it's Not Very Effective.

*allegedly, the actual thing Diao Chan was doing to cause Lu Bu to betray Dong Zhuo.
 
"i wonder... Will they send a man next..? Or simply more women?

I hope for the latter, it'll be funnier."
 
Rejoice, our strategist shall not be the only water alligned.
 
Reader mode
You must log in or register to reply here.

Users who are viewing this thread

Total: 7 (members: 0, guests: 7)

Similar threads

forestferns
Realistic or Modern Come My Love, Be One With The Sea (the temporary OOC)
2 3 4 5 action adventure high seas
Replies
102
Views
1K
krasous
krasous
forestferns
Realistic or Modern Come My Love, Be One With The Sea (crew applications)
action adventure applications
Replies
14
Views
944
Fabrikator.Nova
Fabrikator.Nova
BlueXBlood
Fantasy Musings of a Lost World || Characters
Replies
0
Views
23
BlueXBlood
BlueXBlood
MaskyOrGhosty
Fantasy Veiled World (Characters)
Replies
2
Views
45
CHUUYAS_HAT
CHUUYAS_HAT
Lumpkinz11
One x One Hogwarts 1x1 RP w/ _anubis_ [Characters]
Replies
4
Views
93
_anubis_
_anubis_
Back
Top