A web-friendly way for anyone to build unusual displays
JavaScript
6,434
43 commits
updated Aug 18, 2025
|
This project is no longer actively maintained by the Google Creative Lab but remains here in a read-only Archive mode so that it can continue to assist developers that may find the examples helpful. We aren’t able to address all pull requests or bug reports but outstanding issues will remain in read-only mode for reference purposes. Also, please note that some of the dependencies may not be up to date and there hasn’t been any QA done in a while so your mileage may vary.
For more details on how Archiving affects Github repositories see this documentation . We welcome users to fork this repository should there be more useful, community-driven efforts that can help continue what this project began. |
AnyPixel.js is an open-source software and hardware library that makes it possible to use the web to create big, unusual, interactive displays. Anyone can fork the code and the schematics to create their own display at any scale.
The first display using this platform is in the 8th Avenue lobby at the Google NYC office. To create this installation, we used 5880 off-the-shelf arcade buttons with LEDs inside them as our pixels. AnyPixel.js’ straightforward hardware/software framework makes it easy to build any display where each pixel is an interactive element.
We've included 12 example apps written by Googlers and friends for the 8th Avenue lobby display in NYC. To check them out, install the previewer and run one of the examples.
Building your own app is easy with the Anypixel framework. To get started, check out the framework documentation and the example app:
var anypixel = require('anypixel');
var ctx = anypixel.canvas.getContext2D();
var colors = ['#F00', '#0F0', '#00F'];
/**
* * Listen for onButtonDown events and draw a 2x2 rectangle at the event site
*/
document.addEventListener('onButtonDown', function(event) {
ctx.fillStyle = colors[Math.floor(Math.random() * colors.length)];
ctx.fillRect(event.detail.x - 1, event.detail.y - 1, 2, 2);
});
Third party directories may have different (non-Apache 2.0) licenses.
247 followers · starred Nov 2017
157 followers · starred Jun 2016
329 followers · starred Feb 2017
187 followers · starred Jun 2016
A web-friendly way for anyone to build unusual displays
JavaScript
6,434
43 commits
updated Aug 18, 2025
|
This project is no longer actively maintained by the Google Creative Lab but remains here in a read-only Archive mode so that it can continue to assist developers that may find the examples helpful. We aren’t able to address all pull requests or bug reports but outstanding issues will remain in read-only mode for reference purposes. Also, please note that some of the dependencies may not be up to date and there hasn’t been any QA done in a while so your mileage may vary.
For more details on how Archiving affects Github repositories see this documentation . We welcome users to fork this repository should there be more useful, community-driven efforts that can help continue what this project began. |
AnyPixel.js is an open-source software and hardware library that makes it possible to use the web to create big, unusual, interactive displays. Anyone can fork the code and the schematics to create their own display at any scale.
The first display using this platform is in the 8th Avenue lobby at the Google NYC office. To create this installation, we used 5880 off-the-shelf arcade buttons with LEDs inside them as our pixels. AnyPixel.js’ straightforward hardware/software framework makes it easy to build any display where each pixel is an interactive element.
We've included 12 example apps written by Googlers and friends for the 8th Avenue lobby display in NYC. To check them out, install the previewer and run one of the examples.
Building your own app is easy with the Anypixel framework. To get started, check out the framework documentation and the example app:
var anypixel = require('anypixel');
var ctx = anypixel.canvas.getContext2D();
var colors = ['#F00', '#0F0', '#00F'];
/**
* * Listen for onButtonDown events and draw a 2x2 rectangle at the event site
*/
document.addEventListener('onButtonDown', function(event) {
ctx.fillStyle = colors[Math.floor(Math.random() * colors.length)];
ctx.fillRect(event.detail.x - 1, event.detail.y - 1, 2, 2);
});
Third party directories may have different (non-Apache 2.0) licenses.
247 followers · starred Nov 2017
157 followers · starred Jun 2016
329 followers · starred Feb 2017
187 followers · starred Jun 2016