placeholder.js renders image placeholders entirely in browser.

the lastest version is 1.65kb, less then 0.84kb after gzip.

Placeholders can have custom colors, fonts, resizing behavior.

Download placeholder.js

Client Placeholder

npm install placeholder.js

require("placeholder.js");

placeholder.getData(opts);

<img class="placeholder" />

Learn more at the placeholder.js GitHub.

How to use? Documents / DEMO.

Server Placeholder

placeholder.cn/{px}/{bg}/{fg}

Just put your image size after our URL and you'll get a placeholder.

1.placeholder.cn/128 2.placeholder.cn/256x128 3.placeholder.cn/137/aaa 4.placeholder.cn/256x128/255/6e9