diff --git a/demo/index.js b/demo/index.js
index f7ab576..d3ca7b8 100644
--- a/demo/index.js
+++ b/demo/index.js
@@ -8,7 +8,7 @@ import style from './style.less'
 
 ReactDOM.render((
    <BrowserRouter>
-      <OIO fontFamily="Helvetica Neue, sans-serif">
+      <OIO fontFamily="Helvetica Neue, sans-serif" nonce="cd7b0a50-f223-4aaf-9aee-44fbd8329c69">
          <div
             style={{
                position: 'absolute',
diff --git a/package-lock.json b/package-lock.json
index de62020..4ccd3f3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -303,6 +303,18 @@
         "@babel/plugin-syntax-class-properties": "^7.0.0"
       }
     },
+    "@babel/plugin-proposal-decorators": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.1.2.tgz",
+      "integrity": "sha512-YooynBO6PmBgHvAd0fl5e5Tq/a0pEC6RqF62ouafme8FzdIVH41Mz/u1dn8fFVm4jzEJ+g/MsOxouwybJPuP8Q==",
+      "dev": true,
+      "requires": {
+        "@babel/helper-plugin-utils": "^7.0.0",
+        "@babel/helper-replace-supers": "^7.1.0",
+        "@babel/helper-split-export-declaration": "^7.0.0",
+        "@babel/plugin-syntax-decorators": "^7.1.0"
+      }
+    },
     "@babel/plugin-proposal-export-default-from": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-export-default-from/-/plugin-proposal-export-default-from-7.0.0.tgz",
@@ -372,6 +384,15 @@
         "@babel/helper-plugin-utils": "^7.0.0"
       }
     },
+    "@babel/plugin-syntax-decorators": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.1.0.tgz",
+      "integrity": "sha512-uQvRSbgQ0nQg3jsmIixXXDCgSpkBolJ9X7NYThMKCcjvE8dN2uWJUzTUNNAeuKOjARTd+wUQV0ztXpgunZYKzQ==",
+      "dev": true,
+      "requires": {
+        "@babel/helper-plugin-utils": "^7.0.0"
+      }
+    },
     "@babel/plugin-syntax-export-default-from": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-export-default-from/-/plugin-syntax-export-default-from-7.0.0.tgz",
@@ -869,6 +890,32 @@
         }
       }
     },
+    "@emotion/cache": {
+      "version": "10.0.0-beta.12",
+      "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-10.0.0-beta.12.tgz",
+      "integrity": "sha512-OQapfLn4nRAOdlz3KGk3Y9XG2fbtHm5pwcxdX2JFu87RunRTX6ax0k7CBP2m6dovFUIF1KoYXD75eDb6JnNkeg==",
+      "dev": true,
+      "requires": {
+        "@emotion/sheet": "^0.9.1",
+        "@emotion/stylis": "^0.8.2",
+        "@emotion/utils": "^0.11.0",
+        "@emotion/weak-memoize": "0.2.1"
+      },
+      "dependencies": {
+        "@emotion/stylis": {
+          "version": "0.8.2",
+          "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.8.2.tgz",
+          "integrity": "sha512-vWYT1jFTotuno6NuGt6Og/MshA3XIaA2X5NGkZ+6msPOLLglVir2dHtcv15xpHQu4a13KRVAl76dIp29VpHu/g==",
+          "dev": true
+        },
+        "@emotion/utils": {
+          "version": "0.11.0",
+          "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.11.0.tgz",
+          "integrity": "sha512-jza6jgDw0vxv3VT8GMp3caWiir9Ee1gkV+UCMMHfXc+FDt9dbOoNc6wdhykW/tYmBFtYsB3yfsyHeK//3R6rKQ==",
+          "dev": true
+        }
+      }
+    },
     "@emotion/hash": {
       "version": "0.6.6",
       "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.6.6.tgz",
@@ -893,6 +940,12 @@
         "@emotion/utils": "^0.8.2"
       }
     },
+    "@emotion/sheet": {
+      "version": "0.9.1",
+      "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-0.9.1.tgz",
+      "integrity": "sha512-OvbOXQp+bSQB34Esl11VB1H29Mp2ViaQMMcAp/BOXtvnjPzQ0+piXzqNktmSz11mBLKBvkZwQXawDch1+Z4bGw==",
+      "dev": true
+    },
     "@emotion/stylis": {
       "version": "0.7.1",
       "resolved": "https://registry.npmjs.org/@emotion/stylis/-/stylis-0.7.1.tgz",
@@ -911,6 +964,12 @@
       "integrity": "sha512-rLu3wcBWH4P5q1CGoSSH/i9hrXs7SlbRLkoq9IGuoPYNGQvDJ3pt/wmOM+XgYjIDRMVIdkUWt0RsfzF50JfnCw==",
       "dev": true
     },
