UCLA Component Library

Denotive Icons SVG: External Link 

<!-- External Link 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>External Link</title>
    <g id="Icon/external-link-defaultblue" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <path d="M31,38 L10,38 L10,17 L17,17 L17,10 L38,10 L38,31 L31,31 L31,38 Z M34.5,13.5 L20.5,13.5 L20.5,27.5 L34.5,27.5 L34.5,13.5 Z M17,31 L17,20.5 L13.5,20.5 L13.5,34.5 L27.5,34.5 L27.5,31 L17,31 Z" id="Combined-Shape" fill="#000000"></path>
    </g>
</svg>

<div style="background: #2774AE; display: inline-block;">
    <!-- External Link 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>External Link</title>
        <g id="Icon/external-link-defaultblue" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <path d="M31,38 L10,38 L10,17 L17,17 L17,10 L38,10 L38,31 L31,31 L31,38 Z M34.5,13.5 L20.5,13.5 L20.5,27.5 L34.5,27.5 L34.5,13.5 Z M17,31 L17,20.5 L13.5,20.5 L13.5,34.5 L27.5,34.5 L27.5,31 L17,31 Z" id="Combined-Shape" fill="#FFFFFF"></path>
        </g>
    </svg>
</div>

<!-- External Link 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>External Link</title>
    <g id="Icon/external-link-defaultblue" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <path d="M31,38 L10,38 L10,17 L17,17 L17,10 L38,10 L38,31 L31,31 L31,38 Z M34.5,13.5 L20.5,13.5 L20.5,27.5 L34.5,27.5 L34.5,13.5 Z M17,31 L17,20.5 L13.5,20.5 L13.5,34.5 L27.5,34.5 L27.5,31 L17,31 Z" id="Combined-Shape" fill="#00598C"></path>
    </g>
</svg>