diff --git a/packages/dev/s2-docs/pages/react-aria/Slider.mdx b/packages/dev/s2-docs/pages/react-aria/Slider.mdx
index 893ff592436..1b867f1faf8 100644
--- a/packages/dev/s2-docs/pages/react-aria/Slider.mdx
+++ b/packages/dev/s2-docs/pages/react-aria/Slider.mdx
@@ -99,6 +99,48 @@ By default, slider values are percentages between 0 and 100. Use the `minValue`,
     fillOffset: 75
   }} />
 
+## Marks
+
+Render a `<SliderMark>` for each value you want to label along the track. Pressing a mark moves the nearest thumb to its value, so labels stay usable when they sit outside the track's bounds. Marks are not focusable — the thumb remains the keyboard interface — so keep their content short, or add `aria-hidden` where it would only repeat what the thumb already announces.
+
+```tsx render
+"use client";
+import {Slider} from 'vanilla-starter/Slider';
+
+<Slider
+  label="Brightness"
+  minValue={-100}
+  maxValue={100}
+  defaultValue={0}
+  /*- begin highlight -*/
+  marks={[-100, -50, 0, 50, 100]} />
+  {/*- end highlight -*/}
+```
+
+### Snapping
+
+Marks alone do not change how a thumb moves. Use `snapPoints` to make a pointer snap to values as it passes them, while leaving the values in between reachable. `snapThreshold` controls how close the pointer must get, as a fraction of the track length.
+
+Keyboard interactions are deliberately unaffected — arrow keys continue to move by `step` — so a snap point is a pointer affordance rather than a restriction on the value.
+
+<VisualExample
+  component={VanillaSlider}
+  docs={vanillaDocs.exports.Slider}
+  links={vanillaDocs.links}
+  props={['snapThreshold', 'step']}
+  initialProps={{
+    label: 'Brightness',
+    minValue: -100,
+    maxValue: 100,
+    defaultValue: 0,
+    marks: [-100, -50, 0, 50, 100],
+    snapPoints: [-100, -50, 0, 50, 100]
+  }} />
+
+Snap points do not have to be multiples of `step`. A value such as `0` on a slider that steps by 25 is only reachable with a pointer.
+
+Marks and snap points cover the harder cases too. A macOS-style volume slider — ticks drawn across the track, a thumb that goes translucent while dragging, and a value readout that follows it — needs no other API: the thumb already exposes `isDragging` and `isHovered` as render props, and `SliderOutput` reads the live value. See the `SliderMarks` story for a worked example.
+
 ## Examples
 
 <ExampleList tag="slider" pages={props.pages} />
@@ -107,12 +149,13 @@ By default, slider values are percentages between 0 and 100. Use the `minValue`,
 
 <Anatomy />
 
-```tsx links={{Slider: '#slider', SliderOutput: '#slideroutput', SliderTrack: '#slidertrack', SliderFill: '#sliderfill', SliderThumb: '#sliderthumb'}}
+```tsx links={{Slider: '#slider', SliderOutput: '#slideroutput', SliderTrack: '#slidertrack', SliderFill: '#sliderfill', SliderMark: '#slidermark', SliderThumb: '#sliderthumb'}}
 <Slider>
   <Label />
   <SliderOutput />
   <SliderTrack>
     <SliderFill />
+    <SliderMark />
     <SliderThumb />
     <SliderThumb>
       <Label />
@@ -137,6 +180,10 @@ By default, slider values are percentages between 0 and 100. Use the `minValue`,
 
 <PropTable component={docs.exports.SliderFill} links={docs.links} showDescription />
 
+### SliderMark
+
+<PropTable component={docs.exports.SliderMark} links={docs.links} showDescription />
+
 ### SliderThumb
 
 <PropTable component={docs.exports.SliderThumb} links={docs.links} showDescription />
