# bat icon

Bat. Gentleface icon, drawn on the 16 px pixel grid. Free, MIT licensed. Page: https://gentleface.com/icons/bat

- Category: Nature & animals
- Use it for: bat, nocturnal animal
- Tags: bat, animal, nocturnal, night, halloween, wings, flying, mammal, vampire, cave
- Component name: BatIcon
- Added: 2026-11-07
- Since: version 0.6.0
- npm: `import { BatIcon } from '@gentleface/react';` (@gentleface/react 0.6.0)

## Files

Each icon is drawn on the 16 px grid, and most also on the 20 and 24 px grids (at 24 in three weights: light 1 px, regular 1.5 px, bold 2 px). Show the drawing made for your size, or an exact multiple of it, on whole pixels: 16 for 16 and 32 px, 20 for 20 and 40, 24 for 24 and 48. A size in between or a fractional position blurs it. The code on each icon page is the 16 px drawing, an SVG with fill="currentColor"; the icon page's downloads follow its Grid switch, and npm has the 20 and 24 px drawings too.

- line-round: https://gentleface.com/svg/line-round/16/bat.svg · PNG https://gentleface.com/png/line-round/16/bat.png · https://gentleface.com/png/line-round/32/bat.png · https://gentleface.com/png/line-round/48/bat.png
- line-soft: https://gentleface.com/svg/line-soft/16/bat.svg · PNG https://gentleface.com/png/line-soft/16/bat.png · https://gentleface.com/png/line-soft/32/bat.png · https://gentleface.com/png/line-soft/48/bat.png
- line-sharp: https://gentleface.com/svg/line-sharp/16/bat.svg · PNG https://gentleface.com/png/line-sharp/16/bat.png · https://gentleface.com/png/line-sharp/32/bat.png · https://gentleface.com/png/line-sharp/48/bat.png
- solid-round: https://gentleface.com/svg/solid-round/16/bat.svg · PNG https://gentleface.com/png/solid-round/16/bat.png · https://gentleface.com/png/solid-round/32/bat.png · https://gentleface.com/png/solid-round/48/bat.png
- solid-soft: https://gentleface.com/svg/solid-soft/16/bat.svg · PNG https://gentleface.com/png/solid-soft/16/bat.png · https://gentleface.com/png/solid-soft/32/bat.png · https://gentleface.com/png/solid-soft/48/bat.png
- solid-sharp: https://gentleface.com/svg/solid-sharp/16/bat.svg · PNG https://gentleface.com/png/solid-sharp/16/bat.png · https://gentleface.com/png/solid-sharp/32/bat.png · https://gentleface.com/png/solid-sharp/48/bat.png

The SVG of every style: https://gentleface.com/icons/bat.json (`svg`).

## Code (line-round)

The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. For another style, take its SVG from the JSON and swap the path `d`.

### SVG

```svg
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z"/></svg>
```

### React

```tsx
// Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat
import type { SVGProps } from 'react';

export function BatIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z" />
    </svg>
  );
}
```

### Vue

```vue
<!-- Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat -->
<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true">
    <path d="M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z" />
  </svg>
</template>
```

### Svelte

```svelte
<!-- Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat -->
<script>
  let props = $props();
</script>

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" {...props}>
  <path d="M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z" />
</svg>
```

### HTML img

```html
<!-- Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat. An <img> can't take currentColor: it draws black. Inline the SVG or use the CSS mask to color it. -->
<img src="https://gentleface.com/svg/line-round/16/bat.svg" width="16" height="16" alt="">
```

### CSS

```css
/* Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat. Takes the text color. */
.icon-bat {
  display: inline-block;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}
```

### Data URL

```text
data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='currentColor'%3E%3Cpath d='M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z'/%3E%3C/svg%3E
```

### Sprite

```html
<!-- Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat
     Every icon of this style in one file: https://gentleface.com/sprite/line-round.svg
     Serve it from your own origin: <use> does not load from another origin. -->
<svg width="16" height="16" aria-hidden="true"><use href="/sprite/line-round.svg#bat"/></svg>
```

### SwiftUI

