UCLA Component Library

Denotive Icons SVG: Left Arrow 

<!-- Left Arrow 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>Arrow Left</title>
    <g id="Icon/arrow-left-black" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <polygon id="Shape" fill="#000000" transform="translate(24.590000, 24.000000) scale(-1, 1) translate(-24.590000, -24.000000) " points="17.18 33.18 26.34 24 17.18 14.82 20 12 32 24 20 36"></polygon>
    </g>
</svg>

<div style="background: #2774AE; display: inline-block;">
    <!-- Left Arrow 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>Arrow Left</title>
        <g id="Icon/arrow-left-black" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <polygon id="Shape" fill="#FFFFFF" transform="translate(24.590000, 24.000000) scale(-1, 1) translate(-24.590000, -24.000000) " points="17.18 33.18 26.34 24 17.18 14.82 20 12 32 24 20 36"></polygon>
        </g>
    </svg>
</div>

<!-- Left Arrow 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>Arrow Left</title>
    <g id="Icon/arrow-left-black" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <polygon id="Shape" fill="#00598C" transform="translate(24.590000, 24.000000) scale(-1, 1) translate(-24.590000, -24.000000) " points="17.18 33.18 26.34 24 17.18 14.82 20 12 32 24 20 36"></polygon>
    </g>
</svg>