One Div: иконки на CSS

One-div.com — необычный сервис, где собраны почти 60 иконок, реализованные с помощью CSS. В HTML используется один div (отсюда и название):

<div class="histogram"> </div> 

CSS иконки посложнее:

.histogram{ 	height: 4em; 	overflow-y:hidden; 	background:transparent; font-size:10px; }  .histogram:before{ content: ""; display: block; width: 0; height: 3em; box-shadow: 1em 2.5em 0 0.3em #2c2c2c, 1.7em 2em 0 0.3em #2c2c2c,2.4em 0.8em 0 0.3em #2c2c2c,3.1em 1.5em 0 0.3em #2c2c2c;  }  .histogram:after{ content: ""; display: block; position: relative; margin-top: 0.9em; width: 4em; height: 0.1em; background: #2c2c2c;   } 

Указана совместимость с бразурами:

Иконки могут масштабироваться без потери качества:

А также быть анимированными при наведении — пример на странице about. Набор иконок постоянно пополняется.