diff --git a/package.json b/package.json
index 081f48a..2a046dc 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@observation.org/react-native-components",
-  "version": "1.38.0",
+  "version": "1.39.0",
   "main": "src/index.ts",
   "repository": "git@github.com:observation/react-native-components.git",
   "author": "Observation.org",
diff --git a/src/components/Lightbox.tsx b/src/components/Lightbox.tsx
index d0db34d..ddd3311 100644
--- a/src/components/Lightbox.tsx
+++ b/src/components/Lightbox.tsx
@@ -42,6 +42,7 @@ const getLightboxFooterComponent =
     content?: React.ReactNode,
     style?: LightboxStyle,
     onPressDelete?: () => void,
+    onPressCrop?: () => void,
   ) =>
   () => (
     <SafeAreaView style={styles.lightboxFooterContainer}>
@@ -57,13 +58,22 @@ const getLightboxFooterComponent =
           </View>
         )}
         {content && <View style={styles.footerItem}>{content}</View>}
-        {onPressDelete && (
+        {(onPressDelete || onPressCrop) && (
           <View style={styles.buttonsContainer}>
-            <View style={styles.buttonContainer}>
-              <TouchableOpacity onPress={onPressDelete} hitSlop={hitSlop}>
-                <Icon name="trash-alt" color={theme.color.white} size={20} testID="delete-photo" />
-              </TouchableOpacity>
-            </View>
+            {onPressDelete && (
+              <View style={styles.buttonContainer}>
+                <TouchableOpacity onPress={onPressDelete} hitSlop={hitSlop}>
+                  <Icon name="trash-alt" color={theme.color.white} size={20} testID="delete-photo" />
+                </TouchableOpacity>
+              </View>
+            )}
+            {onPressCrop && (
+              <View style={styles.buttonContainer}>
+                <TouchableOpacity onPress={onPressCrop} hitSlop={hitSlop}>
+                  <Icon name="crop-alt" color={theme.color.white} size={20} testID="crop-photo" />
+                </TouchableOpacity>
+              </View>
+            )}
           </View>
         )}
       </View>
@@ -78,6 +88,7 @@ type Props = {
   index?: number
   onClose: () => void
   onDelete?: (imageIndex: number) => void
+  onCrop?: (imageIndex: number) => void
   photos: string[]
   title?: string
   description?: string
@@ -85,11 +96,12 @@ type Props = {
   style?: LightboxStyle
 }
 
-const Lightbox = ({ index, onClose, onDelete, photos, title, description, content, style }: Props) => {
+const Lightbox = ({ index, onClose, onDelete, onCrop, photos, title, description, content, style }: Props) => {
   const initialImageIndex = index ?? 0
   const [currentImageIndex, setCurrentImageIndex] = useState<number>()
 
   const onPressDelete = onDelete ? () => onDelete(currentImageIndex ?? initialImageIndex) : undefined
+  const onPressCrop = onCrop ? () => onCrop(currentImageIndex ?? initialImageIndex) : undefined
 
   return (
     <ImageView
@@ -100,7 +112,7 @@ const Lightbox = ({ index, onClose, onDelete, photos, title, description, conten
       onImageIndexChange={setCurrentImageIndex}
       onRequestClose={onClose}
       HeaderComponent={getLightboxHeaderComponent(photos.length, onClose)}
-      FooterComponent={getLightboxFooterComponent(title, description, content, style, onPressDelete)}
+      FooterComponent={getLightboxFooterComponent(title, description, content, style, onPressDelete, onPressCrop)}
     />
   )
 }
diff --git a/src/components/__tests__/Lightbox.test.tsx b/src/components/__tests__/Lightbox.test.tsx
index 1d58f26..e9b4875 100644
--- a/src/components/__tests__/Lightbox.test.tsx
+++ b/src/components/__tests__/Lightbox.test.tsx
@@ -77,6 +77,15 @@ describe('Lightbox', () => {
       expect(queryByTestId('delete-photo')).not.toBeNull()
       expect(toJSON()).toMatchSnapshot()
     })
+
+    test('With a crop button', () => {
+      const { toJSON, queryByTestId } = render(
+        <Lightbox photos={photos} index={0} onClose={onClose} onCrop={() => {}} />,
+      )
+
+      expect(queryByTestId('crop-photo')).not.toBeNull()
+      expect(toJSON()).toMatchSnapshot()
+    })
   })
 
   describe('Interaction', () => {
@@ -103,6 +112,18 @@ describe('Lightbox', () => {
       expect(onDelete).toHaveBeenCalledWith(0)
     })
 
+    test('Press crop button calls onCrop', async () => {
+      // GIVEN
+      const onCrop = jest.fn()
+      const { getByTestId } = render(<Lightbox photos={photos} index={0} onClose={onClose} onCrop={onCrop} />)
+
+      // WHEN
+      await fireEvent.press(getByTestId('crop-photo'))
+
+      // THEN
+      expect(onCrop).toHaveBeenCalledWith(0)
+    })
+
     test('When swiping to the second photo and pressing the delete button, onDelete is called with the second photo', async () => {
       // GIVEN
       jest.mock('@observation.org/react-native-image-viewing', () => 'ImageCarousel')
diff --git a/src/components/__tests__/__snapshots__/Lightbox.test.tsx.snap b/src/components/__tests__/__snapshots__/Lightbox.test.tsx.snap
index e9939df..8a78956 100644
--- a/src/components/__tests__/__snapshots__/Lightbox.test.tsx.snap
+++ b/src/components/__tests__/__snapshots__/Lightbox.test.tsx.snap
@@ -1599,6 +1599,437 @@ exports[`Lightbox Rendering Second photo 1`] = `
 </Modal>
 `;
 
+exports[`Lightbox Rendering With a crop button 1`] = `
+<Modal
+  animationType="fade"
+  hardwareAccelerated={true}
+  onRequestClose={[Function]}
+  supportedOrientations={
+    [
+      "portrait",
+    ]
+  }
+  transparent={false}
+  visible={true}
+>
+  <View
+    style={
+      [
+        {
+          "backgroundColor": "#000",
+          "flex": 1,
+        },
+        {
+          "backgroundColor": "#000",
+          "opacity": 1,
+        },
+      ]
+    }
+  >
+    <View
+      collapsable={false}
+      style={
+        {
+          "position": "absolute",
+          "top": 0,
+          "transform": [
+            {
+              "translateX": 0,
+            },
+            {
+              "translateY": 0,
+            },
+          ],
+          "width": "100%",
+          "zIndex": 1,
+        }
+      }
+    >
+      <RCTSafeAreaView
+        style={
+          {
+            "backgroundColor": "#00000077",
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+            "top": 0,
+          }
+        }
+      >
+        <View
+          style={
+            {
+              "alignContent": "space-between",
+              "flex": 1,
+              "flexDirection": "row",
+              "padding": 16,
+            }
+          }
+        >
+          <View
+            style={
+              {
+                "flex": 1,
+              }
+            }
+          />
+          <View
+            style={
+              {
+                "alignItems": "center",
+                "justifyContent": "center",
+              }
+            }
+          >
+            <View
+              style={
+                {
+                  "alignSelf": "center",
+                  "flexDirection": "row",
+                }
+              }
+            >
+              <View
+                style={
+                  [
+                    {
+                      "alignSelf": "center",
+                      "aspectRatio": 1,
+                      "backgroundColor": "#939393",
+                      "borderRadius": 4,
+                      "margin": 4,
+                      "overflow": "hidden",
+                      "width": 8,
+                    },
+                    {
+                      "backgroundColor": "#FFFFFF",
+                    },
+                  ]
+                }
+              />
+              <View
+                style={
+                  {
+                    "alignSelf": "center",
+                    "aspectRatio": 1,
+                    "backgroundColor": "#939393",
+                    "borderRadius": 4,
+                    "margin": 4,
+                    "overflow": "hidden",
+                    "width": 8,
+                  }
+                }
+              />
+            </View>
+          </View>
+          <View
+            style={
+              {
+                "flex": 1,
+              }
+            }
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              hitSlop={
+                {
+                  "bottom": 16,
+                  "left": 16,
+                  "right": 16,
+                  "top": 16,
+                }
+              }
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "alignItems": "center",
+                  "alignSelf": "flex-end",
+                  "justifyContent": "center",
+                  "opacity": 1,
+                }
+              }
+            >
+              <Icon
+                color="rgba(255, 255, 255, 0.5)"
+                name="xmark"
+                size={24}
+                testID="close-lightbox"
+                type="light"
+              />
+            </View>
+          </View>
+        </View>
+      </RCTSafeAreaView>
+    </View>
+    <RCTScrollView
+      data={
+        [
+          {
+            "uri": "https://waarneming-test.nl/media/photo/031/772/31772398.jpg",
+          },
+          {
+            "uri": "https://waarneming-test.nl/media/photo/031/772/31772399.jpg",
+          },
+        ]
+      }
+      getItem={[Function]}
+      getItemCount={[Function]}
+      getItemLayout={[Function]}
+      horizontal={true}
+      initialNumToRender={1}
+      initialScrollIndex={0}
+      keyExtractor={[Function]}
+      maxToRenderPerBatch={1}
+      onContentSizeChange={[Function]}
+      onLayout={[Function]}
+      onMomentumScrollBegin={[Function]}
+      onMomentumScrollEnd={[Function]}
+      onScroll={[Function]}
+      onScrollBeginDrag={[Function]}
+      onScrollEndDrag={[Function]}
+      pagingEnabled={true}
+      renderItem={[Function]}
+      scrollEventThrottle={0.0001}
+      showsHorizontalScrollIndicator={false}
+      showsVerticalScrollIndicator={false}
+      stickyHeaderIndices={[]}
+      windowSize={2}
+    >
+      <View>
+        <View
+          onFocusCapture={[Function]}
+          style={
+            [
+              {
+                "flexDirection": "row",
+              },
+              null,
+            ]
+          }
+        >
+          <View>
+            <RCTScrollView
+              contentContainerStyle={
+                {
+                  "height": 1334,
+                }
+              }
+              maximumZoomScale={1}
+              onScrollEndDrag={[Function]}
+              pinchGestureEnabled={true}
+              scrollEnabled={false}
+              scrollEventThrottle={1}
+              showsHorizontalScrollIndicator={false}
+              showsVerticalScrollIndicator={false}
+              style={
+                {
+                  "height": 1334,
+                  "width": 750,
+                }
+              }
+            >
+              <View>
+                <View
+                  style={
+                    {
+                      "alignItems": "center",
+                      "height": 1334,
+                      "justifyContent": "center",
+                      "width": 750,
+                    }
+                  }
+                >
+                  <ActivityIndicator
+                    color="#FFF"
+                    size="small"
+                  />
+                </View>
+                <Image
+                  accessibilityState={
+                    {
+                      "busy": undefined,
+                      "checked": undefined,
+                      "disabled": undefined,
+                      "expanded": undefined,
+                      "selected": undefined,
+                    }
+                  }
+                  accessible={true}
+                  collapsable={false}
+                  focusable={true}
+                  onClick={[Function]}
+                  onLoad={[Function]}
+                  onResponderGrant={[Function]}
+                  onResponderMove={[Function]}
+                  onResponderRelease={[Function]}
+                  onResponderTerminate={[Function]}
+                  onResponderTerminationRequest={[Function]}
+                  onStartShouldSetResponder={[Function]}
+                  source={
+                    {
+                      "uri": "https://waarneming-test.nl/media/photo/031/772/31772398.jpg",
+                    }
+                  }
+                  style={
+                    {
+                      "height": 0,
+                      "opacity": 1,
+                      "width": 0,
+                    }
+                  }
+                />
+              </View>
+            </RCTScrollView>
+          </View>
+        </View>
+        <View
+          style={
+            {
+              "width": 750,
+            }
+          }
+        />
+      </View>
+    </RCTScrollView>
+    <View
+      collapsable={false}
+      style={
+        {
+          "bottom": 0,
+          "position": "absolute",
+          "transform": [
+            {
+              "translateX": 0,
+            },
+            {
+              "translateY": 0,
+            },
+          ],
+          "width": "100%",
+          "zIndex": 1,
+        }
+      }
+    >
+      <RCTSafeAreaView
+        style={
+          {
+            "backgroundColor": "#00000077",
+            "bottom": 0,
+            "left": 0,
+            "position": "absolute",
+            "right": 0,
+          }
+        }
+      >
+        <View
+          style={
+            {
+              "paddingHorizontal": 16,
+              "paddingVertical": 8,
+            }
+          }
+        >
+          <View
+            style={
+              {
+                "flexDirection": "row",
+                "marginHorizontal": 16,
+                "marginVertical": 24,
+              }
+            }
+          >
+            <View
+              style={
+                {
+                  "alignItems": "center",
+                  "flex": 0.5,
+                }
+              }
+            >
+              <View
+                accessibilityState={
+                  {
+                    "busy": undefined,
+                    "checked": undefined,
+                    "disabled": undefined,
+                    "expanded": undefined,
+                    "selected": undefined,
+                  }
+                }
+                accessibilityValue={
+                  {
+                    "max": undefined,
+                    "min": undefined,
+                    "now": undefined,
+                    "text": undefined,
+                  }
+                }
+                accessible={true}
+                collapsable={false}
+                focusable={true}
+                hitSlop={
+                  {
+                    "bottom": 16,
+                    "left": 16,
+                    "right": 16,
+                    "top": 16,
+                  }
+                }
+                onClick={[Function]}
+                onResponderGrant={[Function]}
+                onResponderMove={[Function]}
+                onResponderRelease={[Function]}
+                onResponderTerminate={[Function]}
+                onResponderTerminationRequest={[Function]}
+                onStartShouldSetResponder={[Function]}
+                style={
+                  {
+                    "opacity": 1,
+                  }
+                }
+              >
+                <Icon
+                  color="#FFFFFF"
+                  name="crop-simple"
+                  size={20}
+                  testID="crop-photo"
+                  type="light"
+                />
+              </View>
+            </View>
+          </View>
+        </View>
+      </RCTSafeAreaView>
+    </View>
+  </View>
+</Modal>
+`;
+
 exports[`Lightbox Rendering With a delete button 1`] = `
 <Modal
   animationType="fade"
diff --git a/src/lib/Icons.ts b/src/lib/Icons.ts
index 9a64d05..09ba8cb 100644
--- a/src/lib/Icons.ts
+++ b/src/lib/Icons.ts
@@ -6,6 +6,7 @@ import { faAngleUp as faAngleUpLight } from '@fortawesome/pro-light-svg-icons/fa
 import { faArrowCircleRight as faArrowCircleRightLight } from '@fortawesome/pro-light-svg-icons/faArrowCircleRight'
 import { faArrowRotateLeft as faArrowRotateLeftLight } from '@fortawesome/pro-light-svg-icons/faArrowRotateLeft'
 import { faArrowsRotate as faArrowsRotateLight } from '@fortawesome/pro-light-svg-icons/faArrowsRotate'
+import { faArrowTurnRight as faArrowTurnRightLight } from '@fortawesome/pro-light-svg-icons/faArrowTurnRight'
 import { faArrowUpFromBracket as faArrowUpFromBracketLight } from '@fortawesome/pro-light-svg-icons/faArrowUpFromBracket'
 import { faArrowUpFromSquare as faArrowUpFromSquareLight } from '@fortawesome/pro-light-svg-icons/faArrowUpFromSquare'
 import { faBadge as faBadgeLight } from '@fortawesome/pro-light-svg-icons/faBadge'
@@ -99,6 +100,7 @@ import { faAngleUp as faAngleUpSolid } from '@fortawesome/pro-solid-svg-icons/fa
 import { faArrowCircleRight as faArrowCircleRightSolid } from '@fortawesome/pro-solid-svg-icons/faArrowCircleRight'
 import { faArrowRotateLeft as faArrowRotateLeftSolid } from '@fortawesome/pro-solid-svg-icons/faArrowRotateLeft'
 import { faArrowsRotate as faArrowsRotateSolid } from '@fortawesome/pro-solid-svg-icons/faArrowsRotate'
+import { faArrowTurnRight as faArrowTurnRightSolid } from '@fortawesome/pro-solid-svg-icons/faArrowTurnRight'
 import { faArrowUpFromBracket as faArrowUpFromBracketSolid } from '@fortawesome/pro-solid-svg-icons/faArrowUpFromBracket'
 import { faArrowUpFromSquare as faArrowUpFromSquareSolid } from '@fortawesome/pro-solid-svg-icons/faArrowUpFromSquare'
 import { faBadge as faBadgeSolid } from '@fortawesome/pro-solid-svg-icons/faBadge'
@@ -194,6 +196,7 @@ type IconName = Extract<
   | 'angle-up'
   | 'arrow-circle-right'
   | 'arrow-rotate-left'
+  | 'arrow-turn-right'
   | 'arrow-up-from-bracket'
   | 'arrow-up-from-square'
   | 'arrows-rotate'
@@ -289,6 +292,7 @@ const icons: { [key in IconName]: { light: IconDefinition; solid: IconDefinition
   'angle-down': { light: faAngleDownLight, solid: faAngleDownSolid },
   'angle-up': { light: faAngleUpLight, solid: faAngleUpSolid },
   'arrow-circle-right': { light: faArrowCircleRightLight, solid: faArrowCircleRightSolid },
+  'arrow-turn-right': { light: faArrowTurnRightLight, solid: faArrowTurnRightSolid },
   'arrow-up-from-bracket': { light: faArrowUpFromBracketLight, solid: faArrowUpFromBracketSolid },
   'arrow-up-from-square': { light: faArrowUpFromSquareLight, solid: faArrowUpFromSquareSolid },
   'arrows-rotate': { light: faArrowsRotateLight, solid: faArrowsRotateSolid },