diff --git a/packages/extension-ui/src/components/Header.tsx b/packages/extension-ui/src/components/Header.tsx
index 11d7960d..bbbc6017 100644
--- a/packages/extension-ui/src/components/Header.tsx
+++ b/packages/extension-ui/src/components/Header.tsx
@@ -27,7 +27,7 @@ export default styled(Header)`
   color: ${defaults.hdrColor};
   font-family: ${defaults.fontFamily};
   font-weight: normal;
-  margin: 0 -0.75rem;
-  padding: 0.5rem 1rem;
+  margin: 0 -1rem;
+  padding: 0.75rem 1rem;
   text-transform: uppercase;
 `;
diff --git a/packages/extension-ui/src/components/Tip.tsx b/packages/extension-ui/src/components/Tip.tsx
index 72db6472..2afda210 100644
--- a/packages/extension-ui/src/components/Tip.tsx
+++ b/packages/extension-ui/src/components/Tip.tsx
@@ -46,8 +46,8 @@ export default styled(Tip)`
   color: ${(props) =>
     getColor(props).color
   };
-  margin: ${defaults.boxMargin};
-  padding: 1rem 1.25rem;
+  margin: 0.75rem -1rem;
+  padding: 1rem 1.5rem;
 
   h3 {
     color: ${(props) =>
diff --git a/packages/extension-ui/src/components/defaults.ts b/packages/extension-ui/src/components/defaults.ts
index 68c1c991..be7c7627 100644
--- a/packages/extension-ui/src/components/defaults.ts
+++ b/packages/extension-ui/src/components/defaults.ts
@@ -3,14 +3,15 @@
 // of the Apache-2.0 license. See the LICENSE file for details.
 
 const DANGER_COLOR = '#c00';
+const LABEL_COLOR = '#878786';
 const LINK_COLOR = '#3367d6';
-const TEXT_COLOR = '#4e4e4e';
+const TEXT_COLOR = '#4d4e4f';
 
 const defaults: { [index: string]: any } = {
   borderRadius: '0.25rem',
-  btnBg: LINK_COLOR,
+  btnBg: TEXT_COLOR, // LINK_COLOR,
   btnBgDanger: DANGER_COLOR,
-  btnBorder: `0px solid `,
+  btnBorder: `0 solid `,
   btnColor: '#fff',
   btnColorDanger: '#fff',
   btnPadding: '0.75rem 1rem',
@@ -21,11 +22,11 @@ const defaults: { [index: string]: any } = {
   color: TEXT_COLOR,
   fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif',
   fontSize: '1rem',
-  hdrBg: '#e2e1e0',
-  hdrColor: '#878786',
+  hdrBg: 'transparent', // '#f5f6f7',
+  hdrColor: LABEL_COLOR,
   inputBorder: '#ccc',
   inputPadding: '0.5rem 0.75rem',
-  labelColor: '878786',
+  labelColor: LABEL_COLOR,
   lineHeight: '1.25',
   linkColor: LINK_COLOR,
   linkColorDanger: DANGER_COLOR,
diff --git a/packages/extension/public/popup.html b/packages/extension/public/popup.html
index 43c78b03..8c5e260e 100644
--- a/packages/extension/public/popup.html
+++ b/packages/extension/public/popup.html
@@ -4,7 +4,7 @@
     <meta charset="utf-8">
     <title>polkadot{.js}</title>
   </head>
-  <body style="background:#e2e1e0; box-sizing:border-box; height:580px; margin:0; padding:0 0.75rem; width:480px;">
+  <body style="background:#f5f6f7; box-sizing:border-box; height:580px; margin:0; padding:0 1rem; width:480px;">
     <div id="root"></div>
     <script src='./popup.js'></script>
   </body>