Image color picker is a simple component to choose the specific color from the image. Use image-color-picker to specify a color and get the HTML color code for the selected pixel. Also, you can get a preview of the selected pixel, HEX value, and RGBA value.
angular color picker stackblitz, angular material color picker, angular color type, create a color picker component in angular, html color picker code javascript, typescript color picker
Steps:
1. Select a photo/Image
Select the image by clicking “Choose File”
2. Choose a color
Click anywhere on the image and you will get the pixel color
3. Preview
By clicking on the image, you can see the current pixel color in the preview box
4. Copy color code
By clicking on the image you will get RGBA and HEX values in the text boxes, you can copy any color code and use it in your app
How to make use of it:
1. The method below will give HEX and RGBA values.
getcolval(event) { console.log(event); }
2. outputColor is the name of the output event you used.
<app-imgcol (outputColor)="getcolval($event)"></app-imgcol>
Image Color Picker For Angular Plugin/Github, primeng color picker stackblitz
See Demo And Download
Official Website(ERS-HCL): Click Here
This superior jQuery/javascript plugin is developed by ERS-HCL. For extra advanced usage, please go to the official website.
Be First to Comment