```swift
// Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat
import SwiftUI

struct BatIcon: Shape {
    func path(in rect: CGRect) -> Path {
        var p = Path()
        p.move(to: CGPoint(x: 8.553, y: 2.776))
        p.addCurve(to: CGPoint(x: 8.842, y: 2.526), control1: CGPoint(x: 8.615, y: 2.653), control2: CGPoint(x: 8.711, y: 2.569))
        p.addCurve(to: CGPoint(x: 9.224, y: 2.553), control1: CGPoint(x: 8.973, y: 2.482), control2: CGPoint(x: 9.1, y: 2.491))
        p.addCurve(to: CGPoint(x: 9.495, y: 2.929), control1: CGPoint(x: 9.38, y: 2.631), control2: CGPoint(x: 9.47, y: 2.756))
        p.addLine(to: CGPoint(x: 9.756, y: 4.753))
        p.addCurve(to: CGPoint(x: 10.007, y: 4.272), control1: CGPoint(x: 9.855, y: 4.548), control2: CGPoint(x: 9.939, y: 4.388))
        p.addCurve(to: CGPoint(x: 10.368, y: 3.789), control1: CGPoint(x: 10.129, y: 4.066), control2: CGPoint(x: 10.25, y: 3.905))
        p.addCurve(to: CGPoint(x: 11, y: 3.5), control1: CGPoint(x: 10.564, y: 3.596), control2: CGPoint(x: 10.774, y: 3.5))
        p.addCurve(to: CGPoint(x: 11.291, y: 3.593), control1: CGPoint(x: 11.107, y: 3.5), control2: CGPoint(x: 11.204, y: 3.531))
        p.addLine(to: CGPoint(x: 14.791, y: 6.093))
        p.addCurve(to: CGPoint(x: 14.993, y: 6.418), control1: CGPoint(x: 14.903, y: 6.173), control2: CGPoint(x: 14.97, y: 6.282))
        p.addCurve(to: CGPoint(x: 14.907, y: 6.791), control1: CGPoint(x: 15.016, y: 6.554), control2: CGPoint(x: 14.987, y: 6.678))
        p.addCurve(to: CGPoint(x: 14.765, y: 6.924), control1: CGPoint(x: 14.868, y: 6.844), control2: CGPoint(x: 14.821, y: 6.889))
        p.addCurve(to: CGPoint(x: 13.434, y: 8.248), control1: CGPoint(x: 14.169, y: 7.296), control2: CGPoint(x: 13.726, y: 7.738))
        p.addCurve(to: CGPoint(x: 13, y: 10), control1: CGPoint(x: 13.145, y: 8.755), control2: CGPoint(x: 13, y: 9.339))
        p.addCurve(to: CGPoint(x: 12.856, y: 10.356), control1: CGPoint(x: 13, y: 10.141), control2: CGPoint(x: 12.952, y: 10.259))
        p.addCurve(to: CGPoint(x: 12.5, y: 10.5), control1: CGPoint(x: 12.759, y: 10.452), control2: CGPoint(x: 12.641, y: 10.5))
        p.addCurve(to: CGPoint(x: 12.475, y: 10.499), control1: CGPoint(x: 12.492, y: 10.5), control2: CGPoint(x: 12.483, y: 10.5))
        p.addLine(to: CGPoint(x: 12.47, y: 10.499))
        p.addCurve(to: CGPoint(x: 12.445, y: 10.497), control1: CGPoint(x: 12.461, y: 10.499), control2: CGPoint(x: 12.453, y: 10.498))
        p.addCurve(to: CGPoint(x: 10.697, y: 10.71), control1: CGPoint(x: 11.782, y: 10.423), control2: CGPoint(x: 11.2, y: 10.494))
        p.addCurve(to: CGPoint(x: 9.489, y: 11.679), control1: CGPoint(x: 10.237, y: 10.907), control2: CGPoint(x: 9.834, y: 11.23))
        p.addCurve(to: CGPoint(x: 9.395, y: 12.052), control1: CGPoint(x: 9.474, y: 11.807), control2: CGPoint(x: 9.443, y: 11.931))
        p.addCurve(to: CGPoint(x: 9.061, y: 12.561), control1: CGPoint(x: 9.318, y: 12.245), control2: CGPoint(x: 9.207, y: 12.414))
        p.addCurve(to: CGPoint(x: 8.552, y: 12.895), control1: CGPoint(x: 8.914, y: 12.707), control2: CGPoint(x: 8.745, y: 12.818))
        p.addCurve(to: CGPoint(x: 8, y: 13), control1: CGPoint(x: 8.375, y: 12.965), control2: CGPoint(x: 8.191, y: 13))
        p.addCurve(to: CGPoint(x: 7.448, y: 12.895), control1: CGPoint(x: 7.809, y: 13), control2: CGPoint(x: 7.625, y: 12.965))
        p.addCurve(to: CGPoint(x: 6.939, y: 12.561), control1: CGPoint(x: 7.255, y: 12.818), control2: CGPoint(x: 7.086, y: 12.707))
        p.addCurve(to: CGPoint(x: 6.605, y: 12.052), control1: CGPoint(x: 6.793, y: 12.414), control2: CGPoint(x: 6.682, y: 12.245))
        p.addCurve(to: CGPoint(x: 6.511, y: 11.679), control1: CGPoint(x: 6.557, y: 11.931), control2: CGPoint(x: 6.526, y: 11.807))
        p.addCurve(to: CGPoint(x: 5.303, y: 10.71), control1: CGPoint(x: 6.166, y: 11.23), control2: CGPoint(x: 5.763, y: 10.907))
        p.addCurve(to: CGPoint(x: 3.555, y: 10.497), control1: CGPoint(x: 4.8, y: 10.494), control2: CGPoint(x: 4.218, y: 10.423))
        p.addCurve(to: CGPoint(x: 3.188, y: 10.39), control1: CGPoint(x: 3.418, y: 10.512), control2: CGPoint(x: 3.295, y: 10.477))
        p.addCurve(to: CGPoint(x: 3.003, y: 10.055), control1: CGPoint(x: 3.08, y: 10.304), control2: CGPoint(x: 3.018, y: 10.192))
        p.addCurve(to: CGPoint(x: 3, y: 10), control1: CGPoint(x: 3.001, y: 10.037), control2: CGPoint(x: 3, y: 10.018))
        p.addCurve(to: CGPoint(x: 2.566, y: 8.248), control1: CGPoint(x: 3, y: 9.339), control2: CGPoint(x: 2.855, y: 8.755))
        p.addCurve(to: CGPoint(x: 1.235, y: 6.924), control1: CGPoint(x: 2.274, y: 7.738), control2: CGPoint(x: 1.831, y: 7.296))
        p.addCurve(to: CGPoint(x: 1.01, y: 6.613), control1: CGPoint(x: 1.115, y: 6.849), control2: CGPoint(x: 1.04, y: 6.746))
        p.addCurve(to: CGPoint(x: 1.076, y: 6.235), control1: CGPoint(x: 0.979, y: 6.481), control2: CGPoint(x: 1.001, y: 6.355))
        p.addCurve(to: CGPoint(x: 1.209, y: 6.093), control1: CGPoint(x: 1.111, y: 6.179), control2: CGPoint(x: 1.156, y: 6.132))
        p.addLine(to: CGPoint(x: 4.709, y: 3.593))
        p.addCurve(to: CGPoint(x: 5, y: 3.5), control1: CGPoint(x: 4.796, y: 3.531), control2: CGPoint(x: 4.893, y: 3.5))
        p.addCurve(to: CGPoint(x: 5.632, y: 3.789), control1: CGPoint(x: 5.226, y: 3.5), control2: CGPoint(x: 5.436, y: 3.596))
        p.addCurve(to: CGPoint(x: 5.993, y: 4.272), control1: CGPoint(x: 5.75, y: 3.905), control2: CGPoint(x: 5.871, y: 4.066))
        p.addCurve(to: CGPoint(x: 6.244, y: 4.753), control1: CGPoint(x: 6.061, y: 4.388), control2: CGPoint(x: 6.145, y: 4.548))
        p.addLine(to: CGPoint(x: 6.505, y: 2.929))
        p.addCurve(to: CGPoint(x: 6.698, y: 2.598), control1: CGPoint(x: 6.525, y: 2.79), control2: CGPoint(x: 6.589, y: 2.679))
        p.addCurve(to: CGPoint(x: 7.071, y: 2.505), control1: CGPoint(x: 6.807, y: 2.516), control2: CGPoint(x: 6.931, y: 2.485))
        p.addCurve(to: CGPoint(x: 7.447, y: 2.776), control1: CGPoint(x: 7.244, y: 2.53), control2: CGPoint(x: 7.369, y: 2.62))
        p.addLine(to: CGPoint(x: 8, y: 3.882))
        p.addLine(to: CGPoint(x: 8.553, y: 2.776))
        p.closeSubpath()
        p.move(to: CGPoint(x: 7.498, y: 11.45))
        p.addLine(to: CGPoint(x: 7.498, y: 11.45))
        p.addCurve(to: CGPoint(x: 7.499, y: 11.477), control1: CGPoint(x: 7.498, y: 11.459), control2: CGPoint(x: 7.499, y: 11.468))
        p.addLine(to: CGPoint(x: 7.5, y: 11.482))
        p.addCurve(to: CGPoint(x: 7.5, y: 11.5), control1: CGPoint(x: 7.5, y: 11.488), control2: CGPoint(x: 7.5, y: 11.494))
        p.addCurve(to: CGPoint(x: 7.646, y: 11.854), control1: CGPoint(x: 7.5, y: 11.638), control2: CGPoint(x: 7.549, y: 11.756))
        p.addCurve(to: CGPoint(x: 8, y: 12), control1: CGPoint(x: 7.744, y: 11.951), control2: CGPoint(x: 7.862, y: 12))
        p.addCurve(to: CGPoint(x: 8.354, y: 11.854), control1: CGPoint(x: 8.138, y: 12), control2: CGPoint(x: 8.256, y: 11.951))
        p.addCurve(to: CGPoint(x: 8.5, y: 11.5), control1: CGPoint(x: 8.451, y: 11.756), control2: CGPoint(x: 8.5, y: 11.638))
        p.addCurve(to: CGPoint(x: 8.5, y: 11.481), control1: CGPoint(x: 8.5, y: 11.494), control2: CGPoint(x: 8.5, y: 11.487))
        p.addLine(to: CGPoint(x: 8.501, y: 11.476))
        p.addCurve(to: CGPoint(x: 8.502, y: 11.453), control1: CGPoint(x: 8.501, y: 11.469), control2: CGPoint(x: 8.501, y: 11.461))
        p.addLine(to: CGPoint(x: 8.502, y: 11.453))
        p.addLine(to: CGPoint(x: 8.996, y: 6.511))
        p.addLine(to: CGPoint(x: 8.731, y: 4.655))
        p.addLine(to: CGPoint(x: 8.447, y: 5.224))
        p.addCurve(to: CGPoint(x: 8.224, y: 5.447), control1: CGPoint(x: 8.398, y: 5.323), control2: CGPoint(x: 8.323, y: 5.398))
        p.addCurve(to: CGPoint(x: 7.841, y: 5.477), control1: CGPoint(x: 8.098, y: 5.51), control2: CGPoint(x: 7.97, y: 5.52))
        p.addCurve(to: CGPoint(x: 7.553, y: 5.224), control1: CGPoint(x: 7.712, y: 5.434), control2: CGPoint(x: 7.616, y: 5.35))
        p.addLine(to: CGPoint(x: 7.269, y: 4.655))
        p.addLine(to: CGPoint(x: 7.004, y: 6.511))
        p.addLine(to: CGPoint(x: 7.497, y: 11.45))
        p.addLine(to: CGPoint(x: 7.498, y: 11.45))
        p.addLine(to: CGPoint(x: 7.498, y: 11.45))
        p.closeSubpath()
        p.move(to: CGPoint(x: 6.011, y: 6.64))
        p.addCurve(to: CGPoint(x: 5.668, y: 5.891), control1: CGPoint(x: 5.927, y: 6.466), control2: CGPoint(x: 5.813, y: 6.216))
        p.addCurve(to: CGPoint(x: 5.261, y: 5.019), control1: CGPoint(x: 5.503, y: 5.518), control2: CGPoint(x: 5.367, y: 5.228))
        p.addLine(to: CGPoint(x: 4.148, y: 9.47))
        p.addCurve(to: CGPoint(x: 5.697, y: 9.79), control1: CGPoint(x: 4.708, y: 9.481), control2: CGPoint(x: 5.224, y: 9.588))
        p.addCurve(to: CGPoint(x: 6.364, y: 10.16), control1: CGPoint(x: 5.931, y: 9.891), control2: CGPoint(x: 6.153, y: 10.014))
        p.addLine(to: CGPoint(x: 6.011, y: 6.64))
        p.closeSubpath()
        p.move(to: CGPoint(x: 10.739, y: 5.019))
        p.addCurve(to: CGPoint(x: 10.332, y: 5.891), control1: CGPoint(x: 10.633, y: 5.228), control2: CGPoint(x: 10.497, y: 5.518))
        p.addCurve(to: CGPoint(x: 9.989, y: 6.64), control1: CGPoint(x: 10.187, y: 6.216), control2: CGPoint(x: 10.073, y: 6.466))
        p.addLine(to: CGPoint(x: 9.636, y: 10.16))
        p.addCurve(to: CGPoint(x: 10.303, y: 9.79), control1: CGPoint(x: 9.847, y: 10.014), control2: CGPoint(x: 10.069, y: 9.891))
        p.addCurve(to: CGPoint(x: 11.852, y: 9.47), control1: CGPoint(x: 10.776, y: 9.588), control2: CGPoint(x: 11.292, y: 9.481))
        p.addLine(to: CGPoint(x: 10.739, y: 5.019))
        p.closeSubpath()
        p.move(to: CGPoint(x: 11.814, y: 5.196))
        p.addLine(to: CGPoint(x: 12.489, y: 7.893))
        p.addCurve(to: CGPoint(x: 12.566, y: 7.752), control1: CGPoint(x: 12.513, y: 7.846), control2: CGPoint(x: 12.539, y: 7.799))
        p.addCurve(to: CGPoint(x: 13.64, y: 6.5), control1: CGPoint(x: 12.832, y: 7.286), control2: CGPoint(x: 13.191, y: 6.868))
        p.addLine(to: CGPoint(x: 11.814, y: 5.196))
        p.closeSubpath()
        p.move(to: CGPoint(x: 4.186, y: 5.196))
        p.addLine(to: CGPoint(x: 2.36, y: 6.5))
        p.addCurve(to: CGPoint(x: 3.434, y: 7.752), control1: CGPoint(x: 2.809, y: 6.868), control2: CGPoint(x: 3.168, y: 7.286))
        p.addCurve(to: CGPoint(x: 3.511, y: 7.893), control1: CGPoint(x: 3.461, y: 7.799), control2: CGPoint(x: 3.487, y: 7.846))
        p.addLine(to: CGPoint(x: 4.186, y: 5.196))
        p.closeSubpath()
        return p.applying(CGAffineTransform(scaleX: rect.width / 16, y: rect.height / 16))
    }
}

// BatIcon().frame(width: 16, height: 16) fills with the foreground style. Keep it on whole points to stay crisp.
```

