Tessisamess

S	M	T	W	T	F	S
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

CHARACTER NAME

a subtitle line here

FANDOM Info

GENDER & PRONOUNS Info

FIELD Info

CHARACTER NAME

a subtitle line here

FANDOM Info

GENDER & PRONOUNS Info

FIELD Info

CHARACTER NAME

a subtitle line here

FANDOM Info

GENDER & PRONOUNS Info

FIELD Info

CODE

Information

Hey guys! So last month on my Patreon, I released a layout and bio that match this code. Normally I try to keep all of one code theme to one platform, but this roster ended up so similar to a really old one of mine that I consider it a code remake, and I just can't put those behind a paywall!! So here we go, enjoy! 💖

The Coding

<lj-raw><article style="max-width:calc((300px + 20px) * 3);margin:0 auto;display:flex;flex-wrap:wrap;font-family:calibri,sans-serif;font-size:15px;color:#111;line-height:1;">

<div style="width:300px;margin:10px;background:#C0DFD2;box-shadow:0 0 0 1px rgba(0,0,0,0.05),2px 2px 4px 0 rgba(0,0,0,0.2);">

<section style="height:calc(300px * 1.2);display:flex;align-items:flex-end;justify-content:center;text-align:center;clip-path:polygon(0 0, 100% 0%, 100% 80%, 50% 100%, 0 80%);background:rgba(0,0,0,0.05) url(CHAR_IMG)center;background-size:cover;padding:0 0 30% 0;font-family:georgia,serif;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,0.5);box-sizing:border-box;"><div style="width:100%;">

<img src="ICON_URL" style="height:80px;border-radius:100%;background:rgba(255,255,255,0.5);padding:7px;box-shadow:1px 1px 3px 1px rgba(0,0,0,0.3);margin:0 0 10px 0;box-sizing:border-box;">

<div style="font-size:22px;text-transform:uppercase;">NAME</div>

<i style="font-size:15px;text-transform:lowercase;letter-spacing:3px;">subtitle</i>

</div></section>

<section style="padding:20px;">

<fieldset style="background:rgba(255,255,255,0.1);border:1px solid rgba(0,0,0,0.1);margin:0 0 10px 0;">
				<legend style="font-family:georgia,serif;font-size:16px;color:#333;text-transform:lowercase;font-size:11px;letter-spacing:2px;font-style:italic;">FANDOM</legend>

Info
			</fieldset>

</section>

</div>

Installation Guide

Paste into an entry and fill in the following!

CHAR_IMG - Character background image
ICON_URL - Character icon

Editing Guide

Paste the coding into Notepad or similar and bring up Replace All (usually Ctrl+H) to replace values quickly and easily!

FONTS

calibri,sans-serif - Field info
georgia,serif - Body font

DIMENSIONS

* 3 - Characters per row; change the number, but leave the asterisk (*)
300px - Character width
80px - Icon
30% - Bottom padding for titles

COLORS

rgba(255,255,255,0.5) Icon background

rgba(255,255,255,0.1) Field info background

#fff Title & subtitle

#C0DFD2 Background

#111 Text

rgba(0,0,0,0.1) Borders

Terms of Use

♡ Do not remove credit.
♡ Do not redistribute my codes in part or in whole (posting a copy for players to use in your game is fine with a link to original post.)
♡ If you break something during editing, please feel free to drop me a comment and I'll help as best I can!
♡ I love seeing edits! This isn't a rule, but if you have a cool edit of one of my codes I'd love to see it!

Tags: codes, codes: cast list, codes: character roster

Profile

Title Here

Navigation

July 2024

Links List

Resources

Tags

Layout By

Character Roster: Point Cut

Information

The Coding

Installation Guide

Editing Guide

Terms of Use