diff --git a/Glitter Hearts/Heart.png b/Glitter Hearts/Heart.png
new file mode 100644
index 0000000000..c1253e7a27
Binary files /dev/null and b/Glitter Hearts/Heart.png differ
diff --git a/Glitter Hearts/glitterhearts.css b/Glitter Hearts/glitterhearts.css
new file mode 100644
index 0000000000..ff7cdc01db
--- /dev/null
+++ b/Glitter Hearts/glitterhearts.css	
@@ -0,0 +1,433 @@
+@import url('https://fonts.googleapis.com/css?family=Mansalva&display=swap');
+
+.sheet-main
+{
+	display: grid;
+	grid-template-columns: minmax(256px, 1fr);
+	grid-template-rows: 165px auto auto auto auto;
+	grid-gap: 1em;
+	gap: 1em;
+	height: 100%;
+	width: 100%;
+	font-family: 'Mansalva', cursive;
+	min-height: 0;
+}
+
+.sheet-navbar
+{
+	display: flex;
+	justify-items: left;
+}
+
+.sheet-navbar > button
+{
+	margin: 0 0.25em 0 0;
+}
+
+.sheet-header
+{
+	display: grid;
+	grid-template-columns: minmax(256px, 1fr) repeat(2, minmax(150px, 1fr));
+	grid-template-rows: 1fr 1fr;
+	align-content: stretch;
+	justify-content: space-evenly;
+	grid-gap: 0.5em;
+	gap: 0.5em;
+}
+
+.sheet-logo
+{
+	background-image: image("./logo.png");
+	background-repeat: no-repeat;
+	background-position: center;
+	grid-row: span 2;
+}
+
+.sheet-underlabelled
+{
+	display: grid;
+	grid-template-columns: 3fr 1fr;
+	grid-template-rows: 1fr 1fr;
+	justify-items: left;
+	grid-gap: 0.1em;
+	gap: 0.1em;
+}
+
+.sheet-underlabelled > label
+{
+	vertical-align: text-top;
+	text-align: center;
+	font-size: 12px;
+	font-style: italic;
+	width: 100%;
+	color: grey;
+	display: inline-block;
+}
+
+.sheet-underlabelled > input
+{
+	max-height: 3em;
+	width: 100%;
+}
+
+div.sheet-hp-display
+{
+	width: 100%;
+	height: 100%;
+	vertical-align: middle;
+	background-image: image("./Heart.png");
+	background-repeat: no-repeat;
+	background-position: center 20%;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	margin: 0;
+	padding: 0.5em;
+}
+
+.sheet-hp-display > input
+{
+	width: 3em;
+}
+
+.sheet-statline
+{
+	display: grid;
+	grid-template-columns: repeat(5, 1fr);
+	grid-template-rows: 1fr;
+	grid-gap: 1em;
+	gap: 1em;
+	align-items: center;
+	justify-items: stretch;
+	vertical-align: middle;
+}
+
+.sheet-stat
+{
+	display: grid;
+	grid-template-rows: 1fr;
+	grid-template-columns: 1fr 1fr 1fr;
+	align-self: center;
+	justify-self: center;
+	background-color: rgb(255, 239, 241);
+	border: 3px solid rgb(255, 146, 164);
+	padding: 0.6em;
+}
+
+.sheet-stat > input
+{
+	width: 2.5em;
+	padding: 0.3em;
+}
+
+.sheet-stat > label
+{
+	width: 100%;
+}
+
+button.sheet-nav
+{
+	color: black;
+	background-color: white;
+	border: 1px solid black;
+	font-size: large;
+	padding: 0.7em;
+}
+
+button.sheet-nav:hover
+{
+	background-color: dimgrey;
+}
+
+.sheet-footer
+{
+	font-family: Arial, Helvetica, sans-serif;
+	font-size: 10;
+	color: grey;
+	font-style: italic;
+	display: flex;
+	justify-content: space-between;
+}
+
+.sheet-pg1,
+.sheet-pg2,
+.sheet-pg3 {
+	display: none;
+}
+
+.sheet-tabstoggle[value="pg1"] ~ div.sheet-pg1,
+.sheet-tabstoggle[value="pg2"] ~ div.sheet-pg2,
+.sheet-tabstoggle[value="pg3"] ~ div.sheet-pg3 {
+	display: block;
+}
+
+.sheet-nametype[value="char"] ~ input[name="attr_char_name"],
+.sheet-nametype[value="hero"] ~ input[name="attr_hero_name"],
+.sheet-nametype[value="pc"] ~ input[name="attr_pc_name"]
+{
+	background-color: pink;
+}
+
+.sheet-section-header
+{
+	font-style: italic;
+	text-align: center;
+	font-size: large;
+	width: 100%;
+}
+
+.sheet-pg1-upper,
+.sheet-pg1-lower
+{
+	height: 100%;
+}
+
+.sheet-pg1-upper
+{
+	display: grid;
+	grid-template-rows: 1fr;
+	grid-template-columns: 1fr 1fr 1fr;
+	grid-gap: 2em;
+	gap: 2em;
+	justify-content: space-between;
+}
+
+.sheet-pg1-box
+{
+	display: grid;
+	padding: 1em;
+	grid-template-rows: auto;
+	grid-template-columns: 1fr;
+	grid-gap: 0.25em;
+	gap: 0.25em;
+	justify-content: start;
+	align-content: start;
+	text-align: left;
+	border: 2px solid black;
+}
+
+.sheet-pg1-counter-list
+{
+	
+	display: grid;
+	grid-template-columns: 1fr;
+	grid-template-rows: 1fr 1fr 1fr;
+	gap: 0.25em;
+	grid-gap: 0.25em;
+	align-items: stretch;
+	width: 100%;
+}
+
+.sheet-pg1-counter-list > .sheet-stat > label
+{
+	grid-column: span 2;
+}
+
+.sheet-pg1-counter-list > .sheet-stat > input
+{
+	justify-self: center;
+	align-self: center;
+}
+
+.sheet-pg1-counter-list > .sheet-stat 
+{
+	width: 90%;
+}
+
+.sheet-layout
+{
+	display: grid;
+	grid-template-columns: 1fr;
+	grid-template-rows: minmax(150px, auto) minmax(150px, auto);
+	gap: 1em;
+	grid-gap: 1em;
+}
+
+.sheet-move-list
+.sheet-move-header
+{
+	display: grid;
+	grid-template-columns: 3fr 3em;
+	grid-template-rows: 2em minmax(auto, 1fr);
+	justify-content: left;
+	grid-gap: 0.25em;
+	gap: 0.25em;
+	align-content: start;
+	justify-content: center;
+	height: 100%;
+}
+
+.sheet-class-selection
+{
+	display: grid;
+	grid-template-columns: 1fr;
+	grid-template-rows: 3em 3em;
+}
+
+.sheet-move
+{
+	display: grid;
+	grid-template-columns: 4fr 3em;
+	grid-template-rows: 1fr;
+	justify-content: left;
+	margin-right: 4em;
+	margin-bottom: 0.25em;
+	width: 100%;
+}
+
+.sheet-class-selection > select,
+.sheet-move > input,
+.sheet-condition > input
+{
+	width: 98%;
+}
+
+.sheet-condition
+{
+	margin-bottom: 0.25em;
+}
+
+.sheet-pg1-lower
+{
+	display: grid;
+	align-items: start;
+	grid-template-columns: 1fr 2fr;
+	grid-template-rows: minmax(auto, 1fr);
+	grid-gap: 1em;
+	gap: 1em;
+}
+
+.sheet-condition-counters
+{
+	display: grid;
+	grid-template-columns: 1fr;
+	grid-template-rows: auto auto;
+	gap: 0.5em;
+}
+
+input[type=text],
+input[type=number],
+select,
+textarea
+{
+	font-family: Arial, Helvetica, sans-serif;
+}
+
+.sheet-pg1-conditions-list
+{
+	border: 2px solid black;
+}
+
+.sheet-pg1-relationship-list
+{
+	grid-row: span 3;
+	grid-template-rows: 3em 3em 1fr;
+	grid-template-columns: 2fr 1fr;
+	justify-content: space-evenly;
+}
+
+.sheet-relationship-block
+{
+	grid-row: span 3;
+	display: grid;
+	grid-template-columns: 2fr 1fr;
+	grid-template-rows: 1fr;
+	grid-gap: 0.5em;
+	gap: 0.5em;
+	margin-bottom: 0.25em;
+}
+
+.sheet-relationship-block,
+.sheet-relationship-block > input,
+.sheet-relationship-block > select
+{
+	width: 100%;
+	height: 2em;
+}
+
+.sheet-pg-layout
+{
+	display: grid;
+	grid-template-rows: 3em 1fr;
+	grid-template-columns: 1fr;
+}
+
+.sheet-pg2-achievement
+{
+	display: grid;
+	grid-template-columns: 2em 1fr;
+	grid-template-rows: 1fr;
+	grid-gap: 0.3em;
+	gap: 0.3em;
+	align-items: center;
+}
+
+.sheet-pg2-achievement > input[type=text]
+{
+	width: 100%;
+	margin-bottom: 0.25em;
+}
+
+/* Roll Template*/
+.sheet-rolltemplate-glitterhearts .sheet-template
+{
+	border: black solid 5px;
+	background-color: white;
+	width: 90%;
+	display: block;
+}
+
+.sheet-rolltemplate-glitterhearts .sheet-template div
+{
+	padding: 0.5em;
+}
+
+.sheet-rolltemplate-glitterhearts .sheet-template-title
+{
+	font-style: italic;
+	font-size: large;
+	font-weight: bold;
+	text-align: center;
+}
+
+.sheet-rolltemplate-glitterhearts .sheet-template-6minus
+{
+	color: white;
+	background-color: rgb(141, 3, 3);
+}
+
+.sheet-rolltemplate-glitterhearts .sheet-template-7-9
+{
+	color: black;
+	background-color: yellow;
+}
+
+.sheet-rolltemplate-glitterhearts .sheet-template-11-12
+{
+	color: white;
+	background-color: green;
+}
+
+.sheet-rolltemplate-glitterhearts .sheet-template-12plus
+{
+	color: white;
+	background-color: darkblue;
+}
+
+.sheet-rolltemplate-glitterhearts .sheet-template-6minus,
+.sheet-rolltemplate-glitterhearts .sheet-template-7-9,
+.sheet-rolltemplate-glitterhearts .sheet-template-11-12,
+.sheet-rolltemplate-glitterhearts .sheet-template-12plus
+{
+	text-align: center;
+}
+
+.sheet-rolltemplate-glitterhearts .sheet-template-6minus span,
+.sheet-rolltemplate-glitterhearts .sheet-template-7-9 span,
+.sheet-rolltemplate-glitterhearts .sheet-template-11-12 span,
+.sheet-rolltemplate-glitterhearts .sheet-template-12plus span
+{
+	color: black;
+	height: 2em;
+	width: 2em;
+}
\ No newline at end of file
diff --git a/Glitter Hearts/glitterhearts.html b/Glitter Hearts/glitterhearts.html
new file mode 100644
index 0000000000..2693e62817
--- /dev/null
+++ b/Glitter Hearts/glitterhearts.html	
@@ -0,0 +1,278 @@
+<link rel="stylesheet" href="glitterhearts.css">
+
+<div class="main">
+	<div class="header">
+		<div class="block logo"></div>
+		<div class="block underlabelled">
+			<input type="text" name="attr_char_name">
+			<input type="text" maxlength="10" name="attr_char_pronouns">
+			<label>Character Name</label>
+			<label>Pronouns</label>
+		</div>
+		<div class="block underlabelled">
+			<input type="text" name="attr_hero_name">
+			<input type="text" maxlength="10" name="attr_hero_pronouns">
+			<label>Hero Name</label>
+			<label>Pronouns</label>
+		</div>
+		<div class="block underlabelled">
+			<input type="text" name="attr_player_name">
+			<input type="text" maxlength="10" name="attr_player_pronouns">
+			<label>Player Name</label>
+			<label>Pronouns</label>
+		</div>
+		<div class="block hp-display">
+			<input type="number" name="attr_pc_hp"> / <input type="number" name="attr_pc_max_hp">
+		</div>
+	</div>
+	<div class="statline">
+		<div class="stat">
+			<label>Physical</label>
+			<button type="roll"
+				value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_physical}]]}}{{roll_stat=Physical}}"
+				name="roll_Physical"></button>
+			<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_physical">
+		</div>
+		<div class="stat">
+			<label>Emotional</label>
+			<button type="roll"
+				value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_emotional}]]}}{{roll_stat=Emotional}}"
+				name="roll_Emotional"></button>
+			<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_emotional">
+		</div>
+		<div class="stat">
+			<label>Mental</label>
+			<button type="roll"
+				value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_Mental}]]}}{{roll_stat=Mental}}"
+				name="roll_Mental"></button>
+			<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_mental">
+		</div>
+		<div class="stat">
+			<label>Mystical</label>
+			<button type="roll"
+				value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_Mystical}]]}}{{roll_stat=Mystical}}"
+				name="roll_Mystical"></button>
+			<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_mystical">
+		</div>
+		<div class="stat">
+			<label>Persona</label>
+			<button type="roll"
+				value="&{template:glitterhearts}{{pc_name=@{char_name}}}{{check=[[2d6+@{pc_persona}]]}}{{roll_stat=Persona}}"
+				name="roll_Persona"></button>
+			<input type="number" maxlength="1" max="3" min="-2" value="0" name="attr_pc_persona">
+		</div>
+	</div>
+	<div class="navbar">
+		<button class="nav" type="action" name="act_pg1">Character</button>
+		<button class="nav" type="action" name="act_pg2">Heroic Achievements</button>
+		<button class="nav" type="action" name="act_pg3">Notes</button>
+	</div>
+	<div class="page">
+		<input type="hidden" class="tabstoggle" name="attr_sheetTab" value="pg1">
+		<div class="pg1">
+			<div class=layout>
+				<div class="pg1-upper">
+					<div class="pg1-box">
+						<div class="class-selection">
+							<div class="section-header">Everyday Identity</div>
+							<select name="attr_pc_everyday_class">
+								<option value="" selected="selected"></option>
+								<option value="Athlete">The Athlete</option>
+								<option value="Bodybuilder">The Bodybuilder</option>
+								<option value="Boxer">The Boxer</option>
+								<option value="Coach">The Coach</option>
+								<option value="Intellectual">The Intellectual</option>
+								<option value="Unrivalled">The Unrivalled</option>
+								<option value="Skeptic">The Skeptic</option>
+								<option value="Savant">The Savant</option>
+								<option value="Popular">The Popular One</option>
+								<option value="Clown">The Clown</option>
+								<option value="Counselor">The Counselor</option>
+								<option value="Team">The Team Player</option>
+								<option value="Succeed">The Most Likely To Succeed</option>
+								<option value="Aloof">The Aloof</option>
+								<option value="Loner">The Loner</option>
+								<option value="Overconfident">The Overconfident</option>
+								<option value="Goth">The Goth</option>
+								<option value="Dreamer">The Dreamer</option>
+								<option value="Believer">The True Believer</option>
+								<option value="Gifted">The Gifted</option>
+							</select>
+						</div>
+						<div class="move-list">
+							<div class="move-header">
+								<div class="section-header">Moves</div>
+								<div class="section-header">Pg.</div>
+							</div>
+							<div>
+								<fieldset class="repeating_moveseveryday">
+									<div class="move">
+										<input type="text" class="move-name" name="attr_everyday_move_name">
+										<input type="number" maxlength="3" min="0" class="move-pg" name="attr_everyday_move_pg">
+									</div>
+								</fieldset>
+							</div>
+						</div>
+					</div>
+					<div class="pg1-box">
+						<div class="class-selection">
+							<div class="section-header">Magical Archetype</div>
+							<select name="attr_pc_magical_class">
+								<option value="" selected="selected"></option>
+								<option value="Idol">The Idol</option>
+								<option value="Witch">The Witch</option>
+								<option value="Warrior">The Warrior</option>
+								<option value="Defender">The Defender</option>
+								<option value="Tactitcian">The Tactitcian</option>
+							</select>
+						</div>
+						<div class="move-list">
+							<div class="move-header">
+								<div class="section-header">Moves</div>
+								<div class="section-header">Pg.</div>
+							</div>
+							<div>
+								<fieldset class="repeating_movesmagical">
+									<div class="move">
+										<input type="text" class="move-name" name="attr_magical_move_name">
+										<input type="number" maxlength="3"  min="0" class="move-pg" name="attr_magical_move_pg">
+									</div>
+								</fieldset>
+							</div>
+						</div>
+					</div>
+					<div class="pg1-box">
+						<div class="class-selection">
+							<div class="section-header">Mystical Connection</div>
+							<select name="attr_pc_mystical_class">
+								<option value="" selected="selected"></option>
+								<option value="Fire">Elemental: Fire</option>
+								<option value="Water">Elemental: Water</option>
+								<option value="Air">Elemental: Air</option>
+								<option value="Lightning">Elemental: Lightning</option>
+								<option value="Metal">Elemental: Metal</option>
+								<option value="Light">Elemental: Light</option>
+								<option value="Dark">Elemental: Dark</option>
+								<option value="Life">Elemental: Life</option>
+								<option value="Death">Elemental: Death</option>
+								<option value="Joy">Emotional: Joy</option>
+								<option value="Sadness">Emotional: Sadness</option>
+								<option value="Love">Emotional: Love</option>
+								<option value="Fear">Emotional: Fear</option>
+								<option value="Anger">Emotional: Anger</option>
+								<option value="Hope">Emotional: Hope</option>
+								<option value="Desire">Emotional: Desire</option>
+								<option value="Disgust">Emotional: Disgust</option>
+								<option value="Trust">Emotional: Trust</option>
+							</select>
+						</div>
+						<div class="move-list">
+							<div class="move-header">
+								<div class="section-header">Moves</div>
+								<div class="section-header">Pg.</div>
+							</div>
+							<fieldset class="repeating_movesmystical">
+								<div class="move">
+									<input type="text" class="move-name" name="attr_mystical_move_name">
+									<input type="number" maxlength="3"  min="0" class="move-pg" name="attr_mystical_move_pg">
+								</div>
+							</fieldset>
+						</div>
+					</div>
+				</div>
+				<div class="pg1-lower">
+					<div class="condition-counters">
+						<div class="pg1-conditions-list pg1-box">
+							<div class="section-header">Conditions</div>
+							<fieldset class="repeating_conditions">
+								<div class="condition">
+									<input type="text" name="attr_condition">
+								</div>
+							</fieldset>
+						</div>
+						<div class="pg1-counter-list">
+							<div class="stat">
+								<label>Power Pool</label>
+								<input type="number" name="attr_power_points">
+							</div>
+							<div class="stat">
+								<label>Experience</label>
+								<input type="number" name="attr_experience">
+							</div>
+							<div class="stat">
+								<label>Heroic Achievements</label>
+								<input type="number" name="attr_achievements">
+							</div>
+						</div>
+					</div>
+					<div class="pg1-relationship-list">
+						<div class="relationship-block">
+							<div class="section-header">Relationships</div>
+							<div class="section-header">Status</div>
+						</div>
+						<div>
+							<fieldset class="repeating_relationship">
+								<div class="relationship-block">
+									<input type="text" name="attr_relationshipname">
+									<select name="attr_relationshipstatus">
+										<option value=""></option>
+										<option value="1">Cooperative</option>
+										<option value="2">Competitive</option>
+										<option value="3">Broken</option>
+									</select>
+								</div>
+							</fieldset>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div class="pg2">
+			<div class="pg-layout">
+				<div class="section-header">Heroic Achievements</div>
+				<div>
+					<fieldset class="repeating_achievements">
+						<div class="pg2-achievement">
+							<input type="checkbox" name="attr_achievement_check" value="1">
+							<input type="text" name="attr_achievement_text">
+						</div>
+					</fieldset>
+				</div>
+			</div>
+		</div>
+		<div class="pg3">
+			<div class="pg-layout">
+				<div class="section-header">Notes</div>
+				<textarea name="attr_notes"></textarea>>
+			</div>
+		</div>
+		<div class="footer">
+			<div>Version 1.0</div>
+			<div>Glitter Hearts designed by Greg Leatherman.</div>
+			<div>gleather.itch.io/glitter-hearts</div>
+		</div>
+	</div>
+</div>
+
+<rolltemplate class="sheet-rolltemplate-glitterhearts">
+	<div class="wrapper">
+		<div class="template">
+			<div class="template-title">{{pc_name}} rolls {{roll_stat}}!</div>
+			{{#rollLess() check 7}}<div class="template-6minus"><span>{{check}}</span> 6- Miss!</div>{{/rollLess() check 7}}
+			{{#rollBetween() check 7 9}}<div class="template-7-9"><span>{{check}}</span> 7-9 Partial Success!</div>{{/rollBetween() check 7 9}}
+			{{#rollBetween() check 10 11}}<div class="template-11-12"><span>{{check}}</span> 10+ Full Success!</div>{{/rollBetween() check 10 11}}
+			{{#rollGreater() check 11}}<div class="template-12plus"><span>{{check}}</span> 12+ Great Success!</div>{{/rollGreater() check 11}}
+		</div>
+	</div>
+</rolltemplate>
+
+<script type="text/worker">
+    const buttonlist = ["pg1","pg2","pg3"];
+    buttonlist.forEach(button => {
+        on(`clicked:${button}`, function() {
+            setAttrs({
+                sheetTab: button
+            });
+        });
+    });
+</script>
\ No newline at end of file
diff --git a/Glitter Hearts/logo.png b/Glitter Hearts/logo.png
new file mode 100644
index 0000000000..9541c420de
Binary files /dev/null and b/Glitter Hearts/logo.png differ
diff --git a/Glitter Hearts/preview.png b/Glitter Hearts/preview.png
new file mode 100644
index 0000000000..4d6f5311e0
Binary files /dev/null and b/Glitter Hearts/preview.png differ
diff --git a/Glitter Hearts/sheet.json b/Glitter Hearts/sheet.json
new file mode 100644
index 0000000000..6828f5ee67
--- /dev/null
+++ b/Glitter Hearts/sheet.json	
@@ -0,0 +1,8 @@
+{
+	"html": "glitterhearts.html",
+	"css": "glitterhearts.css",
+	"authors": "Tyson Tiatia",
+	"roll20userid": "514883",
+	"preview": "preview.png",
+	"instructions": "No special instructions."
+}
\ No newline at end of file