<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<script src="https://rawgit.com/jonathantneal/svg4everybody/master/svg4everybody.js"></script>
<title>SVG sprite preview | svg-sprite</title>
<style>@charset "UTF-8";body{padding:0;margin:0;color:#666;background:#fafafa;font-family:Arial,Helvetica,sans-serif;font-size:1em;line-height:1.4}header{display:block;padding:3em 3em 2em 3em;background-color:#fff}header p{margin:2em 0 0 0}section{border-top:1px solid #eee;padding:2em 3em 0 3em}section ul{margin:0;padding:0}section li{display:inline;display:inline-block;background-color:#fff;position:relative;margin:0 2em 2em 0;vertical-align:top;border:1px solid #ccc;padding:1em 1em 3em 1em;cursor:default}.icon-box{margin:0;width:144px;height:144px;position:relative;background:#ccc url(data:image/gif;base64,R0lGODlhDAAMAIAAAMzMzP///yH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjEgNjQuMTQwOTQ5LCAyMDEwLzEyLzA3LTEwOjU3OjAxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1LjEgV2luZG93cyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDozQjk4OTI0MUY5NTIxMUUyQkJDMEI5NEFEM0Y1QTYwQyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDozQjk4OTI0MkY5NTIxMUUyQkJDMEI5NEFEM0Y1QTYwQyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjNCOTg5MjNGRjk1MjExRTJCQkMwQjk0QUQzRjVBNjBDIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjNCOTg5MjQwRjk1MjExRTJCQkMwQjk0QUQzRjVBNjBDIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkEAAAAAAAsAAAAAAwADAAAAhaEH6mHmmzcgzJAUG/NVGrfOZ8YLlABADs=) top left repeat;border:1px solid #ccc;display:table-cell;vertical-align:middle;text-align:center}.icon{display:inline;display:inline-block}h1{margin-top:0}h2{margin:0;padding:0;font-size:1em;font-weight:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:absolute;left:1em;right:1em;bottom:1em}footer{display:block;margin:0;padding:0 3em 3em 3em}footer p{margin:0;font-size:.7em}footer a{color:#0f7595;margin-left:0}</style>
<!--
Sprite image dimensions
====================================================================================================
You will need to set the sprite image dimensions via CSS when you use them as inline SVG, otherwise
they would become a huge 100% in size. You may use the following dimension classes for doing so.
They might well be outsourced to an external stylesheet of course.
-->
<style type="text/css">
.svg-ic_album_24px-dims { width: 24px; height: 24px; }
.svg-ic_av_timer_24px-dims { width: 24px; height: 24px; }
.svg-ic_closed_caption_24px-dims { width: 24px; height: 24px; }
.svg-ic_equalizer_24px-dims { width: 24px; height: 24px; }
.svg-ic_explicit_24px-dims { width: 24px; height: 24px; }
.svg-ic_fast_forward_24px-dims { width: 24px; height: 24px; }
.svg-ic_fast_rewind_24px-dims { width: 24px; height: 24px; }
.svg-ic_games_24px-dims { width: 24px; height: 24px; }
.svg-ic_hearing_24px-dims { width: 24px; height: 24px; }
.svg-ic_high_quality_24px-dims { width: 24px; height: 24px; }
.svg-ic_loop_24px-dims { width: 24px; height: 24px; }
.svg-ic_mic_24px-dims { width: 24px; height: 24px; }
.svg-ic_mic_none_24px-dims { width: 24px; height: 24px; }
.svg-ic_mic_off_24px-dims { width: 24px; height: 24px; }
.svg-ic_movie_24px-dims { width: 24px; height: 24px; }
.svg-ic_my_library_add_24px-dims { width: 24px; height: 24px; }
.svg-ic_my_library_books_24px-dims { width: 24px; height: 24px; }
.svg-ic_my_library_music_24px-dims { width: 24px; height: 24px; }
.svg-ic_new_releases_24px-dims { width: 24px; height: 24px; }
.svg-ic_not_interested_24px-dims { width: 24px; height: 24px; }
.svg-ic_pause_24px-dims { width: 24px; height: 24px; }
.svg-ic_pause_circle_fill_24px-dims { width: 24px; height: 24px; }
.svg-ic_pause_circle_outline_24px-dims { width: 24px; height: 24px; }
.svg-ic_play_arrow_24px-dims { width: 24px; height: 24px; }
.svg-ic_play_circle_fill_24px-dims { width: 24px; height: 24px; }
.svg-ic_play_circle_outline_24px-dims { width: 24px; height: 24px; }
.svg-ic_play_shopping_bag_24px-dims { width: 24px; height: 24px; }
.svg-ic_playlist_add_24px-dims { width: 24px; height: 24px; }
.svg-ic_queue_24px-dims { width: 24px; height: 24px; }
.svg-ic_queue_music_24px-dims { width: 24px; height: 24px; }
.svg-ic_radio_24px-dims { width: 24px; height: 24px; }
.svg-ic_recent_actors_24px-dims { width: 24px; height: 24px; }
.svg-ic_repeat_24px-dims { width: 24px; height: 24px; }
.svg-ic_repeat_one_24px-dims { width: 24px; height: 24px; }
.svg-ic_replay_24px-dims { width: 24px; height: 24px; }
.svg-ic_shuffle_24px-dims { width: 24px; height: 24px; }
.svg-ic_skip_next_24px-dims { width: 24px; height: 24px; }
.svg-ic_skip_previous_24px-dims { width: 24px; height: 24px; }
.svg-ic_snooze_24px-dims { width: 24px; height: 24px; }
.svg-ic_stop_24px-dims { width: 24px; height: 24px; }
.svg-ic_subtitles_24px-dims { width: 24px; height: 24px; }
.svg-ic_surround_sound_24px-dims { width: 24px; height: 24px; }
.svg-ic_video_collection_24px-dims { width: 24px; height: 24px; }
.svg-ic_videocam_24px-dims { width: 24px; height: 24px; }
.svg-ic_videocam_off_24px-dims { width: 24px; height: 24px; }
.svg-ic_volume_down_24px-dims { width: 24px; height: 24px; }
.svg-ic_volume_mute_24px-dims { width: 24px; height: 24px; }
.svg-ic_volume_off_24px-dims { width: 24px; height: 24px; }
.svg-ic_volume_up_24px-dims { width: 24px; height: 24px; }
.svg-ic_web_24px-dims { width: 24px; height: 24px; }
</style>
<!--
====================================================================================================
-->
</head>
<body>
<!--
Inline SVG sprite
====================================================================================================
This is an inlined version of the generated SVG sprite. The single images may be <use>d everywhere
below within this document. Please see https://github.com/jkphl/svg-sprite#inline-embedding for
further details on how to create this embeddable sprite variant.
-->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="0" height="0" style="position:absolute">
<defs>
<svg width="24" height="24" viewBox="0 0 24 24" id="ic_album_24px" y="0"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 14.5c-2.49 0-4.5-2.01-4.5-4.5S9.51 7.5 12 7.5s4.5 2.01 4.5 4.5-2.01 4.5-4.5 4.5zm0-5.5c-.55 0-1 .45-1 1s.45 1 1 1 1-.45 1-1-.45-1-1-1z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_av_timer_24px" y="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M11 17c0 .55.45 1 1 1s1-.45 1-1-.45-1-1-1-1 .45-1 1zm0-14v4h2V5.08c3.39.49 6 3.39 6 6.92 0 3.87-3.13 7-7 7s-7-3.13-7-7c0-1.68.59-3.22 1.58-4.42L12 13l1.41-1.41-6.8-6.8v.02C4.42 6.45 3 9.05 3 12c0 4.97 4.02 9 9 9 4.97 0 9-4.03 9-9s-4.03-9-9-9h-1zm7 9c0-.55-.45-1-1-1s-1 .45-1 1 .45 1 1 1 1-.45 1-1zM6 12c0 .55.45 1 1 1s1-.45 1-1-.45-1-1-1-1 .45-1 1z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_closed_caption_24px" y="48"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-8 7H9.5v-.5h-2v3h2V13H11v1c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1zm7 0h-1.5v-.5h-2v3h2V13H18v1c0 .55-.45 1-1 1h-3c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_equalizer_24px" y="72"><path d="M0 0h24v24H0z" fill="none"/><path d="M10 20h4V4h-4v16zm-6 0h4v-8H4v8zM16 9v11h4V9h-4z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_explicit_24px" y="96"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-4 6h-4v2h4v2h-4v2h4v2H9V7h6v2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_fast_forward_24px" y="120"><path d="M4 18l8.5-6L4 6v12zm9-12v12l8.5-6L13 6z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_fast_rewind_24px" y="144"><path d="M11 18V6l-8.5 6 8.5 6zm.5-6l8.5 6V6l-8.5 6z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_games_24px" y="168"><path d="M0 0h24v24H0z" fill="none"/><path d="M15 7.5V2H9v5.5l3 3 3-3zM7.5 9H2v6h5.5l3-3-3-3zM9 16.5V22h6v-5.5l-3-3-3 3zM16.5 9l-3 3 3 3H22V9h-5.5z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_hearing_24px" y="192"><path d="M17 20c-.29 0-.56-.06-.76-.15-.71-.37-1.21-.88-1.71-2.38-.51-1.56-1.47-2.29-2.39-3-.79-.61-1.61-1.24-2.32-2.53C9.29 10.98 9 9.93 9 9c0-2.8 2.2-5 5-5s5 2.2 5 5h2c0-3.93-3.07-7-7-7S7 5.07 7 9c0 1.26.38 2.65 1.07 3.9.91 1.65 1.98 2.48 2.85 3.15.81.62 1.39 1.07 1.71 2.05.6 1.82 1.37 2.84 2.73 3.55.51.23 1.07.35 1.64.35 2.21 0 4-1.79 4-4h-2c0 1.1-.9 2-2 2zM7.64 2.64L6.22 1.22C4.23 3.21 3 5.96 3 9s1.23 5.79 3.22 7.78l1.41-1.41C6.01 13.74 5 11.49 5 9s1.01-4.74 2.64-6.36zM11.5 9c0 1.38 1.12 2.5 2.5 2.5s2.5-1.12 2.5-2.5-1.12-2.5-2.5-2.5-2.5 1.12-2.5 2.5z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_high_quality_24px" y="216"><path d="M0 0h24v24H0z" fill="none"/><path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-8 11H9.5v-2h-2v2H6V9h1.5v2.5h2V9H11v6zm7-1c0 .55-.45 1-1 1h-.75v1.5h-1.5V15H14c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v4zm-3.5-.5h2v-3h-2v3z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_loop_24px" y="240"><path d="M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_mic_24px" y="264"><path d="M12 14c1.66 0 2.99-1.34 2.99-3L15 5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm5.3-3c0 3-2.54 5.1-5.3 5.1S6.7 14 6.7 11H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28c3.28-.48 6-3.3 6-6.72h-1.7z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_mic_none_24px" y="288"><path d="M12 14c1.66 0 2.99-1.34 2.99-3L15 5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm-1.2-9.1c0-.66.54-1.2 1.2-1.2.66 0 1.2.54 1.2 1.2l-.01 6.2c0 .66-.53 1.2-1.19 1.2-.66 0-1.2-.54-1.2-1.2V4.9zm6.5 6.1c0 3-2.54 5.1-5.3 5.1S6.7 14 6.7 11H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28c3.28-.48 6-3.3 6-6.72h-1.7z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_mic_off_24px" y="312"><path d="M0 0h24v24H0zm0 0h24v24H0z" fill="none"/><path d="M19 11h-1.7c0 .74-.16 1.43-.43 2.05l1.23 1.23c.56-.98.9-2.09.9-3.28zm-4.02.17c0-.06.02-.11.02-.17V5c0-1.66-1.34-3-3-3S9 3.34 9 5v.18l5.98 5.99zM4.27 3L3 4.27l6.01 6.01V11c0 1.66 1.33 3 2.99 3 .22 0 .44-.03.65-.08l1.66 1.66c-.71.33-1.5.52-2.31.52-2.76 0-5.3-2.1-5.3-5.1H5c0 3.41 2.72 6.23 6 6.72V21h2v-3.28c.91-.13 1.77-.45 2.54-.9L19.73 21 21 19.73 4.27 3z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_movie_24px" y="336"><path d="M18 4l2 4h-3l-2-4h-2l2 4h-3l-2-4H8l2 4H7L5 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V4h-4z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_my_library_add_24px" y="360"><path d="M0 0h24v24H0z" fill="none"/><path d="M4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-1 9h-4v4h-2v-4H9V9h4V5h2v4h4v2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_my_library_books_24px" y="384"><path d="M0 0h24v24H0z" fill="none"/><path d="M4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-1 9H9V9h10v2zm-4 4H9v-2h6v2zm4-8H9V5h10v2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_my_library_music_24px" y="408"><path d="M0 0h24v24H0z" fill="none"/><path d="M20 2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 5h-3v5.5c0 1.38-1.12 2.5-2.5 2.5S10 13.88 10 12.5s1.12-2.5 2.5-2.5c.57 0 1.08.19 1.5.51V5h4v2zM4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_new_releases_24px" y="432"><path d="M0 0h24v24H0z" fill="none"/><path d="M23 12l-2.44-2.78.34-3.68-3.61-.82-1.89-3.18L12 3 8.6 1.54 6.71 4.72l-3.61.81.34 3.68L1 12l2.44 2.78-.34 3.69 3.61.82 1.89 3.18L12 21l3.4 1.46 1.89-3.18 3.61-.82-.34-3.68L23 12zm-10 5h-2v-2h2v2zm0-4h-2V7h2v6z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_not_interested_24px" y="456"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8 0-1.85.63-3.55 1.69-4.9L16.9 18.31C15.55 19.37 13.85 20 12 20zm6.31-3.1L7.1 5.69C8.45 4.63 10.15 4 12 4c4.42 0 8 3.58 8 8 0 1.85-.63 3.55-1.69 4.9z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_pause_24px" y="480"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_pause_circle_fill_24px" y="504"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 14H9V8h2v8zm4 0h-2V8h2v8z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_pause_circle_outline_24px" y="528"><path d="M0 0h24v24H0z" fill="none"/><path d="M9 16h2V8H9v8zm3-14C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm1-4h2V8h-2v8z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_play_arrow_24px" y="552"><path d="M8 5v14l11-7z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_play_circle_fill_24px" y="576"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 14.5v-9l6 4.5-6 4.5z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_play_circle_outline_24px" y="600"><path d="M0 0h24v24H0z" fill="none"/><path d="M10 16.5l6-4.5-6-4.5v9zM12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_play_shopping_bag_24px" y="624"><path d="M16 6V4c0-1.11-.89-2-2-2h-4c-1.11 0-2 .89-2 2v2H2v13c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V6h-6zm-6-2h4v2h-4V4zM9 18V9l7.5 4L9 18z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_playlist_add_24px" y="648"><path d="M0 0h24v24H0z" fill="none"/><path d="M14 10H2v2h12v-2zm0-4H2v2h12V6zm4 8v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zM2 16h8v-2H2v2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_queue_24px" y="672"><path d="M0 0h24v24H0z" fill="none"/><path d="M4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-1 9h-4v4h-2v-4H9V9h4V5h2v4h4v2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_queue_music_24px" y="696"><path d="M0 0h24v24H0z" fill="none"/><path d="M15 6H3v2h12V6zm0 4H3v2h12v-2zM3 16h8v-2H3v2zM17 6v8.18c-.31-.11-.65-.18-1-.18-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3V8h3V6h-5z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_radio_24px" y="720"><path d="M3.24 6.15C2.51 6.43 2 7.17 2 8v12c0 1.1.89 2 2 2h16c1.11 0 2-.9 2-2V8c0-1.11-.89-2-2-2H8.3l8.26-3.34L15.88 1 3.24 6.15zM7 20c-1.66 0-3-1.34-3-3s1.34-3 3-3 3 1.34 3 3-1.34 3-3 3zm13-8h-2v-2h-2v2H4V8h16v4z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_recent_actors_24px" y="744"><path d="M0 0h24v24H0z" fill="none"/><path d="M21 5v14h2V5h-2zm-4 14h2V5h-2v14zM14 5H2c-.55 0-1 .45-1 1v12c0 .55.45 1 1 1h12c.55 0 1-.45 1-1V6c0-.55-.45-1-1-1zM8 7.75c1.24 0 2.25 1.01 2.25 2.25S9.24 12.25 8 12.25 5.75 11.24 5.75 10 6.76 7.75 8 7.75zM12.5 17h-9v-.75c0-1.5 3-2.25 4.5-2.25s4.5.75 4.5 2.25V17z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_repeat_24px" y="768"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_repeat_one_24px" y="792"><path d="M0 0h24v24H0z" fill="none"/><path d="M7 7h10v3l4-4-4-4v3H5v6h2V7zm10 10H7v-3l-4 4 4 4v-3h12v-6h-2v4zm-4-2V9h-1l-2 1v1h1.5v4H13z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_replay_24px" y="816"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_shuffle_24px" y="840"><path d="M0 0h24v24H0z" fill="none"/><path d="M10.59 9.17L5.41 4 4 5.41l5.17 5.17 1.42-1.41zM14.5 4l2.04 2.04L4 18.59 5.41 20 17.96 7.46 20 9.5V4h-5.5zm.33 9.41l-1.41 1.41 3.13 3.13L14.5 20H20v-5.5l-2.04 2.04-3.13-3.13z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_skip_next_24px" y="864"><path d="M6 18l8.5-6L6 6v12zM16 6v12h2V6h-2z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_skip_previous_24px" y="888"><path d="M6 6h2v12H6zm3.5 6l8.5 6V6z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_snooze_24px" y="912"><path d="M0 0h24v24H0z" fill="none"/><path d="M7.88 3.39L6.6 1.86 2 5.71l1.29 1.53 4.59-3.85zM22 5.72l-4.6-3.86-1.29 1.53 4.6 3.86L22 5.72zM12 4c-4.97 0-9 4.03-9 9s4.02 9 9 9c4.97 0 9-4.03 9-9s-4.03-9-9-9zm0 16c-3.87 0-7-3.13-7-7s3.13-7 7-7 7 3.13 7 7-3.13 7-7 7zm-3-9h3.63L9 15.2V17h6v-2h-3.63L15 10.8V9H9v2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_stop_24px" y="936"><path d="M0 0h24v24H0z" fill="none"/><path d="M6 6h12v12H6z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_subtitles_24px" y="960"><path d="M0 0h24v24H0z" fill="none"/><path d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zM4 12h4v2H4v-2zm10 6H4v-2h10v2zm6 0h-4v-2h4v2zm0-4H10v-2h10v2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_surround_sound_24px" y="984"><path d="M0 0h24v24H0z" fill="none"/><path d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zM7.76 16.24l-1.41 1.41C4.78 16.1 4 14.05 4 12c0-2.05.78-4.1 2.34-5.66l1.41 1.41C6.59 8.93 6 10.46 6 12s.59 3.07 1.76 4.24zM12 16c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4zm5.66 1.66l-1.41-1.41C17.41 15.07 18 13.54 18 12s-.59-3.07-1.76-4.24l1.41-1.41C19.22 7.9 20 9.95 20 12c0 2.05-.78 4.1-2.34 5.66zM12 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_video_collection_24px" y="1008"><path d="M0 0h24v24H0z" fill="none"/><path d="M4 6H2v14c0 1.1.9 2 2 2h14v-2H4V6zm16-4H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-8 12.5v-9l6 4.5-6 4.5z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_videocam_24px" y="1032"><path d="M0 0h24v24H0z" fill="none"/><path d="M17 10.5V7c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.55 0 1-.45 1-1v-3.5l4 4v-11l-4 4z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_videocam_off_24px" y="1056"><path d="M0 0h24v24H0zm0 0h24v24H0z" fill="none"/><path d="M21 6.5l-4 4V7c0-.55-.45-1-1-1H9.82L21 17.18V6.5zM3.27 2L2 3.27 4.73 6H4c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h12c.21 0 .39-.08.54-.18L19.73 21 21 19.73 3.27 2z"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_volume_down_24px" y="1080"><path d="M18.5 12c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM5 9v6h4l5 5V4L9 9H5z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_volume_mute_24px" y="1104"><path d="M7 9v6h4l5 5V4l-5 5H7z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_volume_off_24px" y="1128"><path d="M16.5 12c0-1.77-1.02-3.29-2.5-4.03v2.21l2.45 2.45c.03-.2.05-.41.05-.63zm2.5 0c0 .94-.2 1.82-.54 2.64l1.51 1.51C20.63 14.91 21 13.5 21 12c0-4.28-2.99-7.86-7-8.77v2.06c2.89.86 5 3.54 5 6.71zM4.27 3L3 4.27 7.73 9H3v6h4l5 5v-6.73l4.25 4.25c-.67.52-1.42.93-2.25 1.18v2.06c1.38-.31 2.63-.95 3.69-1.81L19.73 21 21 19.73l-9-9L4.27 3zM12 4L9.91 6.09 12 8.18V4z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_volume_up_24px" y="1152"><path d="M3 9v6h4l5 5V4L7 9H3zm13.5 3c0-1.77-1.02-3.29-2.5-4.03v8.05c1.48-.73 2.5-2.25 2.5-4.02zM14 3.23v2.06c2.89.86 5 3.54 5 6.71s-2.11 5.85-5 6.71v2.06c4.01-.91 7-4.49 7-8.77s-2.99-7.86-7-8.77z"/><path d="M0 0h24v24H0z" fill="none"/></svg> <svg width="24" height="24" viewBox="0 0 24 24" id="ic_web_24px" y="1176"><path d="M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-5 14H4v-4h11v4zm0-5H4V9h11v4zm5 5h-4V9h4v9z"/><path d="M0 0h24v24H0z" fill="none"/></svg> </defs>
</svg><!--
====================================================================================================
-->
<header>
<h1>SVG sprite preview</h1>
<p>This preview features two methods of using the generated sprite in conjunction with inline SVG. Please have a look at the HTML source for further details and be aware of the following constraints:</p>
<ul>
<li>Your browser has to <a href="http://caniuse.com/svg-html5" target="_blank">support inline SVG</a> for these techniques to work.</li>
<li>The embedded sprite (A) slightly differs from the generated external one. Please <a href="https://github.com/jkphl/svg-sprite#inline-embedding" target="_blank">see the documentation</a> for details on how to create such an embeddable sprite.</li>
<li>Internet Explorer up to version 11 doesn't support external sprites for use with inline SVG. For IE 9-11, you may polyfill this functionality with <a href="https://github.com/jonathantneal/svg4everybody" target="_blank">SVG for Everybody</a>.</li>
</ul>
</header>
<section>
<!--
Inline SVG with embedded sprite
====================================================================================================
These SVG images make use of fragment identifiers (IDs) and are extracted out of the inline sprite
embedded above. They may be styled via CSS.
-->
<h3>A) Inline SVG with embedded sprite</h3>
<ul>
<li title="ic_album_24px">
<div class="icon-box">
<!-- ic_album_24px -->
<svg viewBox="0 0 24 24" class="svg-ic_album_24px svg-ic_album_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_album_24px"></use>
</svg>
</div>
<h2>ic_album_24px</h2>
</li>
<li title="ic_av_timer_24px">
<div class="icon-box">
<!-- ic_av_timer_24px -->
<svg viewBox="0 24 24 24" class="svg-ic_av_timer_24px svg-ic_av_timer_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_av_timer_24px"></use>
</svg>
</div>
<h2>ic_av_timer_24px</h2>
</li>
<li title="ic_closed_caption_24px">
<div class="icon-box">
<!-- ic_closed_caption_24px -->
<svg viewBox="0 48 24 24" class="svg-ic_closed_caption_24px svg-ic_closed_caption_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_closed_caption_24px"></use>
</svg>
</div>
<h2>ic_closed_caption_24px</h2>
</li>
<li title="ic_equalizer_24px">
<div class="icon-box">
<!-- ic_equalizer_24px -->
<svg viewBox="0 72 24 24" class="svg-ic_equalizer_24px svg-ic_equalizer_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_equalizer_24px"></use>
</svg>
</div>
<h2>ic_equalizer_24px</h2>
</li>
<li title="ic_explicit_24px">
<div class="icon-box">
<!-- ic_explicit_24px -->
<svg viewBox="0 96 24 24" class="svg-ic_explicit_24px svg-ic_explicit_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_explicit_24px"></use>
</svg>
</div>
<h2>ic_explicit_24px</h2>
</li>
<li title="ic_fast_forward_24px">
<div class="icon-box">
<!-- ic_fast_forward_24px -->
<svg viewBox="0 120 24 24" class="svg-ic_fast_forward_24px svg-ic_fast_forward_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_fast_forward_24px"></use>
</svg>
</div>
<h2>ic_fast_forward_24px</h2>
</li>
<li title="ic_fast_rewind_24px">
<div class="icon-box">
<!-- ic_fast_rewind_24px -->
<svg viewBox="0 144 24 24" class="svg-ic_fast_rewind_24px svg-ic_fast_rewind_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_fast_rewind_24px"></use>
</svg>
</div>
<h2>ic_fast_rewind_24px</h2>
</li>
<li title="ic_games_24px">
<div class="icon-box">
<!-- ic_games_24px -->
<svg viewBox="0 168 24 24" class="svg-ic_games_24px svg-ic_games_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_games_24px"></use>
</svg>
</div>
<h2>ic_games_24px</h2>
</li>
<li title="ic_hearing_24px">
<div class="icon-box">
<!-- ic_hearing_24px -->
<svg viewBox="0 192 24 24" class="svg-ic_hearing_24px svg-ic_hearing_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_hearing_24px"></use>
</svg>
</div>
<h2>ic_hearing_24px</h2>
</li>
<li title="ic_high_quality_24px">
<div class="icon-box">
<!-- ic_high_quality_24px -->
<svg viewBox="0 216 24 24" class="svg-ic_high_quality_24px svg-ic_high_quality_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_high_quality_24px"></use>
</svg>
</div>
<h2>ic_high_quality_24px</h2>
</li>
<li title="ic_loop_24px">
<div class="icon-box">
<!-- ic_loop_24px -->
<svg viewBox="0 240 24 24" class="svg-ic_loop_24px svg-ic_loop_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_loop_24px"></use>
</svg>
</div>
<h2>ic_loop_24px</h2>
</li>
<li title="ic_mic_24px">
<div class="icon-box">
<!-- ic_mic_24px -->
<svg viewBox="0 264 24 24" class="svg-ic_mic_24px svg-ic_mic_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_mic_24px"></use>
</svg>
</div>
<h2>ic_mic_24px</h2>
</li>
<li title="ic_mic_none_24px">
<div class="icon-box">
<!-- ic_mic_none_24px -->
<svg viewBox="0 288 24 24" class="svg-ic_mic_none_24px svg-ic_mic_none_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_mic_none_24px"></use>
</svg>
</div>
<h2>ic_mic_none_24px</h2>
</li>
<li title="ic_mic_off_24px">
<div class="icon-box">
<!-- ic_mic_off_24px -->
<svg viewBox="0 312 24 24" class="svg-ic_mic_off_24px svg-ic_mic_off_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_mic_off_24px"></use>
</svg>
</div>
<h2>ic_mic_off_24px</h2>
</li>
<li title="ic_movie_24px">
<div class="icon-box">
<!-- ic_movie_24px -->
<svg viewBox="0 336 24 24" class="svg-ic_movie_24px svg-ic_movie_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_movie_24px"></use>
</svg>
</div>
<h2>ic_movie_24px</h2>
</li>
<li title="ic_my_library_add_24px">
<div class="icon-box">
<!-- ic_my_library_add_24px -->
<svg viewBox="0 360 24 24" class="svg-ic_my_library_add_24px svg-ic_my_library_add_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_my_library_add_24px"></use>
</svg>
</div>
<h2>ic_my_library_add_24px</h2>
</li>
<li title="ic_my_library_books_24px">
<div class="icon-box">
<!-- ic_my_library_books_24px -->
<svg viewBox="0 384 24 24" class="svg-ic_my_library_books_24px svg-ic_my_library_books_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_my_library_books_24px"></use>
</svg>
</div>
<h2>ic_my_library_books_24px</h2>
</li>
<li title="ic_my_library_music_24px">
<div class="icon-box">
<!-- ic_my_library_music_24px -->
<svg viewBox="0 408 24 24" class="svg-ic_my_library_music_24px svg-ic_my_library_music_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_my_library_music_24px"></use>
</svg>
</div>
<h2>ic_my_library_music_24px</h2>
</li>
<li title="ic_new_releases_24px">
<div class="icon-box">
<!-- ic_new_releases_24px -->
<svg viewBox="0 432 24 24" class="svg-ic_new_releases_24px svg-ic_new_releases_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_new_releases_24px"></use>
</svg>
</div>
<h2>ic_new_releases_24px</h2>
</li>
<li title="ic_not_interested_24px">
<div class="icon-box">
<!-- ic_not_interested_24px -->
<svg viewBox="0 456 24 24" class="svg-ic_not_interested_24px svg-ic_not_interested_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_not_interested_24px"></use>
</svg>
</div>
<h2>ic_not_interested_24px</h2>
</li>
<li title="ic_pause_24px">
<div class="icon-box">
<!-- ic_pause_24px -->
<svg viewBox="0 480 24 24" class="svg-ic_pause_24px svg-ic_pause_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_pause_24px"></use>
</svg>
</div>
<h2>ic_pause_24px</h2>
</li>
<li title="ic_pause_circle_fill_24px">
<div class="icon-box">
<!-- ic_pause_circle_fill_24px -->
<svg viewBox="0 504 24 24" class="svg-ic_pause_circle_fill_24px svg-ic_pause_circle_fill_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_pause_circle_fill_24px"></use>
</svg>
</div>
<h2>ic_pause_circle_fill_24px</h2>
</li>
<li title="ic_pause_circle_outline_24px">
<div class="icon-box">
<!-- ic_pause_circle_outline_24px -->
<svg viewBox="0 528 24 24" class="svg-ic_pause_circle_outline_24px svg-ic_pause_circle_outline_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_pause_circle_outline_24px"></use>
</svg>
</div>
<h2>ic_pause_circle_outline_24px</h2>
</li>
<li title="ic_play_arrow_24px">
<div class="icon-box">
<!-- ic_play_arrow_24px -->
<svg viewBox="0 552 24 24" class="svg-ic_play_arrow_24px svg-ic_play_arrow_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_play_arrow_24px"></use>
</svg>
</div>
<h2>ic_play_arrow_24px</h2>
</li>
<li title="ic_play_circle_fill_24px">
<div class="icon-box">
<!-- ic_play_circle_fill_24px -->
<svg viewBox="0 576 24 24" class="svg-ic_play_circle_fill_24px svg-ic_play_circle_fill_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_play_circle_fill_24px"></use>
</svg>
</div>
<h2>ic_play_circle_fill_24px</h2>
</li>
<li title="ic_play_circle_outline_24px">
<div class="icon-box">
<!-- ic_play_circle_outline_24px -->
<svg viewBox="0 600 24 24" class="svg-ic_play_circle_outline_24px svg-ic_play_circle_outline_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_play_circle_outline_24px"></use>
</svg>
</div>
<h2>ic_play_circle_outline_24px</h2>
</li>
<li title="ic_play_shopping_bag_24px">
<div class="icon-box">
<!-- ic_play_shopping_bag_24px -->
<svg viewBox="0 624 24 24" class="svg-ic_play_shopping_bag_24px svg-ic_play_shopping_bag_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_play_shopping_bag_24px"></use>
</svg>
</div>
<h2>ic_play_shopping_bag_24px</h2>
</li>
<li title="ic_playlist_add_24px">
<div class="icon-box">
<!-- ic_playlist_add_24px -->
<svg viewBox="0 648 24 24" class="svg-ic_playlist_add_24px svg-ic_playlist_add_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_playlist_add_24px"></use>
</svg>
</div>
<h2>ic_playlist_add_24px</h2>
</li>
<li title="ic_queue_24px">
<div class="icon-box">
<!-- ic_queue_24px -->
<svg viewBox="0 672 24 24" class="svg-ic_queue_24px svg-ic_queue_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_queue_24px"></use>
</svg>
</div>
<h2>ic_queue_24px</h2>
</li>
<li title="ic_queue_music_24px">
<div class="icon-box">
<!-- ic_queue_music_24px -->
<svg viewBox="0 696 24 24" class="svg-ic_queue_music_24px svg-ic_queue_music_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_queue_music_24px"></use>
</svg>
</div>
<h2>ic_queue_music_24px</h2>
</li>
<li title="ic_radio_24px">
<div class="icon-box">
<!-- ic_radio_24px -->
<svg viewBox="0 720 24 24" class="svg-ic_radio_24px svg-ic_radio_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_radio_24px"></use>
</svg>
</div>
<h2>ic_radio_24px</h2>
</li>
<li title="ic_recent_actors_24px">
<div class="icon-box">
<!-- ic_recent_actors_24px -->
<svg viewBox="0 744 24 24" class="svg-ic_recent_actors_24px svg-ic_recent_actors_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_recent_actors_24px"></use>
</svg>
</div>
<h2>ic_recent_actors_24px</h2>
</li>
<li title="ic_repeat_24px">
<div class="icon-box">
<!-- ic_repeat_24px -->
<svg viewBox="0 768 24 24" class="svg-ic_repeat_24px svg-ic_repeat_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_repeat_24px"></use>
</svg>
</div>
<h2>ic_repeat_24px</h2>
</li>
<li title="ic_repeat_one_24px">
<div class="icon-box">
<!-- ic_repeat_one_24px -->
<svg viewBox="0 792 24 24" class="svg-ic_repeat_one_24px svg-ic_repeat_one_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_repeat_one_24px"></use>
</svg>
</div>
<h2>ic_repeat_one_24px</h2>
</li>
<li title="ic_replay_24px">
<div class="icon-box">
<!-- ic_replay_24px -->
<svg viewBox="0 816 24 24" class="svg-ic_replay_24px svg-ic_replay_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_replay_24px"></use>
</svg>
</div>
<h2>ic_replay_24px</h2>
</li>
<li title="ic_shuffle_24px">
<div class="icon-box">
<!-- ic_shuffle_24px -->
<svg viewBox="0 840 24 24" class="svg-ic_shuffle_24px svg-ic_shuffle_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_shuffle_24px"></use>
</svg>
</div>
<h2>ic_shuffle_24px</h2>
</li>
<li title="ic_skip_next_24px">
<div class="icon-box">
<!-- ic_skip_next_24px -->
<svg viewBox="0 864 24 24" class="svg-ic_skip_next_24px svg-ic_skip_next_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_skip_next_24px"></use>
</svg>
</div>
<h2>ic_skip_next_24px</h2>
</li>
<li title="ic_skip_previous_24px">
<div class="icon-box">
<!-- ic_skip_previous_24px -->
<svg viewBox="0 888 24 24" class="svg-ic_skip_previous_24px svg-ic_skip_previous_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_skip_previous_24px"></use>
</svg>
</div>
<h2>ic_skip_previous_24px</h2>
</li>
<li title="ic_snooze_24px">
<div class="icon-box">
<!-- ic_snooze_24px -->
<svg viewBox="0 912 24 24" class="svg-ic_snooze_24px svg-ic_snooze_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_snooze_24px"></use>
</svg>
</div>
<h2>ic_snooze_24px</h2>
</li>
<li title="ic_stop_24px">
<div class="icon-box">
<!-- ic_stop_24px -->
<svg viewBox="0 936 24 24" class="svg-ic_stop_24px svg-ic_stop_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_stop_24px"></use>
</svg>
</div>
<h2>ic_stop_24px</h2>
</li>
<li title="ic_subtitles_24px">
<div class="icon-box">
<!-- ic_subtitles_24px -->
<svg viewBox="0 960 24 24" class="svg-ic_subtitles_24px svg-ic_subtitles_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_subtitles_24px"></use>
</svg>
</div>
<h2>ic_subtitles_24px</h2>
</li>
<li title="ic_surround_sound_24px">
<div class="icon-box">
<!-- ic_surround_sound_24px -->
<svg viewBox="0 984 24 24" class="svg-ic_surround_sound_24px svg-ic_surround_sound_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_surround_sound_24px"></use>
</svg>
</div>
<h2>ic_surround_sound_24px</h2>
</li>
<li title="ic_video_collection_24px">
<div class="icon-box">
<!-- ic_video_collection_24px -->
<svg viewBox="0 1008 24 24" class="svg-ic_video_collection_24px svg-ic_video_collection_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_video_collection_24px"></use>
</svg>
</div>
<h2>ic_video_collection_24px</h2>
</li>
<li title="ic_videocam_24px">
<div class="icon-box">
<!-- ic_videocam_24px -->
<svg viewBox="0 1032 24 24" class="svg-ic_videocam_24px svg-ic_videocam_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_videocam_24px"></use>
</svg>
</div>
<h2>ic_videocam_24px</h2>
</li>
<li title="ic_videocam_off_24px">
<div class="icon-box">
<!-- ic_videocam_off_24px -->
<svg viewBox="0 1056 24 24" class="svg-ic_videocam_off_24px svg-ic_videocam_off_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_videocam_off_24px"></use>
</svg>
</div>
<h2>ic_videocam_off_24px</h2>
</li>
<li title="ic_volume_down_24px">
<div class="icon-box">
<!-- ic_volume_down_24px -->
<svg viewBox="0 1080 24 24" class="svg-ic_volume_down_24px svg-ic_volume_down_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_volume_down_24px"></use>
</svg>
</div>
<h2>ic_volume_down_24px</h2>
</li>
<li title="ic_volume_mute_24px">
<div class="icon-box">
<!-- ic_volume_mute_24px -->
<svg viewBox="0 1104 24 24" class="svg-ic_volume_mute_24px svg-ic_volume_mute_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_volume_mute_24px"></use>
</svg>
</div>
<h2>ic_volume_mute_24px</h2>
</li>
<li title="ic_volume_off_24px">
<div class="icon-box">
<!-- ic_volume_off_24px -->
<svg viewBox="0 1128 24 24" class="svg-ic_volume_off_24px svg-ic_volume_off_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_volume_off_24px"></use>
</svg>
</div>
<h2>ic_volume_off_24px</h2>
</li>
<li title="ic_volume_up_24px">
<div class="icon-box">
<!-- ic_volume_up_24px -->
<svg viewBox="0 1152 24 24" class="svg-ic_volume_up_24px svg-ic_volume_up_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_volume_up_24px"></use>
</svg>
</div>
<h2>ic_volume_up_24px</h2>
</li>
<li title="ic_web_24px">
<div class="icon-box">
<!-- ic_web_24px -->
<svg viewBox="0 1176 24 24" class="svg-ic_web_24px svg-ic_web_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="#ic_web_24px"></use>
</svg>
</div>
<h2>ic_web_24px</h2>
</li>
</ul>
<!--
====================================================================================================
-->
<!--
Inline SVG with external sprite
====================================================================================================
These SVG images make use of an URL + fragment identifiers (IDs) and refer to the regular external
SVG sprite. They may be styled via CSS. (IE 9-11 with polyfill only)
-->
<h3>B) Inline SVG with external sprite (IE 9-11 with polyfill only)</h3>
<ul>
<li title="ic_album_24px">
<div class="icon-box">
<!-- ic_album_24px -->
<svg viewBox="0 0 24 24" class="svg-ic_album_24px svg-ic_album_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_album_24px"></use>
</svg>
</div>
<h2>ic_album_24px</h2>
</li>
<li title="ic_av_timer_24px">
<div class="icon-box">
<!-- ic_av_timer_24px -->
<svg viewBox="0 24 24 24" class="svg-ic_av_timer_24px svg-ic_av_timer_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_av_timer_24px"></use>
</svg>
</div>
<h2>ic_av_timer_24px</h2>
</li>
<li title="ic_closed_caption_24px">
<div class="icon-box">
<!-- ic_closed_caption_24px -->
<svg viewBox="0 48 24 24" class="svg-ic_closed_caption_24px svg-ic_closed_caption_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_closed_caption_24px"></use>
</svg>
</div>
<h2>ic_closed_caption_24px</h2>
</li>
<li title="ic_equalizer_24px">
<div class="icon-box">
<!-- ic_equalizer_24px -->
<svg viewBox="0 72 24 24" class="svg-ic_equalizer_24px svg-ic_equalizer_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_equalizer_24px"></use>
</svg>
</div>
<h2>ic_equalizer_24px</h2>
</li>
<li title="ic_explicit_24px">
<div class="icon-box">
<!-- ic_explicit_24px -->
<svg viewBox="0 96 24 24" class="svg-ic_explicit_24px svg-ic_explicit_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_explicit_24px"></use>
</svg>
</div>
<h2>ic_explicit_24px</h2>
</li>
<li title="ic_fast_forward_24px">
<div class="icon-box">
<!-- ic_fast_forward_24px -->
<svg viewBox="0 120 24 24" class="svg-ic_fast_forward_24px svg-ic_fast_forward_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_fast_forward_24px"></use>
</svg>
</div>
<h2>ic_fast_forward_24px</h2>
</li>
<li title="ic_fast_rewind_24px">
<div class="icon-box">
<!-- ic_fast_rewind_24px -->
<svg viewBox="0 144 24 24" class="svg-ic_fast_rewind_24px svg-ic_fast_rewind_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_fast_rewind_24px"></use>
</svg>
</div>
<h2>ic_fast_rewind_24px</h2>
</li>
<li title="ic_games_24px">
<div class="icon-box">
<!-- ic_games_24px -->
<svg viewBox="0 168 24 24" class="svg-ic_games_24px svg-ic_games_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_games_24px"></use>
</svg>
</div>
<h2>ic_games_24px</h2>
</li>
<li title="ic_hearing_24px">
<div class="icon-box">
<!-- ic_hearing_24px -->
<svg viewBox="0 192 24 24" class="svg-ic_hearing_24px svg-ic_hearing_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_hearing_24px"></use>
</svg>
</div>
<h2>ic_hearing_24px</h2>
</li>
<li title="ic_high_quality_24px">
<div class="icon-box">
<!-- ic_high_quality_24px -->
<svg viewBox="0 216 24 24" class="svg-ic_high_quality_24px svg-ic_high_quality_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_high_quality_24px"></use>
</svg>
</div>
<h2>ic_high_quality_24px</h2>
</li>
<li title="ic_loop_24px">
<div class="icon-box">
<!-- ic_loop_24px -->
<svg viewBox="0 240 24 24" class="svg-ic_loop_24px svg-ic_loop_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_loop_24px"></use>
</svg>
</div>
<h2>ic_loop_24px</h2>
</li>
<li title="ic_mic_24px">
<div class="icon-box">
<!-- ic_mic_24px -->
<svg viewBox="0 264 24 24" class="svg-ic_mic_24px svg-ic_mic_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_mic_24px"></use>
</svg>
</div>
<h2>ic_mic_24px</h2>
</li>
<li title="ic_mic_none_24px">
<div class="icon-box">
<!-- ic_mic_none_24px -->
<svg viewBox="0 288 24 24" class="svg-ic_mic_none_24px svg-ic_mic_none_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_mic_none_24px"></use>
</svg>
</div>
<h2>ic_mic_none_24px</h2>
</li>
<li title="ic_mic_off_24px">
<div class="icon-box">
<!-- ic_mic_off_24px -->
<svg viewBox="0 312 24 24" class="svg-ic_mic_off_24px svg-ic_mic_off_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_mic_off_24px"></use>
</svg>
</div>
<h2>ic_mic_off_24px</h2>
</li>
<li title="ic_movie_24px">
<div class="icon-box">
<!-- ic_movie_24px -->
<svg viewBox="0 336 24 24" class="svg-ic_movie_24px svg-ic_movie_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_movie_24px"></use>
</svg>
</div>
<h2>ic_movie_24px</h2>
</li>
<li title="ic_my_library_add_24px">
<div class="icon-box">
<!-- ic_my_library_add_24px -->
<svg viewBox="0 360 24 24" class="svg-ic_my_library_add_24px svg-ic_my_library_add_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_my_library_add_24px"></use>
</svg>
</div>
<h2>ic_my_library_add_24px</h2>
</li>
<li title="ic_my_library_books_24px">
<div class="icon-box">
<!-- ic_my_library_books_24px -->
<svg viewBox="0 384 24 24" class="svg-ic_my_library_books_24px svg-ic_my_library_books_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_my_library_books_24px"></use>
</svg>
</div>
<h2>ic_my_library_books_24px</h2>
</li>
<li title="ic_my_library_music_24px">
<div class="icon-box">
<!-- ic_my_library_music_24px -->
<svg viewBox="0 408 24 24" class="svg-ic_my_library_music_24px svg-ic_my_library_music_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_my_library_music_24px"></use>
</svg>
</div>
<h2>ic_my_library_music_24px</h2>
</li>
<li title="ic_new_releases_24px">
<div class="icon-box">
<!-- ic_new_releases_24px -->
<svg viewBox="0 432 24 24" class="svg-ic_new_releases_24px svg-ic_new_releases_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_new_releases_24px"></use>
</svg>
</div>
<h2>ic_new_releases_24px</h2>
</li>
<li title="ic_not_interested_24px">
<div class="icon-box">
<!-- ic_not_interested_24px -->
<svg viewBox="0 456 24 24" class="svg-ic_not_interested_24px svg-ic_not_interested_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_not_interested_24px"></use>
</svg>
</div>
<h2>ic_not_interested_24px</h2>
</li>
<li title="ic_pause_24px">
<div class="icon-box">
<!-- ic_pause_24px -->
<svg viewBox="0 480 24 24" class="svg-ic_pause_24px svg-ic_pause_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_pause_24px"></use>
</svg>
</div>
<h2>ic_pause_24px</h2>
</li>
<li title="ic_pause_circle_fill_24px">
<div class="icon-box">
<!-- ic_pause_circle_fill_24px -->
<svg viewBox="0 504 24 24" class="svg-ic_pause_circle_fill_24px svg-ic_pause_circle_fill_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_pause_circle_fill_24px"></use>
</svg>
</div>
<h2>ic_pause_circle_fill_24px</h2>
</li>
<li title="ic_pause_circle_outline_24px">
<div class="icon-box">
<!-- ic_pause_circle_outline_24px -->
<svg viewBox="0 528 24 24" class="svg-ic_pause_circle_outline_24px svg-ic_pause_circle_outline_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_pause_circle_outline_24px"></use>
</svg>
</div>
<h2>ic_pause_circle_outline_24px</h2>
</li>
<li title="ic_play_arrow_24px">
<div class="icon-box">
<!-- ic_play_arrow_24px -->
<svg viewBox="0 552 24 24" class="svg-ic_play_arrow_24px svg-ic_play_arrow_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_play_arrow_24px"></use>
</svg>
</div>
<h2>ic_play_arrow_24px</h2>
</li>
<li title="ic_play_circle_fill_24px">
<div class="icon-box">
<!-- ic_play_circle_fill_24px -->
<svg viewBox="0 576 24 24" class="svg-ic_play_circle_fill_24px svg-ic_play_circle_fill_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_play_circle_fill_24px"></use>
</svg>
</div>
<h2>ic_play_circle_fill_24px</h2>
</li>
<li title="ic_play_circle_outline_24px">
<div class="icon-box">
<!-- ic_play_circle_outline_24px -->
<svg viewBox="0 600 24 24" class="svg-ic_play_circle_outline_24px svg-ic_play_circle_outline_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_play_circle_outline_24px"></use>
</svg>
</div>
<h2>ic_play_circle_outline_24px</h2>
</li>
<li title="ic_play_shopping_bag_24px">
<div class="icon-box">
<!-- ic_play_shopping_bag_24px -->
<svg viewBox="0 624 24 24" class="svg-ic_play_shopping_bag_24px svg-ic_play_shopping_bag_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_play_shopping_bag_24px"></use>
</svg>
</div>
<h2>ic_play_shopping_bag_24px</h2>
</li>
<li title="ic_playlist_add_24px">
<div class="icon-box">
<!-- ic_playlist_add_24px -->
<svg viewBox="0 648 24 24" class="svg-ic_playlist_add_24px svg-ic_playlist_add_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_playlist_add_24px"></use>
</svg>
</div>
<h2>ic_playlist_add_24px</h2>
</li>
<li title="ic_queue_24px">
<div class="icon-box">
<!-- ic_queue_24px -->
<svg viewBox="0 672 24 24" class="svg-ic_queue_24px svg-ic_queue_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_queue_24px"></use>
</svg>
</div>
<h2>ic_queue_24px</h2>
</li>
<li title="ic_queue_music_24px">
<div class="icon-box">
<!-- ic_queue_music_24px -->
<svg viewBox="0 696 24 24" class="svg-ic_queue_music_24px svg-ic_queue_music_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_queue_music_24px"></use>
</svg>
</div>
<h2>ic_queue_music_24px</h2>
</li>
<li title="ic_radio_24px">
<div class="icon-box">
<!-- ic_radio_24px -->
<svg viewBox="0 720 24 24" class="svg-ic_radio_24px svg-ic_radio_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_radio_24px"></use>
</svg>
</div>
<h2>ic_radio_24px</h2>
</li>
<li title="ic_recent_actors_24px">
<div class="icon-box">
<!-- ic_recent_actors_24px -->
<svg viewBox="0 744 24 24" class="svg-ic_recent_actors_24px svg-ic_recent_actors_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_recent_actors_24px"></use>
</svg>
</div>
<h2>ic_recent_actors_24px</h2>
</li>
<li title="ic_repeat_24px">
<div class="icon-box">
<!-- ic_repeat_24px -->
<svg viewBox="0 768 24 24" class="svg-ic_repeat_24px svg-ic_repeat_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_repeat_24px"></use>
</svg>
</div>
<h2>ic_repeat_24px</h2>
</li>
<li title="ic_repeat_one_24px">
<div class="icon-box">
<!-- ic_repeat_one_24px -->
<svg viewBox="0 792 24 24" class="svg-ic_repeat_one_24px svg-ic_repeat_one_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_repeat_one_24px"></use>
</svg>
</div>
<h2>ic_repeat_one_24px</h2>
</li>
<li title="ic_replay_24px">
<div class="icon-box">
<!-- ic_replay_24px -->
<svg viewBox="0 816 24 24" class="svg-ic_replay_24px svg-ic_replay_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_replay_24px"></use>
</svg>
</div>
<h2>ic_replay_24px</h2>
</li>
<li title="ic_shuffle_24px">
<div class="icon-box">
<!-- ic_shuffle_24px -->
<svg viewBox="0 840 24 24" class="svg-ic_shuffle_24px svg-ic_shuffle_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_shuffle_24px"></use>
</svg>
</div>
<h2>ic_shuffle_24px</h2>
</li>
<li title="ic_skip_next_24px">
<div class="icon-box">
<!-- ic_skip_next_24px -->
<svg viewBox="0 864 24 24" class="svg-ic_skip_next_24px svg-ic_skip_next_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_skip_next_24px"></use>
</svg>
</div>
<h2>ic_skip_next_24px</h2>
</li>
<li title="ic_skip_previous_24px">
<div class="icon-box">
<!-- ic_skip_previous_24px -->
<svg viewBox="0 888 24 24" class="svg-ic_skip_previous_24px svg-ic_skip_previous_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_skip_previous_24px"></use>
</svg>
</div>
<h2>ic_skip_previous_24px</h2>
</li>
<li title="ic_snooze_24px">
<div class="icon-box">
<!-- ic_snooze_24px -->
<svg viewBox="0 912 24 24" class="svg-ic_snooze_24px svg-ic_snooze_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_snooze_24px"></use>
</svg>
</div>
<h2>ic_snooze_24px</h2>
</li>
<li title="ic_stop_24px">
<div class="icon-box">
<!-- ic_stop_24px -->
<svg viewBox="0 936 24 24" class="svg-ic_stop_24px svg-ic_stop_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_stop_24px"></use>
</svg>
</div>
<h2>ic_stop_24px</h2>
</li>
<li title="ic_subtitles_24px">
<div class="icon-box">
<!-- ic_subtitles_24px -->
<svg viewBox="0 960 24 24" class="svg-ic_subtitles_24px svg-ic_subtitles_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_subtitles_24px"></use>
</svg>
</div>
<h2>ic_subtitles_24px</h2>
</li>
<li title="ic_surround_sound_24px">
<div class="icon-box">
<!-- ic_surround_sound_24px -->
<svg viewBox="0 984 24 24" class="svg-ic_surround_sound_24px svg-ic_surround_sound_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_surround_sound_24px"></use>
</svg>
</div>
<h2>ic_surround_sound_24px</h2>
</li>
<li title="ic_video_collection_24px">
<div class="icon-box">
<!-- ic_video_collection_24px -->
<svg viewBox="0 1008 24 24" class="svg-ic_video_collection_24px svg-ic_video_collection_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_video_collection_24px"></use>
</svg>
</div>
<h2>ic_video_collection_24px</h2>
</li>
<li title="ic_videocam_24px">
<div class="icon-box">
<!-- ic_videocam_24px -->
<svg viewBox="0 1032 24 24" class="svg-ic_videocam_24px svg-ic_videocam_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_videocam_24px"></use>
</svg>
</div>
<h2>ic_videocam_24px</h2>
</li>
<li title="ic_videocam_off_24px">
<div class="icon-box">
<!-- ic_videocam_off_24px -->
<svg viewBox="0 1056 24 24" class="svg-ic_videocam_off_24px svg-ic_videocam_off_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_videocam_off_24px"></use>
</svg>
</div>
<h2>ic_videocam_off_24px</h2>
</li>
<li title="ic_volume_down_24px">
<div class="icon-box">
<!-- ic_volume_down_24px -->
<svg viewBox="0 1080 24 24" class="svg-ic_volume_down_24px svg-ic_volume_down_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_volume_down_24px"></use>
</svg>
</div>
<h2>ic_volume_down_24px</h2>
</li>
<li title="ic_volume_mute_24px">
<div class="icon-box">
<!-- ic_volume_mute_24px -->
<svg viewBox="0 1104 24 24" class="svg-ic_volume_mute_24px svg-ic_volume_mute_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_volume_mute_24px"></use>
</svg>
</div>
<h2>ic_volume_mute_24px</h2>
</li>
<li title="ic_volume_off_24px">
<div class="icon-box">
<!-- ic_volume_off_24px -->
<svg viewBox="0 1128 24 24" class="svg-ic_volume_off_24px svg-ic_volume_off_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_volume_off_24px"></use>
</svg>
</div>
<h2>ic_volume_off_24px</h2>
</li>
<li title="ic_volume_up_24px">
<div class="icon-box">
<!-- ic_volume_up_24px -->
<svg viewBox="0 1152 24 24" class="svg-ic_volume_up_24px svg-ic_volume_up_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_volume_up_24px"></use>
</svg>
</div>
<h2>ic_volume_up_24px</h2>
</li>
<li title="ic_web_24px">
<div class="icon-box">
<!-- ic_web_24px -->
<svg viewBox="0 1176 24 24" class="svg-ic_web_24px svg-ic_web_24px-dims" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<use xlink:href="svg/sprite.svg#ic_web_24px"></use>
</svg>
</div>
<h2>ic_web_24px</h2>
</li>
</ul>
<!--
====================================================================================================
-->
</section>
<footer>
<p>Generated at Wed, 15 Oct 2014 21:41:53 GMT by <a href="https://github.com/jkphl/svg-sprite" target="_blank">svg-sprite</a>.</p>
</footer>
</body>
</html>