Settings icon in outline, twotone, bold and bulk. Free in all four styles, for buttons, forms, toolbars, menus, states. Copy the SVG, the React, Vue or Svelte component, or download a PNG.
import { IconSettings } from "@devigner-ui/icons";
<IconSettings className="size-6" />
<script setup>
import { IconSettings } from "@devigner-ui/icons-vue";
</script>
<template>
<IconSettings class="size-6" />
</template>
<script>
import { IconSettings } from "@devigner-ui/icons-svelte";
</script>
<IconSettings class="size-6" />
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="12.0005" r="3" stroke="currentColor" stroke-width="1.5"></circle><path opacity="1" d="M13.77 2.15C13.4 2 12.93 2 12 2s-1.4 0-1.77.15a2 2 0 0 0-1.08 1.09 2 2 0 0 0-.14.86 1.58 1.58 0 0 1-2.36 1.35 3 3 0 0 0-.82-.3 2 2 0 0 0-1.48.4c-.31.24-.54.64-1.01 1.45s-.7 1.21-.75 1.6a2 2 0 0 0 .4 1.48c.14.2.35.36.67.56.47.3.78.8.78 1.36s-.3 1.06-.78 1.36q-.47.28-.67.56a2 2 0 0 0-.4 1.48c.05.39.28.8.75 1.6s.7 1.21 1.01 1.45a2 2 0 0 0 1.48.4q.34-.05.82-.3c.5-.27 1.09-.28 1.57 0s.77.8.79 1.35c.01.38.05.64.14.87a2 2 0 0 0 1.08 1.08c.37.15.84.15 1.77.15s1.4 0 1.77-.15a2 2 0 0 0 1.08-1.08c.09-.23.13-.49.14-.87.02-.56.3-1.07.8-1.35a1.6 1.6 0 0 1 1.56 0q.48.25.82.3a2 2 0 0 0 1.48-.4c.31-.24.54-.64 1.01-1.45s.7-1.21.75-1.6a2 2 0 0 0-.4-1.48 2 2 0 0 0-.67-.56c-.47-.3-.78-.8-.78-1.36s.3-1.06.78-1.36a2 2 0 0 0 1.07-2.03c-.05-.4-.28-.8-.75-1.61-.47-.8-.7-1.21-1.01-1.45a2 2 0 0 0-1.48-.4q-.34.05-.82.3c-.5.27-1.09.28-1.57 0s-.77-.8-.79-1.35a3 3 0 0 0-.14-.86 2 2 0 0 0-1.08-1.09" stroke="currentColor" stroke-width="1.5"></path></svg>