diff --git a/app/components/channel_drawer_list/channel_drawer_list.js b/app/components/channel_drawer_list/channel_drawer_list.js
index 00c4b073b..9038ef0bc 100644
--- a/app/components/channel_drawer_list/channel_drawer_list.js
+++ b/app/components/channel_drawer_list/channel_drawer_list.js
@@ -421,7 +421,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
             color: theme.sidebarText,
             opacity: 1,
             fontSize: 15,
-            fontWeight: '500',
+            fontWeight: '400',
             letterSpacing: 0.8,
             lineHeight: 18
         },
@@ -437,7 +437,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
         },
         action: {
             color: theme.sidebarText,
-            fontSize: 16,
+            fontSize: 20,
             fontWeight: '500',
             lineHeight: 18
         },
diff --git a/app/components/custom_list/channel_list_row.js b/app/components/custom_list/channel_list_row.js
index c456075e3..ed9335bf1 100644
--- a/app/components/custom_list/channel_list_row.js
+++ b/app/components/custom_list/channel_list_row.js
@@ -111,6 +111,7 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
             marginLeft: 5
         },
         purpose: {
+            marginTop: 7,
             fontSize: 13,
             color: changeOpacity(theme.centerChannelColor, 0.5)
         },
diff --git a/app/components/custom_list/member_list_row.js b/app/components/custom_list/member_list_row.js
index 6b3c1d9a7..306e59df0 100644
--- a/app/components/custom_list/member_list_row.js
+++ b/app/components/custom_list/member_list_row.js
@@ -44,7 +44,7 @@ function MemberListRow(props) {
             }
             <ProfilePicture
                 user={user}
-                size={40}
+                size={32}
             />
             <View style={style.textContainer}>
                 <View style={{flexDirection: 'column'}}>
