# CodeMirror ColorPicker Standalone

# ColorPicker Style

### Chrome Devtool Style

### Adobe XD Style

### Sketch Style

### MacOS Style

### Ring Style

### Mini Style

### Mini Vertical Style

    {
        colorpicker : {
            type : 'palette' // or 'sketch',  default type is 'chromedevtool'
        }
    }

# Image Filter

# Image Palette

    var Color = CodeMirrorColorPicker.Color;
    Color.ImageToRGB(blob, { maxWidth: 100 }, function (results) {
        const colors = Color.palette(results, 16);   // k = 16

        console.log(colors);
    })

# Color Scales

## Saturation Scale

## Value Scale

    var Color = CodeMirrorColorPicker.Color;
    var results = Color.scaleS(color, 100, 'hex');   // Saturation
    var results2 = Color.scaleV(color, 100, 'hex');   // Value

# Color Scales - Template

### parula

### hsv

### parula

### jet

### hot

### pink

### bone

### copper

### red,yellow,rgba(255, 0, 255, 0.5)

### red,yellow

### red,blue

### red,black

    var Color = CodeMirrorColorPicker.Color;
    var colors = ['red', 'green', 'blue']
    var scaleColors = Color.scale(colors, count);
    var scaleColors = Color.scale('red,yellow,rgba(255, 0, 255, 0.5)', count);
    var scaleColors = Color.scale.parula(count);   // ['#352a87', '#0f5cdd', '#00b5a6', '#ffc337', '#fdff00']
    var scaleColors = Color.scale.jet(count);   // ['#00008f', '#0020ff', '#00ffff', '#51ff77', '#fdff00', '#ff0000', '#800000']
    var scaleColors = Color.scale.hsv(count);   // ['#ff0000', '#ffff00', '#00ff00', '#00ffff', '#0000ff', '#ff00ff', '#ff0000']
    var scaleColors = Color.scale.hot(count);   // ['#0b0000', '#ff0000', '#ffff00', '#ffffff']
    var scaleColors = Color.scale.pink(count);   // ['#1e0000', '#bd7b7b', '#e7e5b2', '#ffffff']
    var scaleColors = Color.scale.bone(count);   // ['#000000', '#4a4a68', '#a6c6c6', '#ffffff']
    var scaleColors = Color.scale.copper(count);   // ['#000000', '#3d2618', '#9d623e', '#ffa167', '#ffc77f']

# Color Gradients - Template

### white, red 0.5, yellow - count 20

### white, red 0.2, yellow - count 100

### white, red 0.2, blue 0.6, magenta 0.95, yellow - count 100

    var Color = CodeMirrorColorPicker.Color;
            var gradientColors = Color.graident("white, red 0.5, yellow", count);
            var gradientColors = Color.graident(["white", "red 0.5" , "yellow"], count);
            var gradientColors = Color.graident(["white", "red 50%" , "yellow"], count);
            var gradientColors = Color.graident([['white'], ["red", 0.5] , ["yellow"]], count);

# Default Html Sample