PriceSlider
A fully interactive dual-thumb range slider with a live price label. Drag either thumb to set a min/max range — the label updates instantly. Clicking anywhere on the track jumps the nearest thumb. Keyboard accessible with arrow keys.
About this Component
Properties Highlight:
Configurable min/max price and step
Currency symbol (works with $, €, £, ¥, etc.)
Optional "+" suffix on max value
Customizable label text ("From … to …")
Show/hide "Go" button with full styling control
Track, range, and thumb colors
12 font families via dropdown
Adjustable gap, thumb size, track height
Compatibility:
Works with any Framer project. No external libraries needed — pure React with Framer property controls.
