diff --git a/packages/material-ui/src/SvgIcon/SvgIcon.js b/packages/material-ui/src/SvgIcon/SvgIcon.js
index 6122927da41099..c88d23564e7dff 100644
--- a/packages/material-ui/src/SvgIcon/SvgIcon.js
+++ b/packages/material-ui/src/SvgIcon/SvgIcon.js
@@ -26,7 +26,7 @@ export const styles = theme => ({
   colorSecondary: {
     color: theme.palette.secondary.main,
   },
-  /* Styles applied to the root element if `color="saction"`. */
+  /* Styles applied to the root element if `color="action"`. */
   colorAction: {
     color: theme.palette.action.active,
   },
diff --git a/pages/api/svg-icon.md b/pages/api/svg-icon.md
index bb085a923f8863..4bea560323a75c 100644
--- a/pages/api/svg-icon.md
+++ b/pages/api/svg-icon.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">colorPrimary</span> | Styles applied to the root element if `color="primary"`.
 | <span class="prop-name">colorSecondary</span> | Styles applied to the root element if `color="secondary"`.
-| <span class="prop-name">colorAction</span> | Styles applied to the root element if `color="saction"`.
+| <span class="prop-name">colorAction</span> | Styles applied to the root element if `color="action"`.
 | <span class="prop-name">colorError</span> | Styles applied to the root element if `color="error"`.
 | <span class="prop-name">colorDisabled</span> | Styles applied to the root element if `color="disabled"`.
 | <span class="prop-name">fontSizeInherit</span> | Styles applied to the root element if `fontSize="inherit"`.