diff --git a/src/packages/tour/classNames.ts b/src/packages/tour/classNames.ts
index 08515c1db..080c859e1 100644
--- a/src/packages/tour/classNames.ts
+++ b/src/packages/tour/classNames.ts
@@ -24,3 +24,4 @@ export const activeClassName = "active";
 export const fixedTooltipClassName = "introjs-fixedTooltip";
 export const floatingElementClassName = "introjsFloatingElement";
 export const showElementClassName = "introjs-showElement";
+export const exitButtonClassName = "introjs-exitButton";
diff --git a/src/packages/tour/components/TourRoot.ts b/src/packages/tour/components/TourRoot.ts
index 3fb2517bc..d6f198198 100644
--- a/src/packages/tour/components/TourRoot.ts
+++ b/src/packages/tour/components/TourRoot.ts
@@ -123,6 +123,12 @@ export const TourRoot = ({ tour }: TourRootProps) => {
 
           await tour.exit();
         },
+        
+       exitLabel: tour.getOption("exitLabel"),
+       onExitClick: () => {
+         tour.callback("complete")?.call(tour, tour.getCurrentStep(), "exit");
+         tour.exit();
+       },
         buttonClass: tour.getOption("buttonClass"),
         nextToDone: tour.getOption("nextToDone"),
         doneLabel: tour.getOption("doneLabel"),
