diff --git a/src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css b/src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css
index 171482a36..3d8d8f3bb 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css
+++ b/src/skins/vector/css/matrix-react-sdk/views/elements/RichText.css
@@ -20,3 +20,16 @@
 .mx_Markdown_ITALIC {
     font-style: italic;
 }
+
+.mx_Markdown_CODE {
+    padding: .2em 0;
+    margin: 0;
+    font-size: 85%;
+    background-color: rgba(0,0,0,.04);
+    border-radius: 3px;
+}
+
+.mx_Markdown_HR {
+    color: rgba(0, 0, 0, 0.5);
+    text-decoration: #e7e7e7 double line-through;
+}
diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css
index b1cd3ce0e..45bc39cf3 100644
--- a/src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css
+++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/MessageComposer.css
@@ -60,6 +60,7 @@ limitations under the License.
     display: flex;
     flex-direction: column;
     min-height: 60px;
+    justify-content: center;
     align-items: flex-start;
     font-size: 14px;
     margin-right: 6px;
@@ -138,19 +139,26 @@ limitations under the License.
     margin: 0 11px;
 }
 
-.mx_MessageComposer_formatbar {
-    display: flex;
-
-    height: 30px;
+.mx_MessageComposer_formatbar_wrapper {
     width: 100%;
     background-color: #f7f7f7;
     box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.08);
+}
+
+.mx_MessageComposer_formatbar {
+    margin: auto;
+    max-width: 960px;
+    display: flex;
+
+    height: 30px;
 
     box-sizing: border-box;
     padding-left: 62px;
 
     flex-direction: row;
     align-items: center;
+    font-size: 10px;
+    color: #888;
 }
 
 .mx_MessageComposer_formatbar * {
@@ -163,6 +171,11 @@ limitations under the License.
     cursor: pointer;
 }
 
+.mx_MessageComposer_format_button_disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+}
+
 .mx_MessageComposer_formatbar_cancel {
     margin-right: 22px;
 }
@@ -172,6 +185,8 @@ limitations under the License.
 }
 
 .mx_MessageComposer_input_markdownIndicator {
+    cursor: pointer;
+    height: 10px;
     padding: 4px 4px 4px 0;
     opacity: 0.8;
 }
