diff --git a/rpg-docs/Model/Character/Characters.js b/rpg-docs/Model/Character/Characters.js
index 65295462..3003dc16 100644
--- a/rpg-docs/Model/Character/Characters.js
+++ b/rpg-docs/Model/Character/Characters.js
@@ -7,6 +7,7 @@ Schemas.Character = new SimpleSchema({
 	alignment:    {type: String, defaultValue: "", trim: false, optional: true},
 	gender:       {type: String, defaultValue: "", trim: false, optional: true},
 	race:         {type: String, defaultValue: "", trim: false, optional: true},
+	picture:      {type: String, defaultValue: "", trim: true,  optional: true},
 	description:  {type: String, defaultValue: "", trim: false, optional: true},
 	personality:  {type: String, defaultValue: "", trim: false, optional: true},
 	ideals:       {type: String, defaultValue: "", trim: false, optional: true},
diff --git a/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.html b/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.html
index 372528e8..93900df5 100644
--- a/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.html
+++ b/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.html
@@ -1,18 +1,36 @@
 <template name="personaDetailsDialog">
 	{{#baseDialog title=name class="deep-purple white-text" hideColor="true" hideDelete="true" startEditing=startEditing}}
-		{{alignment}} {{gender}} {{race}}
+		{{#with char}}
+			<div>{{alignment}} {{gender}} {{race}}</div>
+			<core-image style="width: 350px; height: 350px; margin-top: 8px;"
+				sizing="cover"
+				hero-id="image" hero
+				src={{picture}}></core-image>
+		{{/with}}
 	{{else}}
-		{{> personaDetailsEdit}}
+		{{#with char}}
+			{{> personaDetailsEdit}}
+		{{/with}}
 	{{/baseDialog}}
 </template>
 
 <template name="personaDetailsEdit">
-	<!--Name-->
-	<paper-input id="nameInput" label="Name" floatinglabel value={{name}}></paper-input><br>
-	<!--Alignment-->
-	<paper-input id="alignmentInput" label="Alignment" floatinglabel value={{alignment}}></paper-input><br>
-	<!--Gender-->
-	<paper-input id="genderInput" label="Gender" floatinglabel value={{gender}}></paper-input><br>
-	<!--Race-->
-	<paper-input id="raceInput" label="Race" floatinglabel value={{race}}></paper-input><br>
+	<div layout horizontal center-justified>
+		<div flex style="max-width: 350px;" layout vertical>
+			<!--Name-->
+			<paper-input id="nameInput" label="Name" floatinglabel value={{name}}></paper-input>
+			<!--Alignment-->
+			<paper-input id="alignmentInput" label="Alignment" floatinglabel value={{alignment}}></paper-input>
+			<!--Gender-->
+			<paper-input id="genderInput" label="Gender" floatinglabel value={{gender}}></paper-input>
+			<!--Race-->
+			<paper-input id="raceInput" label="Race" floatinglabel value={{race}}></paper-input>
+			<!--Picture-->
+			<paper-input id="pictureInput" label="Picture URL" floatinglabel value={{picture}}></paper-input>
+			<core-image style="height:350px; width: 100%; margin-top: 8px;"
+						sizing="cover"
+						hero-id="image" hero
+						src={{picture}}></core-image>
+		</div>
+	</div>
 </template>
diff --git a/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.js b/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.js
index 11407540..063eaea6 100644
--- a/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.js
+++ b/rpg-docs/client/views/character/persona/peronaDetailsDialog/personaDetailsDialog.js
@@ -2,21 +2,34 @@ Template.personaDetailsEdit.onRendered(function(){
 	updatePolymerInputs(this);
 });
 
+Template.personaDetailsDialog.helpers({
+	char: function() {
+		return Characters.findOne(
+			this._id,
+			{fields: {name: 1, alignment: 1, gender: 1, race: 1, picture: 1}}
+		);
+	}
+});
+
 Template.personaDetailsEdit.events({
 	"change #nameInput": function(event){
 		var input = event.currentTarget.value;
-		Characters.update(this.charId, {$set: {name: input}});
+		Characters.update(this._id, {$set: {name: input}});
 	},
 	"change #alignmentInput": function(event){
 		var input = event.currentTarget.value;
-		Characters.update(this.charId, {$set: {alignment: input}});
+		Characters.update(this._id, {$set: {alignment: input}});
 	},
 	"change #genderInput": function(event){
 		var input = event.currentTarget.value;
-		Characters.update(this.charId, {$set: {gender: input}});
+		Characters.update(this._id, {$set: {gender: input}});
 	},
 	"change #raceInput": function(event){
 		var input = event.currentTarget.value;
-		Characters.update(this.charId, {$set: {race: input}});
+		Characters.update(this._id, {$set: {race: input}});
+	},
+	"change #pictureInput": function(event){
+		var input = event.currentTarget.value;
+		Characters.update(this._id, {$set: {picture: input}});
 	},
 });
diff --git a/rpg-docs/client/views/character/persona/persona.html b/rpg-docs/client/views/character/persona/persona.html
index e23e1bcc..b8a8cb52 100644
--- a/rpg-docs/client/views/character/persona/persona.html
+++ b/rpg-docs/client/views/character/persona/persona.html
@@ -3,7 +3,35 @@
 		<div id="persona" class="scroll-y" fit>
 			<div class="column-container">
 				{{#with characterDetails}}
-					{{#containerCardHelper this}}{{alignment}} {{gender}} {{race}}{{/containerCardHelper}}
+					<paper-shadow class="card"
+								  hero-id="main" {{detailHero "details" _id}}>
+						{{#unless picture}}
+							<div class="top subhead characterField {{colorClass}}"
+								 hero-id="toolbar" {{detailHero "details" _id}}>
+								<div class="subhead" flex
+									 hero-id="title" {{detailHero "details" _id}}>
+									{{name}}
+								</div>
+							</div>
+						{{else}}
+							<core-image class="characterField clickable"
+										style="height:350px; width: 100%;
+											   background-color: #e8e8e8;"
+										sizing="cover"
+										hero-id="image" {{detailHero "details" _id}}
+										src={{picture}}></core-image>
+						{{/unless}}
+						<div class="bottom">
+							{{#if picture}}
+								<div class="title" hero-id="title" {{detailHero "details" _id}}>
+									{{name}}
+								</div>
+							{{/if}}
+							<div class="subhead">
+								{{alignment}} {{gender}} {{race}}
+							</div>
+						</div>
+					</paper-shadow>
 				{{/with}}
 				{{> containerCard characterField "description" "Description"}}
 				{{> containerCard characterField "personality" "Personality Traits"}}
diff --git a/rpg-docs/client/views/character/persona/persona.js b/rpg-docs/client/views/character/persona/persona.js
index 46063f25..6ef1e6a3 100644
--- a/rpg-docs/client/views/character/persona/persona.js
+++ b/rpg-docs/client/views/character/persona/persona.js
@@ -11,12 +11,12 @@ Template.persona.helpers({
 	characterDetails: function(){
 		var char = Characters.findOne(
 			this._id,
-			{fields: {name: 1, gender: 1, alignment: 1, race:1}}
+			{fields: {name: 1, gender: 1, alignment: 1, race:1, picture: 1}}
 		);
 		char.field = "details";
 		char.title = char.name;
 		char.color = "d";
-		char.topClass = "characterField";
+		char.startEditing = true;
 		return char;
 	},
 	characterField: function(field, title){
@@ -40,7 +40,7 @@ Template.persona.helpers({
 
 Template.persona.events({
 	"tap .characterField": function(event){
-		if (this.field === "details"){
+		if (this.field == "details"){
 			this.charId = Template.parentData()._id;
 			GlobalUI.setDetail({
 				template: "personaDetailsDialog",
@@ -58,6 +58,7 @@ Template.persona.events({
 					field: this.field,
 					title: this.title,
 					color: this.color,
+					startEditing: true,
 				},
 				heroId:   this._id + this.field,
 			});