### Compose

```kotlin
// Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.graphics.vector.addPathNodes
import androidx.compose.ui.unit.dp

val BatIcon: ImageVector by lazy {
    ImageVector.Builder(
        name = "bat", defaultWidth = 16.dp, defaultHeight = 16.dp,
        viewportWidth = 16f, viewportHeight = 16f,
    ).addPath(
        pathData = addPathNodes("M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z"),
        fill = SolidColor(Color.Black),
    ).build()
}

// Icon(BatIcon, contentDescription = null) tints it with LocalContentColor.
```

### Android XML

```xml
<!-- res/drawable/ic_bat.xml · Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="16dp"
    android:height="16dp"
    android:viewportWidth="16"
    android:viewportHeight="16"
    android:tint="?attr/colorControlNormal">
  <path
      android:fillColor="@android:color/white"
      android:pathData="M8.553 2.776C8.615 2.653 8.711 2.569 8.842 2.526C8.973 2.482 9.1 2.491 9.224 2.553C9.38 2.631 9.47 2.756 9.495 2.929L9.756 4.753C9.855 4.548 9.939 4.388 10.007 4.272C10.129 4.066 10.25 3.905 10.368 3.789C10.564 3.596 10.774 3.5 11 3.5C11.107 3.5 11.204 3.531 11.291 3.593L14.791 6.093C14.903 6.173 14.97 6.282 14.993 6.418C15.016 6.554 14.987 6.678 14.907 6.791C14.868 6.844 14.821 6.889 14.765 6.924C14.169 7.296 13.726 7.738 13.434 8.248C13.145 8.755 13 9.339 13 10C13 10.141 12.952 10.259 12.856 10.356C12.759 10.452 12.641 10.5 12.5 10.5C12.492 10.5 12.483 10.5 12.475 10.499L12.47 10.499C12.461 10.499 12.453 10.498 12.445 10.497C11.782 10.423 11.2 10.494 10.697 10.71C10.237 10.907 9.834 11.23 9.489 11.679C9.474 11.807 9.443 11.931 9.395 12.052C9.318 12.245 9.207 12.414 9.061 12.561C8.914 12.707 8.745 12.818 8.552 12.895C8.375 12.965 8.191 13 8 13C7.809 13 7.625 12.965 7.448 12.895C7.255 12.818 7.086 12.707 6.939 12.561C6.793 12.414 6.682 12.245 6.605 12.052C6.557 11.931 6.526 11.807 6.511 11.679C6.166 11.23 5.763 10.907 5.303 10.71C4.8 10.494 4.218 10.423 3.555 10.497C3.418 10.512 3.295 10.477 3.188 10.39C3.08 10.304 3.018 10.192 3.003 10.055C3.001 10.037 3 10.018 3 10C3 9.339 2.855 8.755 2.566 8.248C2.274 7.738 1.831 7.296 1.235 6.924C1.115 6.849 1.04 6.746 1.01 6.613C0.979 6.481 1.001 6.355 1.076 6.235C1.111 6.179 1.156 6.132 1.209 6.093L4.709 3.593C4.796 3.531 4.893 3.5 5 3.5C5.226 3.5 5.436 3.596 5.632 3.789C5.75 3.905 5.871 4.066 5.993 4.272C6.061 4.388 6.145 4.548 6.244 4.753L6.505 2.929C6.525 2.79 6.589 2.679 6.698 2.598C6.807 2.516 6.931 2.485 7.071 2.505C7.244 2.53 7.369 2.62 7.447 2.776L8 3.882L8.553 2.776ZM7.498 11.45L7.498 11.45C7.498 11.459 7.499 11.468 7.499 11.477L7.5 11.482C7.5 11.488 7.5 11.494 7.5 11.5C7.5 11.638 7.549 11.756 7.646 11.854C7.744 11.951 7.862 12 8 12C8.138 12 8.256 11.951 8.354 11.854C8.451 11.756 8.5 11.638 8.5 11.5C8.5 11.494 8.5 11.487 8.5 11.481L8.501 11.476C8.501 11.469 8.501 11.461 8.502 11.453L8.502 11.453L8.996 6.511L8.731 4.655L8.447 5.224C8.398 5.323 8.323 5.398 8.224 5.447C8.098 5.51 7.97 5.52 7.841 5.477C7.712 5.434 7.616 5.35 7.553 5.224L7.269 4.655L7.004 6.511L7.497 11.45L7.498 11.45L7.498 11.45ZM6.011 6.64C5.927 6.466 5.813 6.216 5.668 5.891C5.503 5.518 5.367 5.228 5.261 5.019L4.148 9.47C4.708 9.481 5.224 9.588 5.697 9.79C5.931 9.891 6.153 10.014 6.364 10.16L6.011 6.64ZM10.739 5.019C10.633 5.228 10.497 5.518 10.332 5.891C10.187 6.216 10.073 6.466 9.989 6.64L9.636 10.16C9.847 10.014 10.069 9.891 10.303 9.79C10.776 9.588 11.292 9.481 11.852 9.47L10.739 5.019ZM11.814 5.196L12.489 7.893C12.513 7.846 12.539 7.799 12.566 7.752C12.832 7.286 13.191 6.868 13.64 6.5L11.814 5.196ZM4.186 5.196L2.36 6.5C2.809 6.868 3.168 7.286 3.434 7.752C3.461 7.799 3.487 7.846 3.511 7.893L4.186 5.196Z"/>
</vector>
```

