Have you installed Drupal 8 yet? That toolbar is an incredible piece of art. It's functional, beautiful, and really slick. The icons are resolution independent, so that means your average mobile phone and some of the higher end laptops can show off a lot more icon detail. It's so pretty, it's just begging to be extended and filled with all the awesome-sauce that is Drupal Commerce.

Below is a journey through making a toolbar icon happen on Drupal 8-alpha6. Note that things can definitely change between now and a stable Drupal 8.

D8 Toolbar Status

So, unless you were in the issue queues helping make decisions and solve problems, you've likely not taken much time to follow the evolution of the toolbar. In Drupal 7, this is the toolbar you get:

And in Drupal 8, you get so much more:

• Toolbar Bar - This is the black bar across the top. Yes it's called the "Toolbar Bar" (note the double "bar"). In a particularly brilliant stroke, we have four very simple actions. The clutter is gone. And the best part? The links collapse into icons on smaller screens.
• Toolbar Tray - This is the white bar just below the black bar that can go "horizontal" using a toggle switch. Unlike Drupal 7, the top bar items tie directly to the second bar. I, for one, am very impressed with how comfortable this tray feels. Finally, Drupal has a world-class toolbar.
• Toolbar Tray expansion - When in a horizontal
• Icons - Notice all those icons? They're a new feature and that's the focus of the rest of this article. Lots to talk about.

Read the entire tutorial