diff --git a/src/packages/tour/components/TourTooltip.ts b/src/packages/tour/components/TourTooltip.ts
index 3b938cba0..8f93dd773 100644
--- a/src/packages/tour/components/TourTooltip.ts
+++ b/src/packages/tour/components/TourTooltip.ts
@@ -10,6 +10,7 @@ import {
   helperNumberLayerClassName,
   hiddenButtonClassName,
   nextButtonClassName,
+  exitButtonClassName,
   previousButtonClassName,
   progressBarClassName,
   progressClassName,
@@ -217,6 +218,25 @@ const NextButton = ({
   return nextButton;
 };
 
+const ExitButton = ({
+  label,
+  onClick,
+  buttonClass,
+}: {
+  label: string;
+  onClick: (e: any) => void;
+  buttonClass: string;
+}) => {
+  return Button({
+    label,
+    onClick,
+    className: () => {
+      return [buttonClass, exitButtonClassName].filter(Boolean).join(" ");
+    },
+  });
+};
+
+
 const PrevButton = ({
   label,
   steps,
@@ -279,6 +299,9 @@ const Buttons = ({
   nextLabel,
   onNextClick,
 
+  exitLabel,
+  onExitClick,
+
   hidePrev,
   prevLabel,
   onPrevClick,
@@ -295,12 +318,21 @@ const Buttons = ({
   nextLabel: string;
   onNextClick: (e: any) => void;
 
+  exitLabel: string;
+  onExitClick: (e: any) => void;
+  
+
   hidePrev: boolean;
   prevLabel: string;
   onPrevClick: (e: any) => void;
 }) => {
   return div(
-    { className: tooltipButtonsClassName },
+    { className: tooltipButtonsClassName },[
+       ExitButton({
+    label: exitLabel,
+    onClick: onExitClick, 
+    buttonClass,
+  }),
     steps.length > 1
       ? PrevButton({
           label: prevLabel,
@@ -323,7 +355,7 @@ const Buttons = ({
       nextToDone,
       buttonClass,
     })
-  );
+  ]);
 };
 
 export const Header = ({
@@ -392,6 +424,8 @@ export type TourTooltipProps = Omit<
   onNextClick: (e: any) => void;
   prevLabel: string;
   onPrevClick: (e: any) => void;
+  exitLabel: string;
+  onExitClick: (e: any) => void;
   skipLabel: string;
   onSkipClick: (e: any) => void;
   buttonClass: string;
@@ -436,6 +470,8 @@ export const TourTooltip = ({
   doneLabel,
   hideNext,
   hidePrev,
+  exitLabel,
+  onExitClick,
 
   progress,
   progressBarAdditionalClass,
@@ -494,6 +530,9 @@ export const TourTooltip = ({
         nextLabel: nextLabel,
         onNextClick: onNextClick,
 
+        exitLabel: exitLabel,
+        onExitClick: onExitClick,
+
         prevLabel: prevLabel,
         onPrevClick: onPrevClick,
 
diff --git a/src/packages/tour/option.ts b/src/packages/tour/option.ts
index f24c904f2..fc7281d86 100644
--- a/src/packages/tour/option.ts
+++ b/src/packages/tour/option.ts
@@ -11,6 +11,8 @@ export interface TourOptions {
   prevLabel: string;
   /* Skip button label in tooltip box */
   skipLabel: string;
+  /* Exit button label in tooltip box */
+  exitLabel: string;
   /* Done button label in tooltip box */
   doneLabel: string;
   /* Hide previous button in the first step? Otherwise, it will be disabled button. */
@@ -83,6 +85,7 @@ export function getDefaultTourOptions(): TourOptions {
     nextLabel: "Next",
     prevLabel: "Back",
     skipLabel: "×",
+    exitLabel: "Exit",
     doneLabel: "Done",
     hidePrev: false,
     hideNext: false,
diff --git a/src/styles/introjs-rtl.scss b/src/styles/introjs-rtl.scss
index e1d249963..04949d293 100644
--- a/src/styles/introjs-rtl.scss
+++ b/src/styles/introjs-rtl.scss
@@ -1,5 +1,6 @@
 .introjs-tooltipbuttons {
-  text-align: left;
+  text-align: center; 
+  direction: rtl;     
 }
 
 .introjs-skipbutton {
@@ -11,12 +12,12 @@
   direction: rtl;
 }
 
-.introjs-prevbutton {
-  float: right;
-}
-
-.introjs-nextbutton {
-  float: left;
+.introjs-prevbutton,
+.introjs-nextbutton,
+.introjs-exitButton {
+  float: none;              
+  display: inline-block;    
+  margin: 0 10px;          
 }
 
 .introjs-bullets {
diff --git a/src/styles/introjs.scss b/src/styles/introjs.scss
index 087aefe05..7ec695abb 100644
--- a/src/styles/introjs.scss
+++ b/src/styles/introjs.scss
@@ -225,7 +225,7 @@ tr.introjs-showElement {
 .introjs-tooltipbuttons {
   border-top: 1px solid $black300;
   padding: 10px;
-  text-align: right;
+  text-align: center;
   white-space: nowrap;
 
   &:after {
@@ -313,12 +313,12 @@ tr.introjs-showElement {
   }
 }
 
-.introjs-prevbutton {
-  float: left;
-}
-
-.introjs-nextbutton {
-  float: right;
+.introjs-prevbutton,
+.introjs-nextbutton,
+.introjs-exitButton {
+  float: none;            
+  display: inline-block;   
+  margin: 0 10px;          
 }
 
 .introjs-disabled {
diff --git a/tests/jest/helper.ts b/tests/jest/helper.ts
index c996f659e..8e692fb3f 100644
--- a/tests/jest/helper.ts
+++ b/tests/jest/helper.ts
@@ -37,6 +37,9 @@ export function skipButton() {
 export function nextButton() {
   return find(".introjs-nextbutton");
 }
+export function exitButton() {
+  return find(".introjs-exitButton");
+}
 
 export function prevButton() {
   return find(".introjs-prevbutton");
diff --git a/themes/introjs-flattener.css b/themes/introjs-flattener.css
index 4c8fd6797..61e296bd5 100644
--- a/themes/introjs-flattener.css
+++ b/themes/introjs-flattener.css
@@ -50,6 +50,11 @@
   border-radius: 0 .2em .2em 0;
 }
 
+.introjs-exitButton {
+  border-radius: 0 .2em .2em 0;
+}
+
+
 .introjs-button:hover, .introjs-button:focus {
   background: #2c3e50;
   color: #fff;