UCLA Component Library

Denotive Icons SVG: Menu 

<!-- Menu Black -->
<svg width="48px" height="48px" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <title>Menu</title>
    <defs>
        <path d="M8,36 L40,36 L40,32 L8,32 L8,36 Z M8,26 L40,26 L40,22 L8,22 L8,26 Z M8,12 L8,16 L40,16 L40,12 L8,12 Z" id="path-1"></path>
    </defs>
    <g id="Icon/menu-defaultblue" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <mask id="mask-2" fill="white">
            <use xlink:href="#path-1"></use>
        </mask>
        <use id="Shape" fill="#000000" xlink:href="#path-1"></use>
    </g>
</svg>

<div style="background: #2774AE; display: inline-block;">
    <!-- Menu White -->
    <svg width="48px" height="48px" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
        <title>Menu</title>
        <defs>
            <path d="M8,36 L40,36 L40,32 L8,32 L8,36 Z M8,26 L40,26 L40,22 L8,22 L8,26 Z M8,12 L8,16 L40,16 L40,12 L8,12 Z" id="path-1"></path>
        </defs>
        <g id="Icon/menu-defaultblue" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <mask id="mask-2" fill="white">
                <use xlink:href="#path-1"></use>
            </mask>
            <use id="Shape" fill="#FFFFFF" xlink:href="#path-1"></use>
        </g>
    </svg>
</div>

<!-- Menu Blue -->
<svg width="48px" height="48px" viewBox="0 0 48 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <title>Menu</title>
    <defs>
        <path d="M8,36 L40,36 L40,32 L8,32 L8,36 Z M8,26 L40,26 L40,22 L8,22 L8,26 Z M8,12 L8,16 L40,16 L40,12 L8,12 Z" id="path-1"></path>
    </defs>
    <g id="Icon/menu-defaultblue" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <mask id="mask-2" fill="white">
            <use xlink:href="#path-1"></use>
        </mask>
        <use id="Shape" fill="#00598C" xlink:href="#path-1"></use>
    </g>
</svg>