diff --git a/app/components/post/post.js b/app/components/post/post.js
index b33297020..bb65a1922 100644
--- a/app/components/post/post.js
+++ b/app/components/post/post.js
@@ -29,6 +29,7 @@ import ProfilePicture from 'app/components/profile_picture';
 import ReplyIcon from 'app/components/reply_icon';
 import SlackAttachments from 'app/components/slack_attachments';
 import {preventDoubleTap} from 'app/utils/tap';
+import {getMarkdownTextStyles, getMarkdownBlockStyles} from 'app/utils/markdown';
 import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
 
 import webhookIcon from 'assets/images/icons/webhook.jpg';
@@ -315,13 +316,11 @@ class Post extends PureComponent {
         return attachments;
     }
 
-    renderSlackAttachments = (baseStyle) => {
+    renderSlackAttachments = (baseStyle, blockStyles, textStyles) => {
         const {post, theme} = this.props;
 
         if (post.props) {
             const {attachments} = post.props;
-            const textStyles = getMarkdownTextStyles(theme);
-            const blockStyles = getMarkdownBlockStyles(theme);
 
             if (attachments && attachments.length) {
                 return (
@@ -339,7 +338,7 @@ class Post extends PureComponent {
         return null;
     };
 
-    renderMessage = (style, messageStyle, replyBar = false) => {
+    renderMessage = (style, messageStyle, blockStyles, textStyles, replyBar = false) => {
         const {formatMessage} = this.props.intl;
         const {isFlagged, post, theme} = this.props;
         const {flagPost, unflagPost} = this.props.actions;
@@ -384,8 +383,8 @@ class Post extends PureComponent {
                     <View style={[{flex: 1}, (post.failed && style.failedPost)]}>
                         <Markdown
                             baseTextStyle={messageStyle}
-                            textStyles={getMarkdownTextStyles(theme)}
-                            blockStyles={getMarkdownBlockStyles(theme)}
+                            textStyles={textStyles}
+                            blockStyles={blockStyles}
                             value={post.message}
                         />
                     </View>
@@ -406,7 +405,7 @@ class Post extends PureComponent {
                                 toggleSelected={this.toggleSelected}
                             >
                                 {message}
-                                {this.renderSlackAttachments(messageStyle)}
+                                {this.renderSlackAttachments(messageStyle, blockStyles, textStyles)}
                                 {this.renderFileAttachments()}
                             </OptionsContext>
                         </View>
@@ -445,7 +444,7 @@ class Post extends PureComponent {
                                     actions={actions}
                                     cancelText={formatMessage({id: 'channel_modal.cancel', defaultMessage: 'Cancel'})}
                                 />
-                                {this.renderSlackAttachments(messageStyle)}
+                                {this.renderSlackAttachments(messageStyle, blockStyles, textStyles)}
                                 {this.renderFileAttachments()}
                             </View>
                             {post.failed &&
@@ -581,6 +580,9 @@ class Post extends PureComponent {
             messageStyle = style.message;
         }
 
+        const blockStyles = getMarkdownBlockStyles(theme);
+        const textStyles = getMarkdownTextStyles(theme);
+
         const selected = this.state && this.state.selected ? style.selected : null;
         let contents;
         if (this.props.commentedOnPost) {
@@ -599,7 +601,7 @@ class Post extends PureComponent {
                         <View>
                             {this.renderCommentedOnMessage(style)}
                         </View>
-                        {this.renderMessage(style, messageStyle, true)}
+                        {this.renderMessage(style, messageStyle, blockStyles, textStyles, true)}
                     </View>
                 </View>
             );
@@ -745,99 +747,4 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
     });
 });
 
-const getMarkdownTextStyles = makeStyleSheetFromTheme((theme) => {
-    const codeFont = Platform.OS === 'ios' ? 'Courier New' : 'monospace';
-
-    return StyleSheet.create({
-        emph: {
-            fontStyle: 'italic'
-        },
-        strong: {
-            fontWeight: 'bold'
-        },
-        link: {
-            color: theme.linkColor
-        },
-        heading1: {
-            fontSize: 17,
-            lineHeight: 25,
-            fontWeight: '700',
-            marginTop: 10,
-            marginBottom: 10
-        },
-        heading2: {
-            fontSize: 17,
-            lineHeight: 25,
-            fontWeight: '700',
-            marginTop: 10,
-            marginBottom: 10
-        },
-        heading3: {
-            fontSize: 17,
-            lineHeight: 25,
-            fontWeight: '700',
-            marginTop: 10,
-            marginBottom: 10
-        },
-        heading4: {
-            fontSize: 17,
-            lineHeight: 25,
-            fontWeight: '700',
-            marginTop: 10,
-            marginBottom: 10
-        },
-        heading5: {
-            fontSize: 17,
-            lineHeight: 25,
-            fontWeight: '700',
-            marginTop: 10,
-            marginBottom: 10
-        },
-        heading6: {
-            fontSize: 17,
-            lineHeight: 25,
-            fontWeight: '700',
-            marginTop: 10,
-            marginBottom: 10
-        },
-        code: {
-            alignSelf: 'center',
-            backgroundColor: changeOpacity(theme.centerChannelColor, 0.1),
-            fontFamily: codeFont,
-            paddingHorizontal: 4,
-            paddingVertical: 2
-        },
-        codeBlock: {
-            fontFamily: codeFont
-        },
-        horizontalRule: {
-            backgroundColor: theme.centerChannelColor,
-            height: StyleSheet.hairlineWidth,
-            flex: 1,
-            marginVertical: 10
-        },
-        mention: {
-            color: theme.linkColor
-        }
-    });
-});
-
-const getMarkdownBlockStyles = makeStyleSheetFromTheme((theme) => {
-    return StyleSheet.create({
-        codeBlock: {
-            backgroundColor: changeOpacity(theme.centerChannelColor, 0.1),
-            borderRadius: 4,
-            paddingHorizontal: 4,
-            paddingVertical: 2
-        },
-        horizontalRule: {
-            backgroundColor: theme.centerChannelColor
-        },
-        quoteBlock: {
-            color: changeOpacity(theme.centerChannelColor, 0.5),
-            padding: 5
-        }
-    });
-});
-
 export default injectIntl(Post);
diff --git a/app/screens/channel_info/channel_info_header.js b/app/screens/channel_info/channel_info_header.js
index 0530e392a..85ccfd266 100644
--- a/app/screens/channel_info/channel_info_header.js
+++ b/app/screens/channel_info/channel_info_header.js
@@ -12,12 +12,16 @@ import {
 import ChanneIcon from 'app/components/channel_icon';
 import FormattedDate from 'app/components/formatted_date';
 import FormattedText from 'app/components/formatted_text';
+import Markdown from 'app/components/markdown';
+import {getMarkdownTextStyles, getMarkdownBlockStyles} from 'app/utils/markdown';
 import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
 
 function channelInfoHeader(props) {
     const {createAt, creator, displayName, header, memberCount, purpose, status, theme, type} = props;
 
     const style = getStyleSheet(theme);
+    const textStyles = getMarkdownTextStyles(theme);
+    const blockStyles = getMarkdownBlockStyles(theme);
 
     return (
         <View style={style.container}>
@@ -45,7 +49,12 @@ function channelInfoHeader(props) {
                         id='channel_info.purpose'
                         defaultMessage='Purpose'
                     />
-                    <Text style={style.detail}>{purpose}</Text>
+                    <Markdown
+                        baseTextStyle={style.detail}
+                        textStyles={textStyles}
+                        blockStyles={blockStyles}
+                        value={purpose}
+                    />
                 </View>
             }
             {header.length > 0 &&
@@ -55,7 +64,12 @@ function channelInfoHeader(props) {
                         id='channel_info.header'
                         defaultMessage='Header'
                     />
-                    <Text style={style.detail}>{header}</Text>
+                    <Markdown
+                        baseTextStyle={style.detail}
+                        textStyles={textStyles}
+                        blockStyles={blockStyles}
+                        value={header}
+                    />
                 </View>
             }
             {creator &&
diff --git a/app/utils/markdown.js b/app/utils/markdown.js
new file mode 100644
index 000000000..ff27c6ee0
--- /dev/null
+++ b/app/utils/markdown.js
@@ -0,0 +1,105 @@
+// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import {Platform, StyleSheet} from 'react-native';
+import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme';
+
+export const getMarkdownTextStyles = makeStyleSheetFromTheme((theme) => {
+    const codeFont = Platform.OS === 'ios' ? 'Courier New' : 'monospace';
+
+    return StyleSheet.create({
+        emph: {
+            fontStyle: 'italic'
+        },
+        strong: {
+            fontWeight: 'bold'
+        },
+        link: {
+            color: theme.linkColor
+        },
+        heading1: {
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
+        },
+        heading2: {
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
+        },
+        heading3: {
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
+        },
+        heading4: {
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
+        },
+        heading5: {
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
+        },
+        heading6: {
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
+        },
+        code: {
+            alignSelf: 'center',
+            backgroundColor: changeOpacity(theme.centerChannelColor, 0.1),
+            fontFamily: codeFont,
+            paddingHorizontal: 4,
+            paddingVertical: 2
+        },
+        codeBlock: {
+            fontFamily: codeFont
+        },
+        horizontalRule: {
+            backgroundColor: theme.centerChannelColor,
+            height: StyleSheet.hairlineWidth,
+            flex: 1,
+            marginVertical: 10
+        },
+        mention: {
+            color: theme.linkColor
+        }
+    });
+});
+
+export const getMarkdownBlockStyles = makeStyleSheetFromTheme((theme) => {
+    return StyleSheet.create({
+        codeBlock: {
+            backgroundColor: changeOpacity(theme.centerChannelColor, 0.1),
+            borderRadius: 4,
+            paddingHorizontal: 4,
+            paddingVertical: 2
+        },
+        horizontalRule: {
+            backgroundColor: theme.centerChannelColor
+        },
+        quoteBlock: {
+            color: changeOpacity(theme.centerChannelColor, 0.5),
+            padding: 5
+        }
+    });
+});
+
+export default {
+    getMarkdownBlockStyles,
+    getMarkdownTextStyles
+};