Exposure Slider

An iOS Camera-style exposure slider with a draggable ticker, animated notch marks, and a circular progress indicator.

Open in v0

Last updated: March 7, 2026

0

Installation

npx smoothui-cli add exposure-slider

Features

  • Draggable ticker with spring-physics snap behavior
  • Animated notch marks with proximity-based height and opacity
  • Circular SVG progress ring showing positive/negative values
  • Edge fade gradient for depth effect
  • Configurable min/max range and step size
  • onChange callback for value tracking
  • Respects reduced motion preferences

Props

On this page

Created by

Powered by

motion.dev

Inspired by