To join the CheerLights project, you need to build a display of the latest CheerLights color. The display can be a physical set of multicolored lights or a virtual display like a web page, widget, or app. In all cases, the displays read the latest CheerLights color using the CheerLights API.

Web Widgets

A Web widget is some HTML, JavaScript, and CSS to display the latest CheerLights color on your website, WordPress blog, or Tumblr site. This is an easy way for web developers to join the CheerLights project. To build a widget, you need to make an AJAX call to the CheerLights API, parse the response for the latest color, and set the color of an object with the color. field2 contains the HTML HEX color value of the latest color.


Place code like this in the head of an HTML document to read the latest color from CheerLights and set the background color of the web page to that color.

$(document).ready(function() {
// get cheerlights color from field2 with a webservice call
$.getJSON('', function(data) {
// if the field2 has data, update background color of the page
if (data.field2) {
$("body").css("background-color", data.field2);


Check out GitHub for our latest examples using Arduino and different types of lighting displays and libraries.