使用Vibrant是非常直接的，但因为代码比解释更有效，这里有一个例子

var img = document.createElement('img');
img.setAttribute('src', 'examples/octocat.png')

img.addEventListener('load', function() {
    var vibrant = new Vibrant(img);
    var swatches = vibrant.swatches()
    for (var swatch in swatches)
        if (swatches.hasOwnProperty(swatch) && swatches[swatch])
            console.log(swatch, swatches[swatch].getHex())

    /*
     * Results into:
     * Vibrant #7a4426
     * Muted #7b9eae
     * DarkVibrant #348945
     * DarkMuted #141414
     * LightVibrant #f3ccb4
     */
});

正如你所看到的，Vibrant的第一个参数是一个图像。在将其传递给Vibrant之前，请确保它已加载。Vibrant有3个构造函数参数

new Vibrant(
    img,
    64, /* amount of colors in initial palette from which the swatches will be generated, defaults to 64 */
    5 /* quality. 0 is highest, but takes way more processing. defaults to 5. */
)