Прозрачное фоновое изображение CSS с использованием «data:»

Я видел на некоторых сайтах, что вы можете включать изображения в CSS с помощью ключевого слова "data":

.stuff {
  background: transparent url(data:image/gif;base64,SOMEWEIRDCODEHERE) repeat center top;
}

странный код выглядит как строка с экодом в base64, например:

R0lGODlhMwAxAIAAAAAAAP / // yH5BAAAAAAALAAAAAAzADEAAAK8jI + pBr0PowytzotTtbm / DTqQ6C3hGX ElcraA9jIr66ozVpM3nseUvYP1UEHF0FUUHkNJxhLZfEJNvol06tzwrgd LbXsFZYmSMPnHLB + zNJFbq15 + SOf50 + 6rG7lKOjwV1ibGdhHYRVYVJ9Wn k2HWtLdIWMSH9lfyODZoZTb4xdnpxQSEF9oyOWIqp6gaI9pI1Qo7BijbF ZkoaAtEeiiLeKn72xM7vMZofJy8zJys2UxsCT3kO229LH1tXAAAOw ==

выглядит довольно круто: D

Мне было интересно, как я могу добавить такой прозрачный GIF размером 1x1 пиксель? Кто-нибудь знает код данных для такого изображения?

Это хорошая идея сделать это для небольших и очень распространенных изображений? Все ли браузеры поддерживают это?