diff --git a/README.md b/README.md
index eea3345..28d0767 100644
--- a/README.md
+++ b/README.md
@@ -59,10 +59,11 @@ import { Animated, StyleSheet, Text, View, useWindowDimensions } from 'react-nat
 import { PageIndicator } from 'react-native-page-indicator';
 
 const pages = ['Page 1', 'Page 2', 'Page 3'];
+const rtl = false;
 
 const App = () => {
   const { width, height } = useWindowDimensions();
-  const scrollX = useRef(new Animated.Value(0)).current;
+  const scrollX = useRef(new Animated.Value(rtl ? width * (pages.length - 1) : 0)).current;
   const animatedCurrent = useRef(Animated.divide(scrollX, width)).current;
 
   return (
@@ -117,6 +118,7 @@ Prop | Type | Default | Description
 `current` | number \| Animated.Value | `0` | The current page index can be either a number or an animated value obtained from the scroll position
 `variant` | 'morse' \| 'beads' \| 'train' | `morse` | Pre-defined design variant
 `vertical` | boolean | `false` | When `true` the indicators will be stacked vertically
+`rtl` | boolean | `false` | When `true` right to left support will be enabled 
 `color` | string | `black` | Color of the indicators
 `activeColor` | string | | Optional color of the active indicator
 `gap` | number | `6` | Distance between the indicators
diff --git a/src/IndicatorMorse.tsx b/src/IndicatorMorse.tsx
index 8f5afac..0b3f9cb 100644
--- a/src/IndicatorMorse.tsx
+++ b/src/IndicatorMorse.tsx
@@ -10,6 +10,7 @@ interface IndicatorProps extends ViewProps {
   opacity: number;
   dashSize: number;
   vertical: boolean;
+  rtl: boolean;
   activeColor: string;
   borderRadius: number;
   animatedValue: Animated.Value | ReturnType<Animated.Value['interpolate']>;
@@ -24,6 +25,7 @@ const Indicator = ({
   opacity,
   dashSize,
   vertical,
+  rtl,
   activeColor,
   borderRadius,
   animatedValue,
@@ -46,7 +48,7 @@ const Indicator = ({
   });
 
   const wrapperStyles: Animated.AnimatedProps<ViewStyle> = {
-    flexDirection: vertical ? 'column' : 'row',
+    flexDirection: vertical ? 'column' : rtl ? 'row-reverse' :'row',
     opacity: animatedValue.interpolate({
       inputRange: [index - 1, index, index + 1],
       outputRange: [opacity, overlay ? 0 : 1, opacity],
@@ -85,15 +87,15 @@ const Indicator = ({
 
   const leftStyles: Animated.AnimatedProps<ViewStyle> = {
     ...commonStyle,
-    borderTopLeftRadius: borderRadius,
-    [vertical ? 'borderTopRightRadius' : 'borderBottomLeftRadius']: borderRadius,
+    [rtl ? 'borderTopRightRadius' : 'borderTopLeftRadius']: borderRadius,
+    [vertical ? 'borderTopRightRadius' : rtl ? 'borderBottomRightRadius' : 'borderBottomLeftRadius']: borderRadius,
     transform: [vertical ? { translateY: translateLeft } : { translateX: translateLeft }],
   };
 
   const rightStyles: Animated.AnimatedProps<ViewStyle> = {
     ...commonStyle,
-    borderBottomRightRadius: borderRadius,
-    [vertical ? 'borderBottomLeftRadius' : 'borderTopRightRadius']: borderRadius,
+    [rtl ? 'borderBottomLeftRadius' : 'borderBottomRightRadius']: borderRadius,
+    [vertical ? 'borderBottomLeftRadius' : rtl ? 'borderTopLeftRadius' : 'borderTopRightRadius']: borderRadius,
     transform: [vertical ? { translateY: translateRight } : { translateX: translateRight }],
   };
 
diff --git a/src/PageIndicator.tsx b/src/PageIndicator.tsx
index 95252d7..343ca3a 100644
--- a/src/PageIndicator.tsx
+++ b/src/PageIndicator.tsx
@@ -33,6 +33,7 @@ export interface PageIndicatorProps extends ViewProps {
   dashSize?: number;
   duration?: number;
   vertical?: boolean;
+  rtl?: boolean;
   activeColor?: string;
   borderRadius?: number;
   easing?: EasingFunction;
@@ -50,6 +51,7 @@ export const PageIndicator = ({
   dashSize,
   duration = 500,
   vertical = false,
+  rtl = false,
   activeColor = color,
   borderRadius,
   easing = Easing.out(Easing.cubic),
@@ -61,7 +63,7 @@ export const PageIndicator = ({
   const pixelBorderRadius = clamp(borderRadius ?? pixelSize / 2, 0, pixelSize / 2);
 
   const shouldAnimate = typeof current === 'number';
-  const flexDirection = vertical ? 'column' : 'row';
+  const flexDirection = vertical ? 'column' : rtl ? 'row-reverse' : 'row';
   const animatedValue = useRef(
     shouldAnimate ? new Animated.Value(clamp(current, 0, count)) : current,
   ).current;
@@ -99,6 +101,7 @@ export const PageIndicator = ({
             index={index}
             scale={scale}
             vertical={vertical}
+            rtl={rtl}
             activeColor={activeColor}
             opacity={clamp(opacity, 0, 1)}
             borderRadius={pixelBorderRadius}
@@ -112,6 +115,7 @@ export const PageIndicator = ({
             color={color}
             index={index}
             vertical={vertical}
+            rtl={rtl}
             activeColor={activeColor}
             dashSize={trainDashSize}
             opacity={clamp(opacity, 0, 1)}
@@ -127,6 +131,7 @@ export const PageIndicator = ({
             count={count}
             index={index}
             vertical={vertical}
+            rtl={rtl}
             activeColor={activeColor}
             dashSize={morseDashSize}
             opacity={clamp(opacity, 0, 1)}