@@ -97,7 +97,7 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
             backgroundColor: theme.centerChannelBg
         },
         displayName: {
-            fontSize: 16,
+            fontSize: 15,
             color: theme.centerChannelColor
         },
         icon: {
@@ -110,7 +110,7 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme) => {
         },
         username: {
             marginLeft: 5,
-            fontSize: 16,
+            fontSize: 15,
             color: changeOpacity(theme.centerChannelColor, 0.5)
         },
         selector: {
diff --git a/app/components/markdown/index.js b/app/components/markdown/index.js
index 414d3ee72..7536ae283 100644
--- a/app/components/markdown/index.js
+++ b/app/components/markdown/index.js
@@ -110,9 +110,7 @@ export default class Markdown extends PureComponent {
     renderParagraph = ({children}) => {
         return (
             <View style={style.block}>
-                <Text>
-                    {children}
-                </Text>
+                {children}
             </View>
         );
     }
@@ -120,9 +118,7 @@ export default class Markdown extends PureComponent {
     renderHeading = ({children, level}) => {
         return (
             <View style={[style.block, this.props.blockStyles[`heading${level}`]]}>
-                <Text>
-                    {children}
-                </Text>
+                {children}
             </View>
         );
     }
diff --git a/app/components/post/post.js b/app/components/post/post.js
index 0f43d0899..235fcb6da 100644
--- a/app/components/post/post.js
+++ b/app/components/post/post.js
@@ -683,29 +683,46 @@ const getMarkdownTextStyles = makeStyleSheetFromTheme((theme) => {
             color: theme.linkColor
         },
         heading1: {
-            fontSize: 30,
-            lineHeight: 45
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
         },
         heading2: {
-            fontSize: 24,
-            lineHeight: 36
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
         },
         heading3: {
-            fontSize: 20,
-            lineHeight: 30
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
         },
         heading4: {
-            fontSize: 16,
-            lineHeight: 24
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
         },
         heading5: {
-            fontSize: 14,
-            lineHeight: 21
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
         },
         heading6: {
-            fontSize: 14,
-            lineHeight: 21,
-            opacity: 0.8
+            fontSize: 17,
+            lineHeight: 25,
+            fontWeight: '700',
+            marginTop: 10,
+            marginBottom: 10
         },
         code: {
             alignSelf: 'center',
diff --git a/app/components/post_textbox/post_textbox.js b/app/components/post_textbox/post_textbox.js
index ddce06386..fd7da7407 100644
--- a/app/components/post_textbox/post_textbox.js
+++ b/app/components/post_textbox/post_textbox.js
@@ -321,7 +321,7 @@ class PostTextbox extends PureComponent {
                         >
                             <Icon
                                 size={30}
-                                style={{marginTop: 2}}
+                                style={style.attachIcon}
                                 color={changeOpacity(theme.centerChannelColor, 0.9)}
                                 name='md-add'
                             />
@@ -392,6 +392,16 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
             borderTopWidth: 1,
             borderTopColor: changeOpacity(theme.centerChannelColor, 0.20)
         },
+        attachIcon: {
+            ...Platform.select({
+                ios: {
+                    marginTop: 2
+                },
+                android: {
+                    marginTop: 0
+                }
+            })
+        },
         sendButton: {
             backgroundColor: theme.buttonBg,
             borderRadius: 18,
@@ -403,7 +413,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
                     marginBottom: 5
                 },
                 android: {
-                    marginBottom: 3.5
+                    marginBottom: 6.5
                 }
             }),
             alignItems: 'center',
diff --git a/app/navigation/router.js b/app/navigation/router.js
index 00bb53a05..5668c791d 100644
--- a/app/navigation/router.js
+++ b/app/navigation/router.js
@@ -216,7 +216,7 @@ class Router extends Component {
 
         return {
             mainOverlay: {
-                backgroundColor: '#000',
+                backgroundColor: this.props.theme.centerChannelBg,
                 opacity
             },
             drawerOverlay: {
diff --git a/app/scenes/channel_add_members/channel_add_members.js b/app/scenes/channel_add_members/channel_add_members.js
index 0a52bb227..5db8d6651 100644
--- a/app/scenes/channel_add_members/channel_add_members.js
+++ b/app/scenes/channel_add_members/channel_add_members.js
@@ -253,9 +253,9 @@ class ChannelAddMembers extends PureComponent {
                         placeholder={formatMessage({id: 'search_bar.search', defaultMesage: 'Search'})}
                         height={27}
                         fontSize={14}
-                        textColor={theme.centerChannelColor}
+                        textColor={changeOpacity('#000', 0.5)}
                         hideBackground={true}
-                        textFieldBackgroundColor={changeOpacity(theme.centerChannelColor, 0.07)}
+                        textFieldBackgroundColor={'#fff'}
                         onChange={this.searchProfiles}
                         onSearchButtonPress={this.onSearchButtonPress}
                         onCancelButtonPress={this.cancelSearch}
diff --git a/app/scenes/channel_info/channel_info_header.js b/app/scenes/channel_info/channel_info_header.js
index 6841084e1..f0d521223 100644
--- a/app/scenes/channel_info/channel_info_header.js
+++ b/app/scenes/channel_info/channel_info_header.js
@@ -112,7 +112,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
         },
         createdBy: {
             flexDirection: 'row',
-            fontSize: 11,
+            fontSize: 12,
             marginTop: 5,
             color: changeOpacity(theme.centerChannelColor, 0.5),
             backgroundColor: 'transparent'
@@ -122,7 +122,7 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
             color: theme.centerChannelColor
         },
         header: {
-            fontSize: 12,
+            fontSize: 13,
             marginBottom: 10,
             color: theme.centerChannelColor,
             backgroundColor: 'transparent'
diff --git a/app/scenes/channel_info/channel_info_row.js b/app/scenes/channel_info/channel_info_row.js
index be0fd143b..39dcde605 100644
--- a/app/scenes/channel_info/channel_info_row.js
+++ b/app/scenes/channel_info/channel_info_row.js
@@ -52,7 +52,7 @@ function channelInfoRow(props) {
                 /> :
                 <Icon
                     name='angle-right'
-                    size={15}
+                    size={20}
                     style={style.rightIcon}
                 />
             }
diff --git a/app/scenes/channel_members/channel_members.js b/app/scenes/channel_members/channel_members.js
index eaea29218..e6ac81f7a 100644
--- a/app/scenes/channel_members/channel_members.js
+++ b/app/scenes/channel_members/channel_members.js
@@ -300,9 +300,9 @@ class ChannelMembers extends PureComponent {
                         placeholder={formatMessage({id: 'search_bar.search', defaultMesage: 'Search'})}
                         height={27}
                         fontSize={14}
-                        textColor={theme.centerChannelColor}
+                        textColor={changeOpacity('#000', 0.5)}
                         hideBackground={true}
-                        textFieldBackgroundColor={changeOpacity(theme.centerChannelColor, 0.07)}
+                        textFieldBackgroundColor={'#fff'}
                         onChange={this.searchProfiles}
                         onSearchButtonPress={this.onSearchButtonPress}
                         onCancelButtonPress={this.cancelSearch}
diff --git a/app/scenes/create_channel/create_channel.js b/app/scenes/create_channel/create_channel.js
index ee82dc420..3b7bcf523 100644
--- a/app/scenes/create_channel/create_channel.js
+++ b/app/scenes/create_channel/create_channel.js
@@ -232,7 +232,7 @@ class CreateChannel extends PureComponent {
                                 autoCapitalize='none'
                                 autoCorrect={false}
                                 placeholder={{id: 'channel_modal.nameEx', defaultMessage: 'E.g.: "Bugs", "Marketing", "客户支持"'}}
-                                placeholderTextColor={changeOpacity(theme.centerChannelColor, 0.4)}
+                                placeholderTextColor={changeOpacity('#000', 0.5)}
                                 underlineColorAndroid='transparent'
                             />
                         </View>
@@ -255,7 +255,7 @@ class CreateChannel extends PureComponent {
                                 onChangeText={this.onPurposeChangeText}
                                 style={[style.input, {height: 110}]}
                                 placeholder={{id: 'channel_modal.purposeEx', defaultMessage: 'E.g.: "A channel to file bugs and improvements"'}}
-                                placeholderTextColor={changeOpacity(theme.centerChannelColor, 0.4)}
+                                placeholderTextColor={changeOpacity('#000', 0.5)}
                                 multiline={true}
                                 underlineColorAndroid='transparent'
                             />
@@ -289,7 +289,7 @@ class CreateChannel extends PureComponent {
                                 onChangeText={this.onHeaderChangeText}
                                 style={[style.input, {height: 110}]}
                                 placeholder={{id: 'channel_modal.headerEx', defaultMessage: 'E.g.: "[Link Title](http://example.com)"'}}
-                                placeholderTextColor={changeOpacity(theme.centerChannelColor, 0.4)}
+                                placeholderTextColor={changeOpacity('#000', 0.5)}
                                 multiline={true}
                                 onFocus={this.scrollToEnd}
                                 underlineColorAndroid='transparent'
@@ -333,14 +333,10 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
         },
         inputContainer: {
             marginTop: 10,
-            borderTopWidth: 1,
-            borderBottomWidth: 1,
-            borderTopColor: changeOpacity(theme.centerChannelColor, 0.1),
-            borderBottomColor: changeOpacity(theme.centerChannelColor, 0.1),
-            backgroundColor: theme.centerChannelBg
+            backgroundColor: '#fff'
         },
         input: {
-            color: theme.centerChannelColor,
+            color: '#333',
             fontSize: 14,
             height: 40,
             paddingHorizontal: 15
diff --git a/app/scenes/more_channels/more_channels.js b/app/scenes/more_channels/more_channels.js
index a991be78e..7628d3e2b 100644
--- a/app/scenes/more_channels/more_channels.js
+++ b/app/scenes/more_channels/more_channels.js
@@ -254,9 +254,9 @@ class MoreChannels extends PureComponent {
                             placeholder={formatMessage({id: 'search_bar.search', defaultMesage: 'Search'})}
                             height={27}
                             fontSize={14}
-                            textColor={this.props.theme.centerChannelColor}
+                            textColor={changeOpacity('#000', 0.5)}
                             hideBackground={true}
-                            textFieldBackgroundColor={changeOpacity(this.props.theme.centerChannelColor, 0.07)}
+                            textFieldBackgroundColor={'#fff'}
                             onChange={this.searchProfiles}
                             onSearchButtonPress={this.onSearchButtonPress}
                             onCancelButtonPress={this.cancelSearch}
diff --git a/app/scenes/more_dms/more_dms.js b/app/scenes/more_dms/more_dms.js
index a45c4bd77..76feed5d9 100644
--- a/app/scenes/more_dms/more_dms.js
+++ b/app/scenes/more_dms/more_dms.js
@@ -202,9 +202,9 @@ class MoreDirectMessages extends PureComponent {
                             placeholder={formatMessage({id: 'search_bar.search', defaultMesage: 'Search'})}
                             height={27}
                             fontSize={14}
-                            textColor={this.props.theme.centerChannelColor}
+                            textColor={changeOpacity('#000', 0.5)}
                             hideBackground={true}
-                            textFieldBackgroundColor={changeOpacity(this.props.theme.centerChannelColor, 0.07)}
+                            textFieldBackgroundColor={'#fff'}
                             onChange={this.searchProfiles}
                             onSearchButtonPress={this.onSearchButtonPress}
                             onCancelButtonPress={this.cancelSearch}
diff --git a/app/scenes/settings/settings_item.js b/app/scenes/settings/settings_item.js
index b0a14bc1c..fdd743419 100644
--- a/app/scenes/settings/settings_item.js
+++ b/app/scenes/settings/settings_item.js
@@ -86,7 +86,9 @@ export default class SettingsItem extends PureComponent {
                     style={{flex: 1}}
                 >
                     <View style={style.wrapper}>
-                        {icon}
+                        <View style={style.iconContainer}>
+                            {icon}
+                        </View>
                         <FormattedText
                             id={i18nId}
                             defaultMessage={defaultMessage}
@@ -115,8 +117,14 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
             height: 50,
             paddingLeft: 16
         },
+        iconContainer: {
+            width: 18,
+            marginRight: 15,
+            alignItems: 'center',
+            justifyContent: 'center'
+        },
         icon: {
-            color: theme.linkColor,
+            color: changeOpacity(theme.centerChannelColor, 0.5),
             fontSize: 20
         },
         label: {