### Flutter

```dart
// Gentleface "bat" (line-round), MIT. https://gentleface.com/icons/bat
import 'package:flutter/widgets.dart';

class BatIcon extends StatelessWidget {
  const BatIcon({super.key, this.size = 16, this.color});
  final double size;
  final Color? color;

  @override
  Widget build(BuildContext context) => CustomPaint(
        size: Size.square(size),
        painter: _BatIconPainter(color ?? IconTheme.of(context).color ?? const Color(0xFF000000)),
      );
}

class _BatIconPainter extends CustomPainter {
  _BatIconPainter(this.color);
  final Color color;

  @override
  void paint(Canvas canvas, Size size) {
    canvas.scale(size.width / 16, size.height / 16);
    final p = Path()
      ..moveTo(8.553, 2.776)
      ..cubicTo(8.615, 2.653, 8.711, 2.569, 8.842, 2.526)
      ..cubicTo(8.973, 2.482, 9.1, 2.491, 9.224, 2.553)
      ..cubicTo(9.38, 2.631, 9.47, 2.756, 9.495, 2.929)
      ..lineTo(9.756, 4.753)
      ..cubicTo(9.855, 4.548, 9.939, 4.388, 10.007, 4.272)
      ..cubicTo(10.129, 4.066, 10.25, 3.905, 10.368, 3.789)
      ..cubicTo(10.564, 3.596, 10.774, 3.5, 11, 3.5)
      ..cubicTo(11.107, 3.5, 11.204, 3.531, 11.291, 3.593)
      ..lineTo(14.791, 6.093)
      ..cubicTo(14.903, 6.173, 14.97, 6.282, 14.993, 6.418)
      ..cubicTo(15.016, 6.554, 14.987, 6.678, 14.907, 6.791)
      ..cubicTo(14.868, 6.844, 14.821, 6.889, 14.765, 6.924)
      ..cubicTo(14.169, 7.296, 13.726, 7.738, 13.434, 8.248)
      ..cubicTo(13.145, 8.755, 13, 9.339, 13, 10)
      ..cubicTo(13, 10.141, 12.952, 10.259, 12.856, 10.356)
      ..cubicTo(12.759, 10.452, 12.641, 10.5, 12.5, 10.5)
      ..cubicTo(12.492, 10.5, 12.483, 10.5, 12.475, 10.499)
      ..lineTo(12.47, 10.499)
      ..cubicTo(12.461, 10.499, 12.453, 10.498, 12.445, 10.497)
      ..cubicTo(11.782, 10.423, 11.2, 10.494, 10.697, 10.71)
      ..cubicTo(10.237, 10.907, 9.834, 11.23, 9.489, 11.679)
      ..cubicTo(9.474, 11.807, 9.443, 11.931, 9.395, 12.052)
      ..cubicTo(9.318, 12.245, 9.207, 12.414, 9.061, 12.561)
      ..cubicTo(8.914, 12.707, 8.745, 12.818, 8.552, 12.895)
      ..cubicTo(8.375, 12.965, 8.191, 13, 8, 13)
      ..cubicTo(7.809, 13, 7.625, 12.965, 7.448, 12.895)
      ..cubicTo(7.255, 12.818, 7.086, 12.707, 6.939, 12.561)
      ..cubicTo(6.793, 12.414, 6.682, 12.245, 6.605, 12.052)
      ..cubicTo(6.557, 11.931, 6.526, 11.807, 6.511, 11.679)
      ..cubicTo(6.166, 11.23, 5.763, 10.907, 5.303, 10.71)
      ..cubicTo(4.8, 10.494, 4.218, 10.423, 3.555, 10.497)
      ..cubicTo(3.418, 10.512, 3.295, 10.477, 3.188, 10.39)
      ..cubicTo(3.08, 10.304, 3.018, 10.192, 3.003, 10.055)
      ..cubicTo(3.001, 10.037, 3, 10.018, 3, 10)
      ..cubicTo(3, 9.339, 2.855, 8.755, 2.566, 8.248)
      ..cubicTo(2.274, 7.738, 1.831, 7.296, 1.235, 6.924)
      ..cubicTo(1.115, 6.849, 1.04, 6.746, 1.01, 6.613)
      ..cubicTo(0.979, 6.481, 1.001, 6.355, 1.076, 6.235)
      ..cubicTo(1.111, 6.179, 1.156, 6.132, 1.209, 6.093)
      ..lineTo(4.709, 3.593)
      ..cubicTo(4.796, 3.531, 4.893, 3.5, 5, 3.5)
      ..cubicTo(5.226, 3.5, 5.436, 3.596, 5.632, 3.789)
      ..cubicTo(5.75, 3.905, 5.871, 4.066, 5.993, 4.272)
      ..cubicTo(6.061, 4.388, 6.145, 4.548, 6.244, 4.753)
      ..lineTo(6.505, 2.929)
      ..cubicTo(6.525, 2.79, 6.589, 2.679, 6.698, 2.598)
      ..cubicTo(6.807, 2.516, 6.931, 2.485, 7.071, 2.505)
      ..cubicTo(7.244, 2.53, 7.369, 2.62, 7.447, 2.776)
      ..lineTo(8, 3.882)
      ..lineTo(8.553, 2.776)
      ..close()
      ..moveTo(7.498, 11.45)
      ..lineTo(7.498, 11.45)
      ..cubicTo(7.498, 11.459, 7.499, 11.468, 7.499, 11.477)
      ..lineTo(7.5, 11.482)
      ..cubicTo(7.5, 11.488, 7.5, 11.494, 7.5, 11.5)
      ..cubicTo(7.5, 11.638, 7.549, 11.756, 7.646, 11.854)
      ..cubicTo(7.744, 11.951, 7.862, 12, 8, 12)
      ..cubicTo(8.138, 12, 8.256, 11.951, 8.354, 11.854)
      ..cubicTo(8.451, 11.756, 8.5, 11.638, 8.5, 11.5)
      ..cubicTo(8.5, 11.494, 8.5, 11.487, 8.5, 11.481)
      ..lineTo(8.501, 11.476)
      ..cubicTo(8.501, 11.469, 8.501, 11.461, 8.502, 11.453)
      ..lineTo(8.502, 11.453)
      ..lineTo(8.996, 6.511)
      ..lineTo(8.731, 4.655)
      ..lineTo(8.447, 5.224)
      ..cubicTo(8.398, 5.323, 8.323, 5.398, 8.224, 5.447)
      ..cubicTo(8.098, 5.51, 7.97, 5.52, 7.841, 5.477)
      ..cubicTo(7.712, 5.434, 7.616, 5.35, 7.553, 5.224)
      ..lineTo(7.269, 4.655)
      ..lineTo(7.004, 6.511)
      ..lineTo(7.497, 11.45)
      ..lineTo(7.498, 11.45)
      ..lineTo(7.498, 11.45)
      ..close()
      ..moveTo(6.011, 6.64)
      ..cubicTo(5.927, 6.466, 5.813, 6.216, 5.668, 5.891)
      ..cubicTo(5.503, 5.518, 5.367, 5.228, 5.261, 5.019)
      ..lineTo(4.148, 9.47)
      ..cubicTo(4.708, 9.481, 5.224, 9.588, 5.697, 9.79)
      ..cubicTo(5.931, 9.891, 6.153, 10.014, 6.364, 10.16)
      ..lineTo(6.011, 6.64)
      ..close()
      ..moveTo(10.739, 5.019)
      ..cubicTo(10.633, 5.228, 10.497, 5.518, 10.332, 5.891)
      ..cubicTo(10.187, 6.216, 10.073, 6.466, 9.989, 6.64)
      ..lineTo(9.636, 10.16)
      ..cubicTo(9.847, 10.014, 10.069, 9.891, 10.303, 9.79)
      ..cubicTo(10.776, 9.588, 11.292, 9.481, 11.852, 9.47)
      ..lineTo(10.739, 5.019)
      ..close()
      ..moveTo(11.814, 5.196)
      ..lineTo(12.489, 7.893)
      ..cubicTo(12.513, 7.846, 12.539, 7.799, 12.566, 7.752)
      ..cubicTo(12.832, 7.286, 13.191, 6.868, 13.64, 6.5)
      ..lineTo(11.814, 5.196)
      ..close()
      ..moveTo(4.186, 5.196)
      ..lineTo(2.36, 6.5)
      ..cubicTo(2.809, 6.868, 3.168, 7.286, 3.434, 7.752)
      ..cubicTo(3.461, 7.799, 3.487, 7.846, 3.511, 7.893)
      ..lineTo(4.186, 5.196)
      ..close();
    canvas.drawPath(p, Paint()..color = color);
  }

  @override
  bool shouldRepaint(_BatIconPainter old) => old.color != color;
}
```
