diff --git a/package-lock.json b/package-lock.json
index 063def0..3e7ddab 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -7289,9 +7289,9 @@
       }
     },
     "babel-plugin-styled-components": {
-      "version": "1.10.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.6.tgz",
-      "integrity": "sha512-gyQj/Zf1kQti66100PhrCRjI5ldjaze9O0M3emXRPAN80Zsf8+e1thpTpaXJXVHXtaM4/+dJEgZHyS9Its+8SA==",
+      "version": "1.10.7",
+      "resolved": "https://registry.npmjs.org/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.7.tgz",
+      "integrity": "sha512-MBMHGcIA22996n9hZRf/UJLVVgkEOITuR2SvjHLb5dSTUyR4ZRGn+ngITapes36FI3WLxZHfRhkA1ffHxihOrg==",
       "dev": true,
       "requires": {
         "@babel/helper-annotate-as-pure": "^7.0.0",
@@ -10627,14 +10627,22 @@
       }
     },
     "css-to-react-native": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-2.3.2.tgz",
-      "integrity": "sha512-VOFaeZA053BqvvvqIA8c9n0+9vFppVBAHCp6JgFTtTMU3Mzi+XnelJ9XC9ul3BqFzZyQ5N+H0SnwsWT2Ebchxw==",
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.0.0.tgz",
+      "integrity": "sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ==",
       "dev": true,
       "requires": {
         "camelize": "^1.0.0",
         "css-color-keywords": "^1.0.0",
-        "postcss-value-parser": "^3.3.0"
+        "postcss-value-parser": "^4.0.2"
+      },
+      "dependencies": {
+        "postcss-value-parser": {
+          "version": "4.0.2",
+          "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.0.2.tgz",
+          "integrity": "sha512-LmeoohTpp/K4UiyQCwuGWlONxXamGzCMtFxLq4W1nZVGIQLYvMCJx3yAF9qyyuFpflABI9yVdtJAqbihOsCsJQ==",
+          "dev": true
+        }
       }
     },
     "css-tree": {
@@ -15873,12 +15881,6 @@
       "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
       "dev": true
     },
-    "is-what": {
-      "version": "3.5.1",
-      "resolved": "https://registry.npmjs.org/is-what/-/is-what-3.5.1.tgz",
-      "integrity": "sha512-NHeqazf97ZVerGNEDmYG4+J4UY3uDQOjaJNMIMXw2i/tFfMconSgSK8Z27Y4VWMbM96E9ylroUSnD7jXRjzBwA==",
-      "dev": true
-    },
     "is-whitespace-character": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/is-whitespace-character/-/is-whitespace-character-1.0.3.tgz",
@@ -19627,15 +19629,6 @@
         "trim-newlines": "^1.0.0"
       }
     },
-    "merge-anything": {
-      "version": "2.4.4",
-      "resolved": "https://registry.npmjs.org/merge-anything/-/merge-anything-2.4.4.tgz",
-      "integrity": "sha512-l5XlriUDJKQT12bH+rVhAHjwIuXWdAIecGwsYjv2LJo+dA1AeRTmeQS+3QBpO6lEthBMDi2IUMpLC1yyRvGlwQ==",
-      "dev": true,
-      "requires": {
-        "is-what": "^3.3.1"
-      }
-    },
     "merge-deep": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/merge-deep/-/merge-deep-3.0.2.tgz",
