Demo

gradient Options

height

cursor Options

width

height

border

shadow

scale

grid

samples

Colors

R: 255

G: 0

B: 0

T: 0

R: 150

G: 0

B: 200

T: 0.2

R: 70

G: 100

B: 255

T: 0.5

R: 40

G: 255

B: 80

T: 1

0.2

0.5

hex

import { Gradient } from 'react-gradient-hook';


const Demo = () => {

    const [gradientOptions, cursorOptions, setColors, Options] = useGradientOptions()

    return (
        <div>
            <Options />
            <Gradient 
                gradientOptions={gradientOptions}
                cursorOptions={cursorOptions} 
                onChange={setColors} />
        </div>
    )
}

<Demo />

import { Gradient } from 'react-gradient-hook';


const Demo = () => {

    const [gradientOptions, cursorOptions, setColors, Options] = useGradientOptions()

    return (
        <div>
            <Options />
            <Gradient 
                gradientOptions={gradientOptions}
                cursorOptions={cursorOptions} 
                onChange={setColors} />
        </div>
    )
}

<Demo />