All the 1x1 PNGs you can handle!
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


Colors is a library of 1x1 PNGs, available at It's an asset server, of sorts.

It's also a 1x1 PNG generator. Just go to the URL of the PNG you want (#444444 would be, and you can save the PNG to your own server.


How do I use Colors?

Just tell your CSS file to use our URL. Like this:

	div.column {
	  background: url( 0 0 repeat-y;
	  float: left;
	  margin 10px;
	  padding: 0 10px;
		width: 300px;

In the above example, we pointed at 444444.png, but you can actually use any of the following syntaxes:

You've probably figured this out, but the value you use (in this case, 444444) is the hexadecimal code for the color you want. If you use the shortened form (123.png), Colors will automatically convert that to the appropriate longform hex code (112233.png).

So what does that get you?

It gets you a 1 pixel by 1 pixel PNG, of the color of your choice. These are useful as CSS background images, when you don't want to affect the width of your box model with a border-width.

If I want more options and flexibility, what can I do?

You can use Dummy Image, by my friend Russell.

Who's behind this?

Charlie Park

If I have a suggestion, what's the best way to get in touch?

For general "hey, this is cool!"-type notes, send a message via Twitter: (@charliepark).

For code suggestions ... Colors is totally open-source (it's all right here on Github), so feel free to poke around. The app was built using the Sinatra web framework, and uses the Chunky_PNG gem. If you have any suggestions on ways it could be improved, please let me know! Again, @charliepark is best for that.