diff --git a/packages/react-aria-components/exports/Slider.ts b/packages/react-aria-components/exports/Slider.ts
index 4459bb81bf4..86b5e249b78 100644
--- a/packages/react-aria-components/exports/Slider.ts
+++ b/packages/react-aria-components/exports/Slider.ts
@@ -20,6 +20,7 @@ export {
   SliderTrack,
   SliderThumb,
   SliderFill,
+  SliderMark,
   SliderContext,
   SliderOutputContext,
   SliderTrackContext,
@@ -35,7 +36,9 @@ export type {
   SliderTrackRenderProps,
   SliderThumbRenderProps,
   SliderFillProps,
-  SliderFillRenderProps
+  SliderFillRenderProps,
+  SliderMarkProps,
+  SliderMarkRenderProps
 } from '../src/Slider';
 export type {SliderState} from 'react-stately/useSliderState';
 
diff --git a/packages/react-aria-components/exports/index.ts b/packages/react-aria-components/exports/index.ts
index 1851f59f5a2..65ea485a3b4 100644
--- a/packages/react-aria-components/exports/index.ts
+++ b/packages/react-aria-components/exports/index.ts
@@ -188,6 +188,7 @@ export {
   SliderTrack,
   SliderThumb,
   SliderFill,
+  SliderMark,
   SliderContext,
   SliderOutputContext,
   SliderTrackContext,
@@ -457,7 +458,9 @@ export type {
   SliderTrackRenderProps,
   SliderFillProps,
   SliderFillRenderProps,
-  SliderThumbRenderProps
+  SliderThumbRenderProps,
+  SliderMarkProps,
+  SliderMarkRenderProps
 } from '../src/Slider';
 export type {
   SwitchProps,
diff --git a/packages/react-aria-components/src/Slider.tsx b/packages/react-aria-components/src/Slider.tsx
index 7129ae20c18..6f328ad181c 100644
--- a/packages/react-aria-components/src/Slider.tsx
+++ b/packages/react-aria-components/src/Slider.tsx
@@ -47,6 +47,7 @@ import React, {
 import {SliderState, useSliderState} from 'react-stately/useSliderState';
 import {useFocusRing} from 'react-aria/useFocusRing';
 import {useHover} from 'react-aria/useHover';
+import {useLocale} from 'react-aria/I18nProvider';
 import {useNumberFormatter} from 'react-aria/useNumberFormatter';
 import {VisuallyHidden} from 'react-aria/VisuallyHidden';
 
@@ -374,6 +375,133 @@ export const SliderThumb = /*#__PURE__*/ (forwardRef as forwardRefType)(function
   );
 });
 
+export interface SliderMarkRenderProps extends SliderRenderProps {
+  /**
+   * The value along the track that the mark is positioned at.
+   */
+  value: number;
+  /**
+   * Whether the mark is currently hovered with a mouse.
+   *
+   * @selector [data-hovered]
+   */
+  isHovered: boolean;
+}
+
+export interface SliderMarkProps
+  extends HoverEvents, RenderProps<SliderMarkRenderProps>, GlobalDOMAttributes<HTMLDivElement> {
+  /** The value along the track that the mark is positioned at. */
+  value: number;
+  /**
+   * The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the
+   * element. A function may be provided to compute the class based on component state.
+   *
+   * @default 'react-aria-SliderMark'
+   */
+  className?: ClassNameOrFunction<SliderMarkRenderProps>;
+}
+
+/**
+ * A slider mark labels a value along the track. Pressing it moves the nearest thumb to that value.
+ */
+export const SliderMark = /*#__PURE__*/ (forwardRef as forwardRefType)(function SliderMark(
+  props: SliderMarkProps,
+  ref: ForwardedRef<HTMLDivElement>
+) {
+  let {value, onHoverStart, onHoverEnd, onHoverChange, ...otherProps} = props;
+  let state = useContext(SliderStateContext)!;
+  let {direction} = useLocale();
+  let {hoverProps, isHovered} = useHover({
+    onHoverStart,
+    onHoverEnd,
+    onHoverChange,
+    isDisabled: state.isDisabled
+  });
+
+  // Marks sit inside the track, which moves the nearest thumb to wherever the pointer went down.
+  // Stop that here so the thumb lands on the mark's exact value, including for labels rendered
+  // outside the track's bounds.
+  let onDown = (e: React.SyntheticEvent) => {
+    e.stopPropagation();
+    let index = state.getClosestThumbIndex(value);
+    if (index < 0 || !state.isThumbEditable(index)) {
+      return;
+    }
+
+    e.preventDefault();
+    state.setFocusedThumb(index);
+    state.setThumbDragging(index, true);
+    state.setThumbPercent(index, state.getValuePercent(value));
+    state.setThumbDragging(index, false);
+  };
+
+  let isVertical = state.orientation === 'vertical';
+  let percent = state.getValuePercent(value);
+  if (isVertical || direction === 'rtl') {
+    percent = 1 - percent;
+  }
+
+  let renderProps = useRenderProps({
+    ...props,
+    defaultClassName: 'react-aria-SliderMark',
+    defaultStyle: {
+      position: 'absolute',
+      [isVertical ? 'top' : 'left']: `${percent * 100}%`,
+      transform: 'translate(-50%, -50%)'
+    },
+    values: {
+      orientation: state.orientation,
+      isDisabled: state.isDisabled,
+      isHovered,
+      value,
+      state
+    }
+  });
+
+  // Pointer events are dispatched before their mouse and touch equivalents, so only one handler
+  // acts on an interaction and the rest just stop propagation. JSDOM has no PointerEvent, so tests
+  // fall through to the mouse and touch handlers.
+  let hasPointerEvents = typeof PointerEvent !== 'undefined';
+  let interactions: HTMLAttributes<HTMLDivElement> = !state.isDisabled
+    ? {
+        onPointerDown: (e: React.PointerEvent) => {
+          if (e.pointerType === 'mouse' && (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey)) {
+            return;
+          }
+          onDown(e);
+        },
+        onMouseDown: (e: React.MouseEvent) => {
+          if (e.button !== 0 || e.altKey || e.ctrlKey || e.metaKey) {
+            return;
+          }
+          if (hasPointerEvents) {
+            e.stopPropagation();
+          } else {
+            onDown(e);
+          }
+        },
+        onTouchStart: (e: React.TouchEvent) => {
+          if (hasPointerEvents) {
+            e.stopPropagation();
+          } else {
+            onDown(e);
+          }
+        }
+      }
+    : {};
+
+  return (
+    <dom.div
+      {...mergeProps(otherProps, hoverProps, interactions)}
+      {...renderProps}
+      ref={ref}
+      data-hovered={isHovered || undefined}
+      data-orientation={state.orientation || undefined}
+      data-disabled={state.isDisabled || undefined}
+    />
+  );
+});
+
 export interface SliderFillRenderProps extends SliderRenderProps {
   /**
    * Whether the slider fill is currently hovered with a mouse.
diff --git a/packages/react-aria-components/stories/Slider.stories.tsx b/packages/react-aria-components/stories/Slider.stories.tsx
index c8f77cc2f02..775c3a9e29d 100644
--- a/packages/react-aria-components/stories/Slider.stories.tsx
+++ b/packages/react-aria-components/stories/Slider.stories.tsx
@@ -14,7 +14,7 @@ import {Label} from '../src/Label';
 
 import {Meta, StoryFn} from '@storybook/react';
 import React from 'react';
-import {Slider, SliderOutput, SliderThumb, SliderTrack} from '../src/Slider';
+import {Slider, SliderMark, SliderOutput, SliderThumb, SliderTrack} from '../src/Slider';
 import styles from '../example/index.css';
 import './styles.css';
 
@@ -103,7 +103,113 @@ SliderCSS.argTypes = {
   }
 };
 
-const CustomThumb = ({index, children}: {index: number; children: React.ReactNode}) => {
+// Seven ticks over six intervals, matching the macOS Sound output volume slider that
+// https://github.com/adobe/react-spectrum/issues/8285 asks for.
+const VOLUME_TICKS = [0, 100 / 6, 200 / 6, 50, 400 / 6, 500 / 6, 100];
+
+export const SliderMarks: SliderStory = props => (
+  <Slider
+    {...props}
+    aria-label="Volume"
+    defaultValue={70}
+    snapPoints={VOLUME_TICKS}
+    style={{display: 'flex', alignItems: 'center', gap: 10, width: 360}}>
+    <SliderTrack
+      style={{position: 'relative', flex: 1, height: 22, display: 'flex', alignItems: 'center'}}>
+      <div
+        style={{
+          position: 'absolute',
+          left: 0,
+          right: 0,
+          height: 4,
+          background: '#d4d4d4',
+          borderRadius: 2
+        }}
+      />
+      {VOLUME_TICKS.map((value, i) => (
+        <SliderMark key={i} value={value}>
+          {({isHovered}) => (
+            <div
+              style={{
+                width: 2,
+                height: 11,
+                borderRadius: 1,
+                background: isHovered ? '#8a8a8a' : '#bdbdbd'
+              }}
+            />
+          )}
+        </SliderMark>
+      ))}
+      <SliderThumb
+        style={({isDragging}) => ({
+          width: 11,
+          height: 22,
+          top: '50%',
+          borderRadius: 5.5,
+          // The thumb goes translucent while dragging, as the macOS slider does.
+          background: isDragging ? 'rgba(255, 255, 255, 0.45)' : '#fff',
+          boxShadow: isDragging
+            ? '0 0 0 0.5px rgba(0, 0, 0, 0.09)'
+            : '0 0 0 0.5px rgba(0, 0, 0, 0.18), 0 1px 3px rgba(0, 0, 0, 0.28)'
+        })}
+      />
+    </SliderTrack>
+    <SliderOutput style={{width: 40, textAlign: 'end', fontVariantNumeric: 'tabular-nums'}} />
+  </Slider>
+);
+
+SliderMarks.args = {
+  isDisabled: false,
+  snapThreshold: 0.02
+};
+
+const LABELLED_MARKS = [-100, -50, 0, 50, 100];
+
+export const SliderMarksWithLabels: SliderStory = props => (
+  <Slider
+    {...props}
+    aria-label="Balance"
+    defaultValue={0}
+    minValue={-100}
+    maxValue={100}
+    snapPoints={LABELLED_MARKS}
+    style={{position: 'relative', width: 300}}>
+    <SliderOutput />
+    <SliderTrack style={{position: 'relative', height: 30, width: '100%'}}>
+      <div
+        style={{position: 'absolute', backgroundColor: 'gray', height: 3, top: 13, width: '100%'}}
+      />
+      {LABELLED_MARKS.map(value => (
+        <SliderMark key={value} value={value} style={{top: 14}}>
+          {({isHovered}) => (
+            <>
+              <div style={{width: 2, height: 10, backgroundColor: 'gray'}} />
+              <span
+                style={{
+                  position: 'absolute',
+                  top: 12,
+                  left: '50%',
+                  transform: 'translateX(-50%)',
+                  fontSize: 12,
+                  textDecoration: isHovered ? 'underline' : undefined
+                }}>
+                {value}
+              </span>
+            </>
+          )}
+        </SliderMark>
+      ))}
+      <CustomThumb index={0} />
+    </SliderTrack>
+  </Slider>
+);
+
+SliderMarksWithLabels.args = {
+  isDisabled: false,
+  snapThreshold: 0.03
+};
+
+const CustomThumb = ({index, children}: {index: number; children?: React.ReactNode}) => {
   return (
     <SliderThumb
       index={index}
diff --git a/packages/react-aria-components/test/Slider.test.js b/packages/react-aria-components/test/Slider.test.js
index aa40ce9b5a0..201ce37efa9 100644
--- a/packages/react-aria-components/test/Slider.test.js
+++ b/packages/react-aria-components/test/Slider.test.js
@@ -17,6 +17,7 @@ import {
   Slider,
   SliderContext,
   SliderFill,
+  SliderMark,
   SliderOutput,
   SliderThumb,
   SliderTrack
@@ -456,4 +457,133 @@ describe('Slider', () => {
     );
     expect(fill).toHaveStyle({position: 'absolute', bottom: '50%', height: '30%', width: '100%'});
   });
+
+  describe('SliderMark', () => {
+    let renderMarks = (sliderProps = {}, markProps, markValues = [0, 25, 50]) => {
+      let values = [].concat(sliderProps.defaultValue ?? 0);
+      return render(
+        <Slider defaultValue={0} {...sliderProps}>
+          <Label>Opacity</Label>
+          <SliderTrack>
+            {markValues.map(value => (
+              <SliderMark key={value} value={value} {...markProps}>
+                {value}
+              </SliderMark>
+            ))}
+            {values.map((_, i) => (
+              <SliderThumb key={i} index={i} aria-label={`thumb ${i}`} />
+            ))}
+          </SliderTrack>
+        </Slider>
+      );
+    };
+
+    it('should render marks positioned along the track', () => {
+      let {getByRole} = renderMarks();
+      let marks = getByRole('group').querySelectorAll('.react-aria-SliderMark');
+
+      expect(marks).toHaveLength(3);
+      expect(marks[1]).toHaveTextContent('25');
+      expect(marks[1]).toHaveAttribute('data-orientation', 'horizontal');
+      expect(marks[1]).toHaveStyle({
+        position: 'absolute',
+        left: '25%',
+        transform: 'translate(-50%, -50%)'
+      });
+    });
+
+    it('should position marks from the end when vertical', () => {
+      let {getByRole} = renderMarks({orientation: 'vertical'});
+      let marks = getByRole('group').querySelectorAll('.react-aria-SliderMark');
+
+      expect(marks[1]).toHaveAttribute('data-orientation', 'vertical');
+      expect(marks[1]).toHaveStyle({position: 'absolute', top: '75%'});
+    });
+
+    it('should support render props', () => {
+      let {getByRole} = renderMarks(
+        {},
+        {className: ({value, isDisabled}) => `mark-${value} ${isDisabled ? 'disabled' : ''}`.trim()}
+      );
+      let marks = getByRole('group').querySelectorAll('[class^="mark-"]');
+
+      expect(marks[1]).toHaveClass('mark-25');
+    });
+
+    it('should move the nearest thumb to the mark value when pressed', () => {
+      let onChange = jest.fn();
+      let onChangeEnd = jest.fn();
+      let {getByRole} = renderMarks({onChange, onChangeEnd});
+      let marks = getByRole('group').querySelectorAll('.react-aria-SliderMark');
+
+      fireEvent.mouseDown(marks[2]);
+      expect(getByRole('slider')).toHaveValue('50');
+      expect(onChange).toHaveBeenCalledWith(50);
+      expect(onChangeEnd).toHaveBeenCalledWith(50);
+    });
+
+    it('should not let the track handle a press on a mark', () => {
+      let {getByRole} = renderMarks({}, {style: {width: 200}});
+      let marks = getByRole('group').querySelectorAll('.react-aria-SliderMark');
+
+      // The track has no layout in JSDOM, so if it handled the press the thumb would land on 0.
+      fireEvent.mouseDown(marks[1]);
+      expect(getByRole('slider')).toHaveValue('25');
+    });
+
+    it('should move the closest of multiple thumbs', () => {
+      let {getAllByRole, getByRole} = renderMarks({defaultValue: [10, 80]});
+      let marks = getByRole('group').querySelectorAll('.react-aria-SliderMark');
+      let sliders = getAllByRole('slider');
+
+      fireEvent.mouseDown(marks[2]);
+      expect(sliders[0]).toHaveValue('10');
+      expect(sliders[1]).toHaveValue('50');
+    });
+
+    it('should round a mark that is not a snap point to the nearest step', () => {
+      let onChange = jest.fn();
+      let {getByRole} = renderMarks({onChange, step: 5}, undefined, [12.5]);
+
+      fireEvent.mouseDown(getByRole('group').querySelector('.react-aria-SliderMark'));
+      expect(onChange).toHaveBeenCalledWith(15);
+    });
+
+    it('should land exactly on a mark that is also a snap point', () => {
+      let onChange = jest.fn();
+      let {getByRole} = renderMarks({onChange, step: 5, snapPoints: [12.5]}, undefined, [12.5]);
+
+      fireEvent.mouseDown(getByRole('group').querySelector('.react-aria-SliderMark'));
+      expect(onChange).toHaveBeenCalledWith(12.5);
+    });
+
+    it('should do nothing when the slider is disabled', () => {
+      let onChange = jest.fn();
+      let {getByRole} = renderMarks({onChange, isDisabled: true});
+      let marks = getByRole('group').querySelectorAll('.react-aria-SliderMark');
+
+      expect(marks[1]).toHaveAttribute('data-disabled', 'true');
+      fireEvent.mouseDown(marks[1]);
+      expect(onChange).not.toHaveBeenCalled();
+    });
+
+    it('should support hover state', async () => {
+      let onHoverChange = jest.fn();
+      let {getByRole} = renderMarks(
+        {},
+        {onHoverChange, className: ({isHovered}) => (isHovered ? 'mark hovered' : 'mark')}
+      );
+      let mark = getByRole('group').querySelector('.mark');
+
+      expect(mark).not.toHaveAttribute('data-hovered');
+
+      await user.hover(mark);
+      expect(mark).toHaveAttribute('data-hovered', 'true');
+      expect(mark).toHaveClass('hovered');
+      expect(onHoverChange).toHaveBeenCalledWith(true);
+
+      await user.unhover(mark);
+      expect(mark).not.toHaveAttribute('data-hovered');
+    });
+  });
 });
diff --git a/packages/react-aria/src/slider/useSlider.ts b/packages/react-aria/src/slider/useSlider.ts
index 49fc9427176..bf8ae25b72a 100644
--- a/packages/react-aria/src/slider/useSlider.ts
+++ b/packages/react-aria/src/slider/useSlider.ts
@@ -80,9 +80,6 @@ export function useSlider<T extends number | number[]>(
   const reverseX = direction === 'rtl';
   const currentPosition = useRef<number | null>(null);
   const {moveProps} = useMove({
-    onMoveStart() {
-      currentPosition.current = null;
-    },
     onMove({deltaX, deltaY}) {
       if (!trackRef.current) {
         return;
@@ -137,27 +134,7 @@ export function useSlider<T extends number | number[]>(
       if (direction === 'rtl' || isVertical) {
         percent = 1 - percent;
       }
-      let value = state.getPercentValue(percent);
-
-      // to find the closet thumb we split the array based on the first thumb position to the "right/end" of the click.
-      let closestThumb;
-      let split = state.values.findIndex(v => value - v < 0);
-      if (split === 0) {
-        // If the index is zero then the closetThumb is the first one
-        closestThumb = split;
-      } else if (split === -1) {
-        // If no index is found they've clicked past all the thumbs
-        closestThumb = state.values.length - 1;
-      } else {
-        let lastLeft = state.values[split - 1];
-        let firstRight = state.values[split];
-        // Pick the last left/start thumb, unless they are stacked on top of each other, then pick the right/end one
-        if (Math.abs(lastLeft - value) < Math.abs(firstRight - value)) {
-          closestThumb = split - 1;
-        } else {
-          closestThumb = split;
-        }
-      }
+      let closestThumb = state.getClosestThumbIndex(state.getPercentValue(percent));
 
       // Confirm that the found closest thumb is editable, not disabled, and move it
       if (closestThumb >= 0 && state.isThumbEditable(closestThumb)) {
@@ -167,15 +144,19 @@ export function useSlider<T extends number | number[]>(
         realTimeTrackDraggingIndex.current = closestThumb;
         state.setFocusedThumb(closestThumb);
         currentPointer.current = id;
+        // Track the pointer rather than the thumb, so that the rest of the drag stays under the
+        // cursor even when the value was adjusted to fit the step or a snap point.
+        currentPosition.current = clamp(percent, 0, 1) * size;
 
         state.setThumbDragging(realTimeTrackDraggingIndex.current!, true);
-        state.setThumbValue(closestThumb, value);
+        state.setThumbPercent(closestThumb, percent);
 
         addGlobalListener(window, 'mouseup', onUpTrack, false);
         addGlobalListener(window, 'touchend', onUpTrack, false);
         addGlobalListener(window, 'pointerup', onUpTrack, false);
       } else {
         realTimeTrackDraggingIndex.current = null;
+        currentPosition.current = null;
       }
     }
   };
diff --git a/packages/react-aria/test/slider/useSlider.test.js b/packages/react-aria/test/slider/useSlider.test.js
index 22b4a8519f6..2c0e9a7b374 100644
--- a/packages/react-aria/test/slider/useSlider.test.js
+++ b/packages/react-aria/test/slider/useSlider.test.js
@@ -146,6 +146,27 @@ describe('useSlider', () => {
       expect(stateRef.current.values).toEqual([40, 80]);
     });
 
+    it('should snap to snapPoints when clicking and dragging on the track', () => {
+      let onChangeSpy = jest.fn();
+      render(
+        <Example onChange={onChangeSpy} aria-label="Slider" defaultValue={[10]} snapPoints={[50]} />
+      );
+
+      // The track is 100px wide, so the default threshold of 2% reaches roughly 2px either side.
+      let track = screen.getByTestId('track');
+      fireEvent.mouseDown(track, {clientX: 49, pageX: 49});
+      expect(onChangeSpy).toHaveBeenLastCalledWith([50]);
+
+      fireEvent.mouseMove(track, {clientX: 51, pageX: 51});
+      expect(onChangeSpy).toHaveBeenLastCalledWith([50]);
+
+      // Dragging out of range picks up where the pointer is, not where the snap left the thumb.
+      fireEvent.mouseMove(track, {clientX: 55, pageX: 55});
+      expect(onChangeSpy).toHaveBeenLastCalledWith([55]);
+
+      fireEvent.mouseUp(track, {clientX: 55, pageX: 55});
+    });
+
     it('should not allow you to set value if disabled', () => {
       let onChangeSpy = jest.fn();
       let onChangeEndSpy = jest.fn();
diff --git a/packages/react-stately/src/slider/useSliderState.ts b/packages/react-stately/src/slider/useSliderState.ts
index ccc1d755665..78974d76737 100644
--- a/packages/react-stately/src/slider/useSliderState.ts
+++ b/packages/react-stately/src/slider/useSliderState.ts
@@ -47,6 +47,17 @@ export interface SliderProps<T = number | number[]>
    * @default 1
    */
   step?: number;
+  /**
+   * A list of values that a thumb magnetically snaps to while dragging or clicking with a pointer.
+   * Values in between remain reachable, and keyboard interactions are unaffected.
+   */
+  snapPoints?: number[];
+  /**
+   * How close a pointer must be to a snap point for it to snap, as a fraction of the track length.
+   *
+   * @default 0.02
+   */
+  snapThreshold?: number;
 }
 
 export interface SliderState {
@@ -157,6 +168,14 @@ export interface SliderState {
    */
   getPercentValue(percent: number): number;
 
+  /**
+   * Returns the index of the thumb nearest to the given value. When two thumbs are
+   * stacked on the same value, the one after the value is returned.
+   *
+   * @param value
+   */
+  getClosestThumbIndex(value: number): number;
+
   /**
    * Returns if the specified thumb is editable.
    *
@@ -201,6 +220,7 @@ export interface SliderState {
 const DEFAULT_MIN_VALUE = 0;
 const DEFAULT_MAX_VALUE = 100;
 const DEFAULT_STEP_VALUE = 1;
+const DEFAULT_SNAP_THRESHOLD = 0.02;
 
 export interface SliderStateOptions<T> extends SliderProps<T> {
   numberFormatter: Intl.NumberFormat;
@@ -223,7 +243,9 @@ export function useSliderState<T extends number | number[]>(
     maxValue = DEFAULT_MAX_VALUE,
     numberFormatter: formatter,
     step = DEFAULT_STEP_VALUE,
-    orientation = 'horizontal'
+    orientation = 'horizontal',
+    snapPoints,
+    snapThreshold = DEFAULT_SNAP_THRESHOLD
   } = props;
 
   // Page step should be at least equal to step and always a multiple of the step.
@@ -294,17 +316,24 @@ export function useSliderState<T extends number | number[]>(
     isEditablesRef.current[index] = editable;
   }
 
-  function updateValue(index: number, value: number) {
+  function commitValue(index: number, value: number) {
     if (isDisabled || !isThumbEditable(index)) {
       return;
     }
-    const thisMin = getThumbMinValue(index);
-    const thisMax = getThumbMaxValue(index);
+    let newValues = replaceIndex(
+      valuesRef.current,
+      index,
+      clamp(value, getThumbMinValue(index), getThumbMaxValue(index))
+    );
+    setValues(newValues);
+  }
 
+  function updateValue(index: number, value: number) {
     // Round value to multiple of step, clamp value between min and max
-    value = snapValueToStep(value, thisMin, thisMax, step);
-    let newValues = replaceIndex(valuesRef.current, index, value);
-    setValues(newValues);
+    commitValue(
+      index,
+      snapValueToStep(value, getThumbMinValue(index), getThumbMaxValue(index), step)
+    );
   }
 
   function updateDragging(index: number, dragging: boolean) {
@@ -356,8 +385,50 @@ export function useSliderState<T extends number | number[]>(
     }
   }
 
+  // Pointer interactions run through percentages, so snapping is applied here rather than in
+  // updateValue. That leaves keyboard interactions, which move by step, unaffected.
   function setThumbPercent(index: number, percent: number) {
-    updateValue(index, getPercentValue(percent));
+    let snapPoint = getSnapPoint(percent);
+    if (snapPoint != null) {
+      commitValue(index, snapPoint);
+    } else {
+      updateValue(index, getPercentValue(percent));
+    }
+  }
+
+  function getSnapPoint(percent: number) {
+    if (!snapPoints || snapThreshold <= 0) {
+      return undefined;
+    }
+
+    let closest: number | undefined;
+    let closestDistance = snapThreshold;
+    for (let snapPoint of snapPoints) {
+      let distance = Math.abs(getValuePercent(snapPoint) - percent);
+      if (distance <= closestDistance) {
+        closest = snapPoint;
+        closestDistance = distance;
+      }
+    }
+
+    return closest;
+  }
+
+  function getClosestThumbIndex(value: number) {
+    // Split the array on the first thumb positioned after the value.
+    let split = values.findIndex(v => value - v < 0);
+    if (split === 0) {
+      return split;
+    }
+    if (split === -1) {
+      // The value is past all of the thumbs.
+      return values.length - 1;
+    }
+
+    // Pick the thumb before the value, unless the one after it is closer or they are stacked.
+    return Math.abs(values[split - 1] - value) < Math.abs(values[split] - value)
+      ? split - 1
+      : split;
   }
 
   function getRoundedValue(value: number) {
@@ -396,6 +467,7 @@ export function useSliderState<T extends number | number[]>(
     getThumbMinValue,
     getThumbMaxValue,
     getPercentValue,
+    getClosestThumbIndex,
     isThumbEditable,
     setThumbEditable,
     incrementThumb,
diff --git a/packages/react-stately/test/slider/useSliderState.test.js b/packages/react-stately/test/slider/useSliderState.test.js
index 5020103060f..3f874b27e6e 100644
--- a/packages/react-stately/test/slider/useSliderState.test.js
+++ b/packages/react-stately/test/slider/useSliderState.test.js
@@ -193,4 +193,93 @@ describe('useSliderState', () => {
     expect(onChangeSpy).not.toHaveBeenCalled();
     expect(onChangeEndSpy).not.toHaveBeenCalled();
   });
+
+  it('should return the closest thumb to a value', () => {
+    let result = renderHook(() =>
+      useSliderState({defaultValue: [20, 50, 80], numberFormatter})
+    ).result;
+
+    expect(result.current.getClosestThumbIndex(0)).toBe(0);
+    expect(result.current.getClosestThumbIndex(34)).toBe(0);
+    expect(result.current.getClosestThumbIndex(36)).toBe(1);
+    expect(result.current.getClosestThumbIndex(50)).toBe(1);
+    expect(result.current.getClosestThumbIndex(100)).toBe(2);
+  });
+
+  it('should return the last of two stacked thumbs as the closest', () => {
+    let result = renderHook(() => useSliderState({defaultValue: [50, 50], numberFormatter})).result;
+
+    expect(result.current.getClosestThumbIndex(50)).toBe(1);
+  });
+
+  describe('snapPoints', () => {
+    let renderSnapSlider = props =>
+      renderHook(() =>
+        useSliderState({defaultValue: [0], snapPoints: [0, 25, 50], numberFormatter, ...props})
+      ).result;
+
+    it('should snap to the nearest snap point within the threshold', () => {
+      let result = renderSnapSlider();
+
+      act(() => result.current.setThumbPercent(0, 0.49));
+      expect(result.current.getThumbValue(0)).toBe(50);
+
+      act(() => result.current.setThumbPercent(0, 0.515));
+      expect(result.current.getThumbValue(0)).toBe(50);
+    });
+
+    it('should leave values outside the threshold alone', () => {
+      let result = renderSnapSlider();
+
+      act(() => result.current.setThumbPercent(0, 0.45));
+      expect(result.current.getThumbValue(0)).toBe(45);
+
+      act(() => result.current.setThumbPercent(0, 0.56));
+      expect(result.current.getThumbValue(0)).toBe(56);
+    });
+
+    it('should pick the closest snap point when two are in range', () => {
+      let result = renderSnapSlider({snapPoints: [49, 51], snapThreshold: 0.5});
+
+      act(() => result.current.setThumbPercent(0, 0.4));
+      expect(result.current.getThumbValue(0)).toBe(49);
+
+      act(() => result.current.setThumbPercent(0, 0.6));
+      expect(result.current.getThumbValue(0)).toBe(51);
+    });
+
+    it('should snap to points that are not multiples of step', () => {
+      let result = renderSnapSlider({snapPoints: [12.5], step: 5});
+
+      act(() => result.current.setThumbPercent(0, 0.13));
+      expect(result.current.getThumbValue(0)).toBe(12.5);
+    });
+
+    it('should keep snapped values within the thumb bounds', () => {
+      let result = renderSnapSlider({defaultValue: [0, 40], snapPoints: [50]});
+
+      act(() => result.current.setThumbPercent(0, 0.5));
+      expect(result.current.values).toEqual([40, 40]);
+    });
+
+    it('should not affect keyboard interactions', () => {
+      let result = renderSnapSlider({defaultValue: [45]});
+
+      act(() => result.current.incrementThumb(0));
+      expect(result.current.getThumbValue(0)).toBe(46);
+
+      act(() => result.current.setThumbValue(0, 49));
+      expect(result.current.getThumbValue(0)).toBe(49);
+
+      act(() => result.current.decrementThumb(0));
+      expect(result.current.getThumbValue(0)).toBe(48);
+    });
+
+    it('should not snap when snapThreshold is 0', () => {
+      let result = renderSnapSlider({snapThreshold: 0});
+
+      act(() => result.current.setThumbPercent(0, 0.49));
+      expect(result.current.getThumbValue(0)).toBe(49);
+    });
+  });
 });
diff --git a/starters/docs/src/Slider.css b/starters/docs/src/Slider.css
index 866393515bf..dd143fb2c9f 100644
--- a/starters/docs/src/Slider.css
+++ b/starters/docs/src/Slider.css
@@ -40,6 +40,41 @@
     }
   }
 
+  .react-aria-SliderMark {
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+
+    .tick {
+      display: block;
+      background: var(--border-color);
+      border-radius: 9999px;
+    }
+
+    .tick-label {
+      position: absolute;
+      font-size: var(--font-size-sm);
+      color: var(--gray-800);
+      white-space: nowrap;
+    }
+
+    &[data-hovered] .tick-label {
+      color: var(--text-color);
+    }
+
+    &[data-disabled] {
+      cursor: default;
+
+      .tick {
+        background: var(--border-color-disabled);
+      }
+
+      .tick-label {
+        color: var(--text-color-disabled);
+      }
+    }
+  }
+
   .react-aria-SliderThumb {
     width: calc(var(--spacing) * 5.5);
     height: calc(var(--spacing) * 5.5);
@@ -92,6 +127,25 @@
     .react-aria-SliderThumb {
       top: 50%;
     }
+
+    .react-aria-SliderMark {
+      top: 50%;
+
+      .tick {
+        width: 2px;
+        height: var(--spacing-2);
+      }
+
+      .tick-label {
+        top: calc(100% + var(--spacing-1));
+        left: 50%;
+        transform: translateX(-50%);
+      }
+    }
+
+    .react-aria-SliderTrack:has(.react-aria-SliderMark) {
+      margin-bottom: var(--spacing-5);
+    }
   }
 
   &[data-orientation='vertical'] {
@@ -139,6 +193,21 @@
     .react-aria-SliderThumb {
       left: 50%;
     }
+
+    .react-aria-SliderMark {
+      left: 50%;
+
+      .tick {
+        width: var(--spacing-2);
+        height: 2px;
+      }
+
+      .tick-label {
+        left: calc(100% + var(--spacing-1));
+        top: 50%;
+        transform: translateY(-50%);
+      }
+    }
   }
 
   &[data-disabled] {
diff --git a/starters/docs/src/Slider.tsx b/starters/docs/src/Slider.tsx
index b0881f61716..7527ea639a5 100644
--- a/starters/docs/src/Slider.tsx
+++ b/starters/docs/src/Slider.tsx
@@ -1,6 +1,7 @@
 'use client';
 import {
   Slider as AriaSlider,
+  SliderMark,
   SliderOutput,
   type SliderProps as AriaSliderProps,
   SliderThumb,
@@ -21,12 +22,15 @@ export interface SliderProps<T> extends AriaSliderProps<T> {
    * @default 0
    */
   fillOffset?: number;
+  /** Values to render tick marks at along the track. */
+  marks?: number[];
 }
 
 export function Slider<T extends number | number[]>({
   label,
   thumbLabels,
   fillOffset,
+  marks,
   ...props
 }: SliderProps<T>) {
   return (
@@ -39,6 +43,12 @@ export function Slider<T extends number | number[]>({
             <div className="track inset" data-disabled={isDisabled || undefined}>
               <SliderFill offset={fillOffset} />
             </div>
+            {marks?.map(value => (
+              <SliderMark key={value} value={value}>
+                <span className="tick" />
+                <span className="tick-label">{state.getFormattedValue(value)}</span>
+              </SliderMark>
+            ))}
             {state.values.map((_, i) => (
               <SliderThumb
                 key={i}
diff --git a/starters/hooks/src/Slider.css b/starters/hooks/src/Slider.css
index 866393515bf..dd143fb2c9f 100644
--- a/starters/hooks/src/Slider.css
+++ b/starters/hooks/src/Slider.css
@@ -40,6 +40,41 @@
     }
   }
 
+  .react-aria-SliderMark {
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+
+    .tick {
+      display: block;
+      background: var(--border-color);
+      border-radius: 9999px;
+    }
+
+    .tick-label {
+      position: absolute;
+      font-size: var(--font-size-sm);
+      color: var(--gray-800);
+      white-space: nowrap;
+    }
+
+    &[data-hovered] .tick-label {
+      color: var(--text-color);
+    }
+
+    &[data-disabled] {
+      cursor: default;
+
+      .tick {
+        background: var(--border-color-disabled);
+      }
+
+      .tick-label {
+        color: var(--text-color-disabled);
+      }
+    }
+  }
+
   .react-aria-SliderThumb {
     width: calc(var(--spacing) * 5.5);
     height: calc(var(--spacing) * 5.5);
@@ -92,6 +127,25 @@
     .react-aria-SliderThumb {
       top: 50%;
     }
+
+    .react-aria-SliderMark {
+      top: 50%;
+
+      .tick {
+        width: 2px;
+        height: var(--spacing-2);
+      }
+
+      .tick-label {
+        top: calc(100% + var(--spacing-1));
+        left: 50%;
+        transform: translateX(-50%);
+      }
+    }
+
+    .react-aria-SliderTrack:has(.react-aria-SliderMark) {
+      margin-bottom: var(--spacing-5);
+    }
   }
 
   &[data-orientation='vertical'] {
@@ -139,6 +193,21 @@
     .react-aria-SliderThumb {
       left: 50%;
     }
+
+    .react-aria-SliderMark {
+      left: 50%;
+
+      .tick {
+        width: var(--spacing-2);
+        height: 2px;
+      }
+
+      .tick-label {
+        left: calc(100% + var(--spacing-1));
+        top: 50%;
+        transform: translateY(-50%);
+      }
+    }
   }
 
   &[data-disabled] {