7 ms·
Color Thief, script for grabbing the color palette from an image
- sparshgupta 15y agoVery nice. I would expect a provision to upload (or add URL of) an image and test it on the demo page before downloading it and using it on my website.
- alexkearns 15y agoI wonder if it works with cross-domain images. I could not see in the documentation if it does.
- joshfraser 15y agoI haven't tested it, but I would expect so. There aren't many cross-domain restrictions in browsers for images.
- jQueryIsAwesome 15y agoYes, there are. That is why this thing exist: http://www.maxnov.com/getimagedata/ http://www.maxnov.com/getimagedata/ So probably it doesn't work for cross-domain images.
- andrewcooke 15y agowhat does it mean when the colours get bigger as i mouse over them? is something else meant to happen? i guess that should mean they are clickable, or that something else is changing, but i don't see anything else change and nothing happens when i click. is something broken (chrome latest stable, linux)? [edit: and if not, please don't do that.]
- tayeed 15y agoI think if the users can copy the Hex codes by clicking on individual colors, it can be a useful service.
- wtvanhest 15y agoI'm not a programmer, but I see an opportunity here: Go to istockphoto.com - this is a site where you can buy images for use in any type of publication, advertising etc. The opportunity I see would be to offer to write software which indexes their entire collection by color. Then when someone wants to buy an image for a publication they could put their colors in and have istockphoto only show them images which fit the color palette. This would save designers a ton of time.
- joshuacc 15y agoiStockPhoto already has a "search by color" feature which does pretty much what you're suggesting. http://screensnapr.com/v/gTjWCw.png http://screensnapr.com/v/gTjWCw.png
- wtvanhest 15y agosorry, that must be new then. It has been a little while since I logged in there.
- petercooper 15y agoSorry in advance as I'm not trying to make you feel stupid but.. I used to use that feature a lot before they were acquired by Getty (and their prices got so ridiculous I stopped using them.) So at least six years ago.
- mikeleeorg 15y agoThis kind of reminds me of http://www.pictaculous.com/ http://www.pictaculous.com/
- g3orge 15y agoI always wanted something like this and I even thought of building it, but I didn't have time to learn javascript.
- brador 15y agoCould you make it show the RGB of the color of the square color block I'm hovering over in the palette area?
- GBKS 15y agoI built a similar tool for this purpose recently. It uses Canvas, but falls back to Flash if Canvas is not supported. Here's an example - hover and click the image - http://www.imagecolorpalette.com/image/40 http://www.imagecolorpalette.com/image/40
- stylishgnome 15y agoWhy does it turn magenta when you double-click (on two distinct pixels specifically)?
- tikhonj 15y agoThat's just the highlight color. Assuming you're using Chrome, it's pretty eager about highlighting random stuff; other browsers may be similar. Try selecting some text.
- VMG 15y agoThere is a css rule to disable user selection which might be handy here: http://stackoverflow.com/questions/826782 http://stackoverflow.com/questions/826782
- DTrejo 15y agoMade something similar a long time ago but never made it look as good as yours :) http://colorslice.dtrejo.com/ http://colorslice.dtrejo.com/
- vladsanchez 15y agoThis is genius! Thanks for sharing it!
- mark_story 15y agoYou can build a similar thing server side using Imagemagick. It has a great suite of tools for doing image quantization and other manipulations.
- chrisacky 15y agoI've tried. I've failed. I would have loved seeing this been done in Imagick on PHP.
- sorghum 15y agoYou can do it like this with ImageMagick on the command line. This will quantize the image to 8 colors and list them in descending order of occurance: convert image.jpg -resize 400x400 -format %c -dither None -quantize LAB -colors 8 -depth 8 histogram:info:- | sort -r
- ciupicri 15y agoSorting should be done with sort -r -n -t :
- drpancake 15y agoClever use of <canvas>. I made an Android app that does something similar: https://market.android.com/details?id=uk.co.opeso.android.colorscheme https://market.android.com/details?id=uk.co.opeso.android.co...
- axx 15y agoCan someone please write this in ruby? :)
- hns_bollocks 15y agono, now go jump into a lake and take your hipster language with you
- vertr 15y agoHacker News has standards of discussion. Learn them.
- quan 15y agoI made a gem to do exactly this with RMagick, you can check it out here: https://github.com/mquan/prizm https://github.com/mquan/prizm
- sorghum 15y agoHere's my shot at it from a few months ago: http://github.com/quadule/colorscore http://github.com/quadule/colorscore ImageMagick does the actual color extraction, then I wrote some code to score those colors against a palette for use in a "search by color" system.
- callmeed 15y agoFYI Mobile Safari on iPhone 4 and iPad 1 crashes every time for me.
- kalleboo 15y agoHave you reported it to Apple?
- jakejake 15y agoThis could produce an interesting and possibly strange image viewer if you use it to control the color scheme of the page. For example, you upload an image and the css of the page itself updates to be complimentary to the photo.
- AndyNemmity 15y agoWow, I can use this. This is great. I run an online football game http://deeproute.com http://deeproute.com and players upload helmets to go with their team. I can use this to check that helmet image they are using, and grab the color palette and then use those colors to drive their color scheme. Brilliant! Thanks!
- Mavyrk 15y agoIt would be interesting to see if you could use a system like this to automagically derive background colors for image display, picking muted complimentary colors to make the dominant color in an image "pop", so to speak.
- aaronblohowiak 15y agoYou can do this by representing the colors into HSV and then modifying the hue by 180%, desaturating them and then adjusting the brightness (v). Most color libraries will let you deal in RGB(A) or HSV so this is pretty straightforward to DIY.
- Dylanfm 15y agoClusterfck is a nice JS library for hierarchical clustering: http://harthur.github.com/clusterfck/ http://harthur.github.com/clusterfck/ I put together a tiny tool like the posted link for playing with clusterfck: http://dylanfm.github.com/Ladderfck/ http://dylanfm.github.com/Ladderfck/ Kind of handy for getting a feel for what you can do - e.g. trying different distance metrics and linkages. It too uses canvas.
- mnemosyne51 15y agoAdobe Kuler also has this feature.
- daltonlp 15y agoThat is rather nice! http://www.colr.org http://www.colr.org has something similar, but it relies on server-side code. An all-javascript solution is a cool thing.
- simplify 15y agohttp://colorapi.com/ http://colorapi.com/ is similar but better suited for finding color theme inspiration.
- manojlds 15y agoIs white not considered for dominant colour? In the apple logo pic, white is clearly the dominant...
- baddox 15y agoLooks that way: https://github.com/lokesh/color-thief/blob/master/js/color-thief.js#L84 https://github.com/lokesh/color-thief/blob/master/js/color-t...
- deleted 15y ago[deleted]