josemi/icons

drawing-compass

v0.7.0

Download

Download the icon as SVG image.

Download Icon

Customize icon

Set your custom size or color and download the icon as SVG or PNG image.

Width

Height

Color

Get SVG

Get PNG

Using as SVG

Copy and paste the following SVG code into your HTML file where you want the icon to appear. Then, you can customize the SVG attributes, such as size or color, using inline styling or CSS classes.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em">
    <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 2C11.4477 2 11 2.44772 11 3L11 4.40625C9.88842 4.84551 9 5.73224 9 7C9 7.8033 9.32962 8.524 9.84375 9.0625L7 14.75C6.85647 14.6007 6.66684 14.5377 6.53125 14.375C6.03724 13.7822 5.63145 13.1379 5.3125 12.5C5.12406 12.1231 4.98578 11.8323 4.9375 11.6875C4.76285 11.1636 4.21144 10.8879 3.6875 11.0625C3.16356 11.2371 2.88785 11.7886 3.0625 12.3125C3.34863 13.1709 3.93988 14.3904 4.96875 15.625C5.28831 16.0085 5.7342 16.2057 6.09375 16.5312L4.09375 20.5625C3.84676 21.0565 4.06852 21.6593 4.5625 21.9062C5.05648 22.1532 5.65926 21.9315 5.90625 21.4375L7.71875 17.8438C8.97253 18.5394 10.3766 19 12 19C13.6234 19 15.0275 18.5394 16.2812 17.8438L18.0938 21.4375C18.3407 21.9315 18.9435 22.1532 19.4375 21.9062C19.9315 21.6593 20.1532 21.0565 19.9062 20.5625L17.9062 16.5312C18.2658 16.2057 18.7117 16.0085 19.0312 15.625C20.0601 14.3904 20.6514 13.1709 20.9375 12.3125C21.1121 11.7886 20.8364 11.2371 20.3125 11.0625C19.7886 10.8879 19.2371 11.1636 19.0625 11.6875C19.0142 11.8323 18.8759 12.1231 18.6875 12.5C18.3685 13.1379 17.9628 13.7822 17.4688 14.375C17.3332 14.5377 17.1435 14.6007 17 14.75L14.1562 9.0625C14.6704 8.524 15 7.8033 15 7C15 5.73224 14.1116 4.84551 13 4.40625L13 3C13 2.44772 12.5523 2 12 2ZM12 6C12.5523 6 13 6.44771 13 7C13 7.55228 12.5523 8 12 8C11.4477 8 11 7.55228 11 7C11 6.44772 11.4477 6 12 6ZM11.6875 9.875C11.8051 9.889 11.8787 10 12 10C12.1213 10 12.1949 9.889 12.3125 9.875L15.4062 16.0625C14.4117 16.6345 13.3019 17 12 17C10.6981 17 9.58831 16.6345 8.59375 16.0625L11.6875 9.875Z" />
</svg>

Using with React

Install @josemi-icons/react and import the icon component in your React application:

import {DrawingCompassIcon} from "@josemi-icons/react";

const MyComponent = () => {
    return (
        <DrawingCompassIcon />
    );
};

Using with CSS

Install @josemi-icons/css and include the icon as a CSS class:

<i class="ji-drawing-compass"></i>