diff --git a/src/skins/vector/img/button-text-code-o-n.svg b/src/skins/vector/img/button-text-code-o-n.svg
new file mode 100644
index 000000000..8d1439c97
--- /dev/null
+++ b/src/skins/vector/img/button-text-code-o-n.svg
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
+    <title>B76754AB-42E6-48D2-9443-80CBC0DE02ED</title>
+    <desc>Created with sketchtool.</desc>
+    <defs></defs>
+    <g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-422.000000, -745.000000)">
+            <g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
+                <g id="button_text_code_ON" transform="translate(128.000000, 0.000000)">
+                    <rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
+                    <polygon id="/" fill="#FFFFFF" points="15.9262695 4.14746094 12.9990234 12 12.1074219 12 15.034668 4.14746094"></polygon>
+                    <g id="Group-5" opacity="0.5" transform="translate(17.000000, 5.000000)" stroke="#FFFFFF" stroke-linecap="round">
+                        <path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
+                        <path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
+                    </g>
+                    <g id="Group-5-Copy" opacity="0.5" transform="translate(9.500000, 8.000000) scale(-1, 1) translate(-9.500000, -8.000000) translate(8.000000, 5.000000)" stroke="#FFFFFF" stroke-linecap="round">
+                        <path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
+                        <path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/skins/vector/img/button-text-code.svg b/src/skins/vector/img/button-text-code.svg
new file mode 100644
index 000000000..24026cb70
--- /dev/null
+++ b/src/skins/vector/img/button-text-code.svg
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
+    <title>4CAFF494-61AE-4916-AFE8-D1E62F7CF0DE</title>
+    <desc>Created with sketchtool.</desc>
+    <defs></defs>
+    <g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="02_x-Chat-text-input-markdown-panel-MD_on" transform="translate(-422.000000, -745.000000)">
+            <g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
+                <g id="button_text_code" transform="translate(128.000000, 0.000000)">
+                    <rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
+                    <polygon id="/" fill-opacity="0.7" fill="#000000" points="15.9262695 4.14746094 12.9990234 12 12.1074219 12 15.034668 4.14746094"></polygon>
+                    <g id="Group-5" opacity="0.5" transform="translate(17.000000, 5.000000)" stroke="#4A4A4A" stroke-linecap="round">
+                        <path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
+                        <path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
+                    </g>
+                    <g id="Group-5-Copy" opacity="0.5" transform="translate(9.500000, 8.000000) scale(-1, 1) translate(-9.500000, -8.000000) translate(8.000000, 5.000000)" stroke="#4A4A4A" stroke-linecap="round">
+                        <path d="M0.5,0.5 L2.97487373,2.97487373" id="Line"></path>
+                        <path d="M0.5,3.02512627 L2.97487373,5.5" id="Line-Copy-4" transform="translate(1.737437, 4.262563) scale(1, -1) translate(-1.737437, -4.262563) "></path>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/skins/vector/img/button-text-underline-o-n.svg b/src/skins/vector/img/button-text-underline-o-n.svg
new file mode 100644
index 000000000..870be3ce6
--- /dev/null
+++ b/src/skins/vector/img/button-text-underline-o-n.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
+    <title>FD84FF7C-43E4-4312-90AB-5A59AD018377</title>
+    <desc>Created with sketchtool.</desc>
+    <defs></defs>
+    <g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="02_x-Chat-text-input-markdown-panel-MD_off-BUTTONS-ON" transform="translate(-390.000000, -745.000000)">
+            <g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
+                <g id="button_text_underline_ON" transform="translate(96.000000, 0.000000)">
+                    <rect id="Rectangle-108" fill="#4A4A4A" x="0" y="0" width="28" height="16" rx="8"></rect>
+                    <path d="M17.0092773,4.14746094 L17.0092773,9.22851562 C17.0092773,10.1237024 16.738935,10.8273086 16.1982422,11.3393555 C15.6575494,11.8514023 14.9145555,12.1074219 13.9692383,12.1074219 C13.0239211,12.1074219 12.2925644,11.849612 11.7751465,11.3339844 C11.2577285,10.8183568 10.9990234,10.1093795 10.9990234,9.20703125 L10.9990234,4.14746094 L11.9121094,4.14746094 L11.9121094,9.27148438 C11.9121094,9.92676109 12.091144,10.4298485 12.4492188,10.7807617 C12.8072935,11.1316749 13.3336554,11.3071289 14.0283203,11.3071289 C14.6907585,11.3071289 15.2010073,11.1307798 15.559082,10.7780762 C15.9171567,10.4253726 16.0961914,9.91959965 16.0961914,9.26074219 L16.0961914,4.14746094 L17.0092773,4.14746094 Z" id="U" fill="#FFFFFF"></path>
+                    <path d="M9.5,13.5 L18.7195444,13.5" id="Line" stroke="#4A4A4A" stroke-linecap="round" opacity="0.5" transform="translate(14.109772, 13.500000) scale(1, -1) translate(-14.109772, -13.500000) "></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/skins/vector/img/button-text-underline.svg b/src/skins/vector/img/button-text-underline.svg
new file mode 100644
index 000000000..26f448539
--- /dev/null
+++ b/src/skins/vector/img/button-text-underline.svg
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="28px" height="16px" viewBox="0 0 28 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: sketchtool 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
+    <title>13E7EE68-9B16-4A3D-8F9F-31E4BAB7E438</title>
+    <desc>Created with sketchtool.</desc>
+    <defs></defs>
+    <g id="Screens-revised" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="02_x-Chat-text-input-markdown-panel-MD_on" transform="translate(-390.000000, -745.000000)">
+            <g id="format-buttons-A-Copy" transform="translate(294.000000, 745.000000)">
+                <g id="button_text_underline" transform="translate(96.000000, 0.000000)">
+                    <rect id="Rectangle-108" fill-opacity="0.1" fill="#000000" x="0" y="0" width="28" height="16" rx="8"></rect>
+                    <path d="M17.0092773,4.14746094 L17.0092773,9.22851562 C17.0092773,10.1237024 16.738935,10.8273086 16.1982422,11.3393555 C15.6575494,11.8514023 14.9145555,12.1074219 13.9692383,12.1074219 C13.0239211,12.1074219 12.2925644,11.849612 11.7751465,11.3339844 C11.2577285,10.8183568 10.9990234,10.1093795 10.9990234,9.20703125 L10.9990234,4.14746094 L11.9121094,4.14746094 L11.9121094,9.27148438 C11.9121094,9.92676109 12.091144,10.4298485 12.4492188,10.7807617 C12.8072935,11.1316749 13.3336554,11.3071289 14.0283203,11.3071289 C14.6907585,11.3071289 15.2010073,11.1307798 15.559082,10.7780762 C15.9171567,10.4253726 16.0961914,9.91959965 16.0961914,9.26074219 L16.0961914,4.14746094 L17.0092773,4.14746094 Z" id="U" fill-opacity="0.7" fill="#000000"></path>
+                    <path d="M9.5,13.5 L18.7195444,13.5" id="Line" stroke="#4A4A4A" stroke-linecap="round" opacity="0.5" transform="translate(14.109772, 13.500000) scale(1, -1) translate(-14.109772, -13.500000) "></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file