+    "@emotion/weak-memoize": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.1.tgz",
+      "integrity": "sha512-htUlKrSqptHULCFJfsSH7MdG6/k7ffkiu37DqOhmXsS+/9R7avdFdUrjUG6N/ls2qx8wOSXDof7bIVx+xnbIoA==",
+      "dev": true
+    },
     "@sheerun/mutationobserver-shim": {
       "version": "0.3.2",
       "resolved": "https://registry.npmjs.org/@sheerun/mutationobserver-shim/-/mutationobserver-shim-0.3.2.tgz",
@@ -3082,18 +3141,54 @@
       }
     },
     "create-emotion": {
-      "version": "9.2.12",
-      "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-9.2.12.tgz",
-      "integrity": "sha512-P57uOF9NL2y98Xrbl2OuiDQUZ30GVmASsv5fbsjF4Hlraip2kyAvMm+2PoYUvFFw03Fhgtxk3RqZSm2/qHL9hA==",
+      "version": "10.0.0-beta.12",
+      "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-10.0.0-beta.12.tgz",
+      "integrity": "sha512-2veCpg20BpjXAYqtU2NAAQFhCVUa/KR42jdPswWePzCYGqDkrDhgwuwdRYpWazC7C26Mf8K6QMsnztpoec5GBw==",
       "dev": true,
       "requires": {
-        "@emotion/hash": "^0.6.2",
-        "@emotion/memoize": "^0.6.1",
-        "@emotion/stylis": "^0.7.0",
-        "@emotion/unitless": "^0.6.2",
-        "csstype": "^2.5.2",
-        "stylis": "^3.5.0",
-        "stylis-rule-sheet": "^0.0.10"
+        "@emotion/cache": "10.0.0-beta.12",
+        "@emotion/serialize": "0.10.6",
+        "@emotion/sheet": "^0.9.1",
+        "@emotion/utils": "^0.11.0"
+      },
+      "dependencies": {
+        "@emotion/hash": {
+          "version": "0.7.0",
+          "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.7.0.tgz",
+          "integrity": "sha512-QgeU1fPmGTrb07IkuIl0+PcrnIz8UbkosC8tG3OEiTsqH1GPorqKZQzY2wA2dF8xX/I4XV0FQ1UaOwd18sIHIw==",
+          "dev": true
+        },
+        "@emotion/memoize": {
+          "version": "0.7.0",
+          "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.0.tgz",
+          "integrity": "sha512-oRzLa0T0ZvZhlpRwNeBq4U5SyFtb8e5kPkoMWtrTMmFoWu8A6xMGQjN2zaka4dA+d9771xGUVQ4uTLJeCurNaQ==",
+          "dev": true
+        },
+        "@emotion/serialize": {
+          "version": "0.10.6",
+          "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-0.10.6.tgz",
+          "integrity": "sha512-fOk0GX9pAPvaltNyJ8JVp7j0KWhPRbUic9xxuy+DutHrPrluNk+v81e3Xm/Iw/gXI9W6y5uznFj1Z8jMIJmXJg==",
+          "dev": true,
+          "requires": {
+            "@emotion/hash": "^0.7.0",
+            "@emotion/memoize": "^0.7.0",
+            "@emotion/unitless": "^0.7.2",
+            "@emotion/utils": "^0.11.0",
+            "csstype": "^2.5.7"
+          }
+        },
+        "@emotion/unitless": {
+          "version": "0.7.2",
+          "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.2.tgz",
+          "integrity": "sha512-mK4SHgIiJiwRZyenDXlaLUdR7vm8xUvJ4VYmpWNTDtF3ykEbI1XNVcbhAZwt07xjtCvLenoJMP8Eqx1FXvoWDQ==",
+          "dev": true
+        },
+        "@emotion/utils": {
+          "version": "0.11.0",
+          "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-0.11.0.tgz",
+          "integrity": "sha512-jza6jgDw0vxv3VT8GMp3caWiir9Ee1gkV+UCMMHfXc+FDt9dbOoNc6wdhykW/tYmBFtYsB3yfsyHeK//3R6rKQ==",
+          "dev": true
+        }
       }
     },
     "create-hash": {
@@ -3577,6 +3672,23 @@
       "requires": {
         "babel-plugin-emotion": "^9.1.0",
         "create-emotion": "^9.1.1"
+      },
+      "dependencies": {
+        "create-emotion": {
+          "version": "9.2.12",
+          "resolved": "https://registry.npmjs.org/create-emotion/-/create-emotion-9.2.12.tgz",
+          "integrity": "sha512-P57uOF9NL2y98Xrbl2OuiDQUZ30GVmASsv5fbsjF4Hlraip2kyAvMm+2PoYUvFFw03Fhgtxk3RqZSm2/qHL9hA==",
+          "dev": true,
+          "requires": {
+            "@emotion/hash": "^0.6.2",
+            "@emotion/memoize": "^0.6.1",
+            "@emotion/stylis": "^0.7.0",
+            "@emotion/unitless": "^0.6.2",
+            "csstype": "^2.5.2",
+            "stylis": "^3.5.0",
+            "stylis-rule-sheet": "^0.0.10"
+          }
+        }
       }
     },
     "encodeurl": {
diff --git a/package.json b/package.json
index c230a1e..1a0c9d1 100644
--- a/package.json
+++ b/package.json
@@ -42,8 +42,8 @@
     "babel-jest": "23.6.0",
     "babel-loader": "8.0.4",
     "classnames": "2.2.6",
+    "create-emotion": "10.0.0-beta.12",
     "css-loader": "1.0.1",
-    "emotion": "9.1.1",
     "eslint-config-mother": "2.0.11",
     "eslint-plugin-jest": "21.27.1",
     "express": "4.16.4",
diff --git a/src/OIO/context.js b/src/OIO/context.js
index 36db4b4..a869a7a 100644
--- a/src/OIO/context.js
+++ b/src/OIO/context.js
@@ -2,10 +2,11 @@ import React from 'react'
 
 const OIOContext = React.createContext()
 
+// TODO: CLEAN THIS UP
 const withOIOContext = WrappedComponent => props => (
    <OIOContext.Consumer>
-      {theme => (
-         <WrappedComponent {...props} OIOContext={theme} />
+      {({ emotion, ...theme }) => (
+         <WrappedComponent {...props} emotion={emotion} OIOContext={theme} />
       )}
    </OIOContext.Consumer>
 )
diff --git a/src/OIO/index.js b/src/OIO/index.js
index cee72ac..4ffc4c3 100644
--- a/src/OIO/index.js
+++ b/src/OIO/index.js
@@ -1,12 +1,9 @@
 import React, { Component } from 'react'
-import { injectGlobal } from 'emotion'
+import createEmotion from 'create-emotion'
 import PropTypes from 'prop-types'
 import { OIOContext } from './context'
 import normalize from './normalize'
 
-// Normalize
-injectGlobal`${normalize}` // eslint-disable-line no-unused-expressions
-
 export default class OIO extends Component {
    static propTypes = {
       children: PropTypes.node,
@@ -14,6 +11,7 @@ export default class OIO extends Component {
       fontFamily: PropTypes.string,
       fontSize: PropTypes.string,
       fontWeights: PropTypes.object,
+      nonce: PropTypes.string,
       style: PropTypes.object,
       textSizeScaleRatio: PropTypes.number,
       textSizeMultiplier: PropTypes.number
@@ -31,11 +29,24 @@ export default class OIO extends Component {
          semibold: '600',
          bold: '700'
       },
+      nonce: undefined,
       style: {},
       textSizeScaleRatio: 1.125,
       textSizeMultiplier: 1
    }
 
+   constructor(props) {
+      super(props)
+      this.emotion = createEmotion({
+         nonce: props.nonce
+      })
+
+      // eslint-disable-next-line no-unused-expressions
+      this.emotion.injectGlobal`${normalize}`
+   }
+
+   emotion = null
+
    render() {
       const {
          children,
@@ -49,6 +60,7 @@ export default class OIO extends Component {
       } = this.props
 
       const contextProps = {
+         emotion: this.emotion,
          fontFamily,
          fontSize,
          fontWeights,
diff --git a/src/Text/index.js b/src/Text/index.js
index 45ba32e..46af6af 100644
--- a/src/Text/index.js
+++ b/src/Text/index.js
@@ -7,7 +7,6 @@
 // =======================================================
 
 import React, { Component } from 'react'
-import { css, cx } from 'emotion'
 import PropTypes from 'prop-types'
 import { withOIOContext } from '../OIO/context'
 import generateStyleObject from '../utils/generateStyleObject'
@@ -60,6 +59,8 @@ export default class Text extends Component {
       children: PropTypes.node,
       className: PropTypes.string,
       color: PropTypes.string,
+      // TODO: USE REAL EMOTION INSTANCE
+      emotion: PropTypes.object.isRequired,
       fontFamily: PropTypes.string,
       generatedStyleObject: PropTypes.object.isRequired,
       lineHeight: PropTypes.string,
@@ -84,6 +85,7 @@ export default class Text extends Component {
    }
 
    render() {
+      const { css, cx } = this.props.emotion
       const styles = {
          ...this.props.style,
          ...this.props.generatedStyleObject