diff --git a/16_Higher_Order_Component/16_higher_order_component.md b/16_Higher_Order_Component/16_higher_order_component.md
index ba6ad74898..54e4a65ce7 100644
--- a/16_Higher_Order_Component/16_higher_order_component.md
+++ b/16_Higher_Order_Component/16_higher_order_component.md
@@ -99,7 +99,7 @@ const Button = ({ onClick, text, style }) => {
   )
 }
 
-const buttonWithStyles = (CompParam, bgColor = 'default') => {
+const buttonWithStyles = (CompParam, name = 'default') => {
   const colors = [
     {
       name: 'default',
@@ -132,7 +132,7 @@ const buttonWithStyles = (CompParam, bgColor = 'default') => {
       color: '#ffffff',
     },
   ]
-  const { backgroundColor, color } = colors.find((c) => c.name === bgColor)
+  const { backgroundColor, color } = colors.find((c) => c.name === name)
 
   const buttonStyles = {
     backgroundColor,
@@ -170,7 +170,7 @@ class App extends Component {
           text='Info'
           onClick={() => alert('I am styled with info color')}
         />
-        <SuccessButton text='Success' onClick={() => alert('I am succesful')} />
+        <SuccessButton text='Success' onClick={() => alert('I am successful')} />
         <WarningButton
           text='Warning'
           onClick={() => alert('I warn you many times')}
diff --git a/16_Higher_Order_Component/16_higher_order_component_boilerplate/src/index.js b/16_Higher_Order_Component/16_higher_order_component_boilerplate/src/index.js
index 2815098f9b..0c00e00cc0 100644
--- a/16_Higher_Order_Component/16_higher_order_component_boilerplate/src/index.js
+++ b/16_Higher_Order_Component/16_higher_order_component_boilerplate/src/index.js
@@ -9,7 +9,7 @@ const Button = ({ onClick, text, style }) => {
   )
 }
 
-const buttonWithStyles = (CompParam, bgColor = 'default') => {
+const buttonWithStyles = (CompParam, name = 'default') => {
   const colors = [
     {
       name: 'default',
@@ -42,7 +42,7 @@ const buttonWithStyles = (CompParam, bgColor = 'default') => {
       color: '#ffffff',
     },
   ]
-  const { backgroundColor, color } = colors.find((c) => c.name === bgColor)
+  const { backgroundColor, color } = colors.find((c) => c.name === name)
 
   const buttonStyles = {
     backgroundColor,
@@ -81,7 +81,7 @@ class App extends Component {
           text='Info'
           onClick={() => alert('I am styled with info color')}
         />
-        <SuccessButton text='Success' onClick={() => alert('I am succesful')} />
+        <SuccessButton text='Success' onClick={() => alert('I am successful')} />
         <WarningButton
           text='Warning'
           onClick={() => alert('I warn you many times')}