Compass Icon
Free SVG icon from the VS Code Codicons collection. Download or copy for use in any project.
The Compass icon is available as a free SVG and is ready to drop into any web or app project.
img tag
<img src="https://proicons.com/icon/307073.svg" alt="Compass icon" width="24" height="24">
React JSX
<img src="https://proicons.com/icon/307073.svg" alt="Compass icon" width={24} height={24} />
Vue template
<img src="https://proicons.com/icon/307073.svg" alt="Compass icon" :width="24" :height="24" />
CSS background
.icon-compass {
background-image: url('https://proicons.com/icon/307073.svg');
background-size: contain;
background-repeat: no-repeat;
width: 24px;
height: 24px;
display: inline-block;
}
SVG markup
<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="currentColor"><path fill-rule="evenodd" clip-rule="evenodd" d="M6.47854 5.13086C5.61226 4.68207 4.68182 5.61251 5.13063 6.47879L6.11941 8.38733C6.45099 9.02734 6.97209 9.54937 7.61152 9.88209L9.53337 10.8821C10.4005 11.3334 11.3333 10.4005 10.882 9.53339L9.88189 7.61161C9.54916 6.97225 9.02715 6.4512 8.38717 6.11965L6.47854 5.13086ZM6.01854 6.01877L7.92717 7.00757C8.3843 7.24439 8.75716 7.61657 8.99483 8.07325L9.99496 9.99504L8.07311 8.995C7.61638 8.75735 7.24417 8.38447 7.00732 7.92731L6.01854 6.01877Z"/><path fill-rule="evenodd" clip-rule="evenodd" d="M1 8.00049C1 4.1345 4.13401 1.00049 8 1.00049C11.866 1.00049 15 4.1345 15 8.00049C15 11.8665 11.866 15.0005 8 15.0005C4.13401 15.0005 1 11.8665 1 8.00049ZM8 2.00049C4.68629 2.00049 2 4.68678 2 8.00049C2 11.3142 4.68629 14.0005 8 14.0005C11.3137 14.0005 14 11.3142 14 8.00049C14 4.68678 11.3137 2.00049 8 2.00049Z"/></svg>
Compass in other icon packs
Copied!