UCLA Component Library

Denotive Icons SVG: Clear 

<!-- Clear Grey-60-->
<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>Clear</title>
    <g id="Icon/clear-grey60" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <path d="M24,4 C35.04,4 44,12.96 44,24 C44,35.04 35.04,44 24,44 C12.96,44 4,35.04 4,24 C4,12.96 12.96,4 24,4 Z M31.0710678,14.1005051 L24,21.172 L16.9289322,14.1005051 L14.1005051,16.9289322 L21.172,24 L14.1005051,31.0710678 L16.9289322,33.8994949 L24,26.828 L31.0710678,33.8994949 L33.8994949,31.0710678 L26.828,24 L33.8994949,16.9289322 L31.0710678,14.1005051 Z" id="Shape" fill="#666666" fill-rule="nonzero"></path>
    </g>
</svg>

<!-- Clear 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>Clear</title>
    <g id="Icon/clear-grey60" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <path d="M24,4 C35.04,4 44,12.96 44,24 C44,35.04 35.04,44 24,44 C12.96,44 4,35.04 4,24 C4,12.96 12.96,4 24,4 Z M31.0710678,14.1005051 L24,21.172 L16.9289322,14.1005051 L14.1005051,16.9289322 L21.172,24 L14.1005051,31.0710678 L16.9289322,33.8994949 L24,26.828 L31.0710678,33.8994949 L33.8994949,31.0710678 L26.828,24 L33.8994949,16.9289322 L31.0710678,14.1005051 Z" id="Shape" fill="#000000" fill-rule="nonzero"></path>
    </g>
</svg>

<div style="background: #2774AE; display: inline-block;">
    <!-- Clear 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>Clear</title>
        <g id="Icon/clear-grey60" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <path d="M24,4 C35.04,4 44,12.96 44,24 C44,35.04 35.04,44 24,44 C12.96,44 4,35.04 4,24 C4,12.96 12.96,4 24,4 Z M31.0710678,14.1005051 L24,21.172 L16.9289322,14.1005051 L14.1005051,16.9289322 L21.172,24 L14.1005051,31.0710678 L16.9289322,33.8994949 L24,26.828 L31.0710678,33.8994949 L33.8994949,31.0710678 L26.828,24 L33.8994949,16.9289322 L31.0710678,14.1005051 Z" id="Shape" fill="#FFFFFF" fill-rule="nonzero"></path>
        </g>
    </svg>
</div>