diff --git a/demo/styles/demo.css b/demo/styles/demo.css
index d674b76e2..238e037c4 100644
--- a/demo/styles/demo.css
+++ b/demo/styles/demo.css
@@ -2,7 +2,6 @@
 
 body {
   overflow: hidden;
-  -webkit-text-size-adjust: 100%;
 }
 
 @media only screen and (max-width: 639px) {
diff --git a/src/_styles/global/index.cssr.ts b/src/_styles/global/index.cssr.ts
index 0ae241509..ce497591c 100644
--- a/src/_styles/global/index.cssr.ts
+++ b/src/_styles/global/index.cssr.ts
@@ -1,13 +1,20 @@
 import { c } from '../../_utils/cssr'
 import commonVariables from '../common/_common'
 
-export default c('body', {
-  margin: 0,
-  fontSize: commonVariables.fontSize,
-  fontFamily: commonVariables.fontFamily
-}, [
-  c('input', {
-    fontFamily: 'inherit',
-    fontSize: 'inherit'
-  })
+// All the components need the style
+// It is static and won't be changed in the app's lifetime
+// If user want to overrides it `n-global-style` is provided
+//
+// Technically we can remove font-size & font-family to make
+// it pure. I'm not sure whether to do it.
+export default c('body', `
+  margin: 0;
+  font-size: ${commonVariables.fontSize};
+  font-family: ${commonVariables.fontFamily};
+  -webkit-text-size-adjust: 100%;
+`, [
+  c('input', `
+    font-family: inherit;
+    font-size: inherit;
+  `)
 ])