diff --git a/webclient/app.css b/webclient/app.css
index fd548c117b25dfd9d1e639e15bfcf99cceed98ad..13cd19a2efd342e0ece25c47cf5a6ec07d693252 100644
--- a/webclient/app.css
+++ b/webclient/app.css
@@ -187,6 +187,14 @@ h1 {
     border: 0px ! important;
 }
 
+.image {
+    display: block;
+    max-width:320px;
+    max-height:320px;
+    width: auto;
+    height: auto;
+}
+
 .bubble {
     padding: 6px;
     padding-left: 1em;
diff --git a/webclient/room/room.html b/webclient/room/room.html
index 276c3caa5a4227fed5188c58ef4752c7785a76ee..600bc14eb87d37d94d9afc67899b86df0c763960 100644
--- a/webclient/room/room.html
+++ b/webclient/room/room.html
@@ -32,7 +32,8 @@
                 <td ng-class="!msg.content.membership_target ? (msg.content.msgtype === 'm.emote' ? 'emote text' : 'text') : ''">
                     <div class="bubble">
                         {{ msg.content.msgtype === "m.emote" ? ("* " + (members[msg.user_id].displayname || msg.user_id) + " ") : "" }}
-                        {{ msg.content.body }}
+                        {{ msg.content.msgtype === "m.text" ? msg.content.body : "" }}
+                        <img class="image" ng-hide='msg.content.msgtype !== "m.image"' src="{{ msg.content.url }}" alt="{{ msg.content.body }}"/>
                     </div>
                 </td>
                 <td class="rightBlock">