diff --git a/.rescriptsrc.js b/.rescriptsrc.js
index dbb89ff..0b08e5f 100644
--- a/.rescriptsrc.js
+++ b/.rescriptsrc.js
@@ -51,6 +51,17 @@ module.exports = [
             style: true,
           },
         ],
+        // babel optimizations for emotion styles
+        [
+          'emotion',
+          {
+            // sourceMap is on by default but source maps are dead code eliminated in production
+            sourceMap: true,
+            autoLabel: true,
+            labelFormat: 'x-[local]',
+            cssPropOptimization: true,
+          },
+        ],
         // adds support for live hot reload
         'react-hot-loader/babel',
       ],
diff --git a/package.json b/package.json
index 4acae24..f2725d5 100644
--- a/package.json
+++ b/package.json
@@ -70,6 +70,7 @@
     "@typescript-eslint/eslint-plugin": "^2.3.0",
     "@typescript-eslint/parser": "^2.3.0",
     "antd": "^3.23.3",
+    "babel-plugin-emotion": "^10.0.19",
     "babel-plugin-import": "^1.12.1",
     "codecov": "^3.6.1",
     "commitizen": "^4.0.3",
diff --git a/yarn.lock b/yarn.lock
index e7cc282..1de5e77 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3360,7 +3360,7 @@ babel-plugin-dynamic-import-node@2.3.0, babel-plugin-dynamic-import-node@^2.3.0:
   dependencies:
     object.assign "^4.1.0"
 
-babel-plugin-emotion@^10.0.14, babel-plugin-emotion@^10.0.17:
+babel-plugin-emotion@^10.0.14, babel-plugin-emotion@^10.0.17, babel-plugin-emotion@^10.0.19:
   version "10.0.19"
   resolved "https://registry.yarnpkg.com/babel-plugin-emotion/-/babel-plugin-emotion-10.0.19.tgz#67b9b213f7505c015f163a387a005c12c502b1de"
   integrity sha512-1pJb5uKN/gx6bi3gGr588Krj49sxARI9KmxhtMUa+NRJb6lR3OfC51mh3NlWRsOqdjWlT4cSjnZpnFq5K3T5ZA==