
Using your chosen color as a baseline, Chrome will build a custom theme with a similar color for the toolbar and a complementary color for the Google logo on the New Tab Page. Clicking it opens to your operating system’s native color selector, which you’ll use to select a single base color for your theme, and Chrome will handle the rest. Once enabled, a “custom color picker” will appear in the “Color and theme” page in the Chrome New Tab Page’s “Customize” menu.

Show custom color picker in Chrome Colors menu. In the code, we see that there will be a new flag in chrome://flags related to “Chrome Colors,” making for a total of three flags necessary to enable these custom themes.Ĭustom color picker for Chrome Colors menu
COLOR DROPPER APP CHROME GENERATOR
Needless to say, most people would not be willing to go through this effort.Īccording to a pair of recent code changes in Chromium, it seems Google is catering to customizers by developing a built-in theme generator for Chrome. However, up to this point, if you wanted a custom color scheme outside of what’s available in the Chrome Web Store, you needed to create a Chrome extension. To that end, Google has already begun to include a significant number of built-in color-based themes, behind a pair of flags, that make customizing Chrome as simple as can be. However, many of the most popular themes, including the ones recently published by Google itself, only adjust the browser’s color scheme. Traditional themes, as found in the Chrome Web Store, allow for in-depth customization including background and toolbar images. Google is looking to fix this with a built-in easy-to-use custom theme generator for Chrome.

Using HTML2Canvas (version 0.5.While Chrome has long been customizable via themes from the Chrome Web Store, it’s not been easy for the average person to personalize their browser to their own unique tastes. Thus, in order to do this, we must use something like HTML2Canvas or DOM Panda to take a "screenshot" of our website, get the user's click location, and get the pixel color of the "screenshot" at that particular location. There is no built in DOM method to generically get the color of a DOM element (other than images or a ) at a particular pixel location. Maybe that's also a solution for your CMS? the result was a nice color palette with all coporate colors to choose from.

COLOR DROPPER APP CHROME DOWNLOAD
Make the tool available as download on your CMS.Īnother aproach I used for a CMS was to "steal" colors by parsing the CSS: the use case was to make the colors of an already existing web site available as color palette to my application: I would suggest that you handle this problem with an external tool - this makes it even browser indepedent (but OS dependent): write a small tool (for instance in c#) which does the color query for you, is invoked with a shortcut and submits the color to your server. As you stated yourself, you have those images available from within php and can do the color-query on the server. In addition, I would say that you don't need the canvas when it comes to images. I do agree with the very detailed answer provided by Elijah. Here I only used canvas and one image, but if you need to use over the image, it's possible too. Var canvas = document.getElementById('m圜anvas') Your browser does not support the canvas element. Merging various references found here in StackOverflow and in other sites, I did so using javascript and JQuery:

If you must be able to convert to various representations of color values, try my color.js library.Īlso, you're never going to be able to support IE <9 (that's assuming that IE9 supports canvas) and using Flash won't help as it can't read the pixel data of the document either. In the case of the images, you would have to draw them to a canvas with: var canvas = document.createElement("canvas") Ĭanvas.getContext('2d').drawImage(yourImageElement, 0, 0) Īnd then just use the previous method explained for canvases. In the case of the canvas, you would do canvasElement.getContext('2d').getImageData(x, y, 1, 1).data. It would be very bad if you knew what pixels made up the image, You can only tell the color of the pixel under the mouse if either the mouse is over a canvas or an image element of the same domain (or an image element of another domain which is served with an Access-Control-Allow-Origin: * header). It's not possible with JavaScript as it goes against cross-domain security.
