diff --git a/components/SlideToConfirm.tsx b/components/SlideToConfirm.tsx
index d51b934..4b6b327 100644
--- a/components/SlideToConfirm.tsx
+++ b/components/SlideToConfirm.tsx
@@ -17,12 +17,13 @@ interface Props {
   label?: string;
   disabled?: boolean;
   style?: ViewStyle;
+  color?: string;
 }
 
 const HANDLE_SIZE = 56;
 const THRESHOLD   = 0.80;
 
-export function SlideToConfirm({ onConfirm, label = 'Slide to confirm', disabled = false, style }: Props) {
+export function SlideToConfirm({ onConfirm, label = 'Slide to confirm', disabled = false, style, color }: Props) {
   const trackWidth = useRef(0);
   const confirmed  = useRef(false);
   const translateX = useRef(new Animated.Value(0)).current;
@@ -85,7 +86,7 @@ export function SlideToConfirm({ onConfirm, label = 'Slide to confirm', disabled
 
   return (
     <View
-      style={[styles.track, disabled && styles.trackDisabled, style]}
+      style={[styles.track, disabled && styles.trackDisabled, color && !disabled ? { backgroundColor: color } : undefined, style]}
       onLayout={e => { trackWidth.current = e.nativeEvent.layout.width; }}
     >
       <Animated.View style={[StyleSheet.absoluteFill, styles.labelWrap, { opacity: labelOpacity }]} pointerEvents="none">