Home

Script to get accentColor of a website

Out of curiosity, I started searching for a script to get the accent colors of external websites, kind of like Chrome does it in the most visited sites thumbnails. The script can be used to automatically give your outgoing links appropriate colors and make them look more interesting.

The script works by calculating the dominant color of the site’s favicon, which usually works pretty well to determine the web page’s signature color. This script using a canvas object to analyze the pixel data, which restricts the browser suppport to more modern browsers. It would be possible to widen the browser support by parsing the image file data directly, but considering that favicons come in many different formats, this would require too much work and code for such a small visual effect.

This script uses CORS is used to connect to getFavicon, a service by Jason Cartwright that retrieves the favicon of any given URL. There is also a PHP proxy file that you can use on your own server as fallback for browsers without CORS support.

Joel Besada had created a pretty good demo page for the script, check it out.

Resources



Last Updated on

Next Post: Rules vs Guidelines →

Comments