@@ -26140,23 +26133,20 @@
       }
     },
     "styled-components": {
-      "version": "4.4.1",
-      "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-4.4.1.tgz",
-      "integrity": "sha512-RNqj14kYzw++6Sr38n7197xG33ipEOktGElty4I70IKzQF1jzaD1U4xQ+Ny/i03UUhHlC5NWEO+d8olRCDji6g==",
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-5.0.0.tgz",
+      "integrity": "sha512-F7VhIXIbUXJ8KO3pU9wap2Hxdtqa6PZ1uHrx+YXTgRjyxGlwvBHb8LULXPabmDA+uEliTXRJM5WcZntJnKNn3g==",
       "dev": true,
       "requires": {
         "@babel/helper-module-imports": "^7.0.0",
-        "@babel/traverse": "^7.0.0",
-        "@emotion/is-prop-valid": "^0.8.1",
-        "@emotion/unitless": "^0.7.0",
+        "@babel/traverse": "^7.4.5",
+        "@emotion/is-prop-valid": "^0.8.3",
+        "@emotion/stylis": "^0.8.4",
+        "@emotion/unitless": "^0.7.4",
         "babel-plugin-styled-components": ">= 1",
-        "css-to-react-native": "^2.2.2",
-        "memoize-one": "^5.0.0",
-        "merge-anything": "^2.2.4",
-        "prop-types": "^15.5.4",
-        "react-is": "^16.6.0",
-        "stylis": "^3.5.0",
-        "stylis-rule-sheet": "^0.0.10",
+        "css-to-react-native": "^3.0.0",
+        "hoist-non-react-statics": "^3.0.0",
+        "shallowequal": "^1.1.0",
         "supports-color": "^5.5.0"
       },
       "dependencies": {
@@ -26191,18 +26181,6 @@
         "object-assign": "^4.1.1"
       }
     },
-    "stylis": {
-      "version": "3.5.4",
-      "resolved": "https://registry.npmjs.org/stylis/-/stylis-3.5.4.tgz",
-      "integrity": "sha512-8/3pSmthWM7lsPBKv7NXkzn2Uc9W7NotcwGNpJaa3k7WMM1XDCA4MgT5k/8BIexd5ydZdboXtU90XH9Ec4Bv/Q==",
-      "dev": true
-    },
-    "stylis-rule-sheet": {
-      "version": "0.0.10",
-      "resolved": "https://registry.npmjs.org/stylis-rule-sheet/-/stylis-rule-sheet-0.0.10.tgz",
-      "integrity": "sha512-nTbZoaqoBnmK+ptANthb10ZRZOGC+EmTLLUxeYIuHNkEKcmKgXX1XWKkUBT2Ac4es3NybooPe0SmvKdhKJZAuw==",
-      "dev": true
-    },
     "supports-color": {
       "version": "6.1.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
diff --git a/package.json b/package.json
index 1850468..5d3a85e 100644
--- a/package.json
+++ b/package.json
@@ -36,7 +36,7 @@
   },
   "peerDependencies": {
     "react": "16.x",
-    "styled-components": ">= 4"
+    "styled-components": ">= 5"
   },
   "devDependencies": {
     "@percy/storybook": "^3.2.0",
@@ -67,7 +67,7 @@
     "nwb": "0.23.x",
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
-    "styled-components": "^4.4.1"
+    "styled-components": "^5.0.0"
   },
   "author": "",
   "homepage": "",
diff --git a/src/components/Button/Button.jsx b/src/components/Button/Button.jsx
index 6b8752d..b58a56d 100644
--- a/src/components/Button/Button.jsx
+++ b/src/components/Button/Button.jsx
@@ -37,26 +37,25 @@ const Button = ({
   // 以下為另外處理的 props
   children, icon, iconPos, testId,
 }) => (
-  <ThemeProvider theme={theme}>
-    <StyledButton
-      block={block}
-      brand={brand}
-      className={className}
-      data-test-id={testId}
-      disabled={disabled}
-      href={href}
-      htmlType={htmlType}
-      loading={loading}
-      onClick={onClick}
-      size={size}
-      target={target}
-      type={type}
-    >
-      {icon && iconPos === 'left' && <Icon type={icon} />}
-      {children}
-      {icon && iconPos === 'right' && <Icon type={icon} />}
-    </StyledButton>
-  </ThemeProvider>
+  <StyledButton
+    block={block}
+    brand={brand}
+    className={className}
+    data-test-id={testId}
+    disabled={disabled}
+    href={href}
+    htmlType={htmlType}
+    loading={loading}
+    onClick={onClick}
+    size={size}
+    target={target}
+    theme={theme}
+    type={type}
+  >
+    {icon && iconPos === 'left' && <Icon type={icon} />}
+    {children}
+    {icon && iconPos === 'right' && <Icon type={icon} />}
+  </StyledButton>
 );
 
 Button.propTypes = {