https://github.com/ovilia/sunglass

Convert image into a given color palette
https://github.com/ovilia/sunglass

image-processing

Last synced: 3 months ago
JSON representation

Convert image into a given color palette

• Host: GitHub
• URL: https://github.com/ovilia/sunglass
• Owner: Ovilia
• Created: 2019-03-20T15:42:49.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2023-01-07T06:24:38.000Z (about 2 years ago)
• Last Synced: 2024-10-22T23:30:50.048Z (3 months ago)
• Topics: image-processing
• Language: JavaScript
• Homepage: https://www.npmjs.com/package/sunglass
• Size: 1.75 MB
• Stars: 69
• Watchers: 3
• Forks: 6
• Open Issues: 21
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml

Awesome Lists containing this project

README

        
# sunglass 😎

Convert image into a given color palette.

|Input Image|Input Palette|Output Image|

|-|-|-|

|![](./res/input.jpg)|![](./res/palette.png)|![](./res/output.png)|

|![](./res/input2.png)|![](./res/palette2.png)|![](./res/output2.png)|

This project was originally created for my [personal website](http://zhangwenli.com);

### API

```

/**

 * Convert image into a given color palette.

 *

 * @param {Image | HTMLCanvasElement} image      input image

 * @param {string[]}                  [palette=['#fff','#999','#555','#222']]

 *                                        colors of output image

 * @param {string}                    [colorSpace='rgb'] color space

 * @return {HTMLCanvasElement}        output image on canvas

 */

sunglass(image[, palette[, colorSpace]])

```

### Example

```ts

import sunglass from 'sunglass';

const img = new Image();

img.onload = () => {

    const palette = ['#d1c4af','#a39990','#363132'];

    const outputCanvas = sunglass(img, palette);

    console.log(outputCanvas.toDataURL()); // base64 string of output image

};

img.src = '...';

```