cyber

CyberSlider

Neon range slider with value display.

npx chaos add cyber-slider

PREVIEW

USAGE

import { CyberSlider } from '@/components/chaos/cyber/cyber-slider';

<CyberSlider value={50} onChange={setValue} />
<CyberSlider value={vol} onChange={setVol} showValue variant="pink" />

PROPS

PropTypeDefault

valueCurrent value

number-

onChangeChange callback

(value: number) => void-

minMinimum value

number0

maxMaximum value

number100

stepStep increment

number1

variantNeon color

"cyan" | "pink" | "green" | "purple""cyan"

showValueShow current value

booleanfalse