Snail icon
Download the Snail icon as free SVG or PNG. Customize its outline stroke. Copy React, Vue or Svelte code.
- slug
- shell
- slow
- animal
- nature
- garden
- mollusc
- pace
Size
Stroke
Color
- Category
- general
- Styles
- Outline
- Component
- IconSnail
- License
- MIT · Paweł Kuna
- Files
-
outline/snail.svg
Code
Copy it the way you use it
snail.svg
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M11 11c-1.25 0 -2 .755 -2 2s1.372 3 3 3c2.01 0 4 -2.51 4 -5c0 -2.585 -3.223 -5 -6 -5c-3.543 0 -6 2.266 -6 6c0 1.5 .393 2.107 .75 3c.5 1.25 1.804 2.257 2.25 3q -1.034 .099 -2.527 .063a1.44 1.44 0 0 0 -1.473 1.437a1.5 1.5 0 0 0 1.5 1.5h11.71a3.75 3.75 0 0 0 3.083 -1.612c.712 -1.016 .707 -2.138 .707 -3.388v-7a2 2 0 1 0 -4 0v2" />
<path d="M21 3c-.862 .479 -1.904 1.76 -2 4.25" />
<path d="M17 3c-.383 .766 -1.053 2.43 0 4.25" />
</svg> Use the Snail icon
For a decorative icon beside text, add aria-hidden="true" to the SVG. For an icon-only control, put its accessible name on the button or link.
React example
import { IconSnail } from '@tabler/icons-react';
<IconSnail size={24} stroke={2} />Read the React guideVue example
import { IconSnail } from '@tabler/icons-vue';
<IconSnail :size="24" :stroke="2" />Read the Vue guideSvelte 5 example
import { IconSnail } from '@tabler/icons-svelte-runes';
<IconSnail size={24} stroke={2} />Read the Svelte guideRelated