# teapot icon

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

- Category: Food & drink
- Use it for: tea, teapot, tea time, herbal tea, chai
- Tags: teapot, tea, tea-time, afternoon-tea, pot, brew, infusion, chai, cafe, hot-drink, beverage, food
- Component name: TeapotIcon
- Added: 2026-10-29
- Since: version 0.2.0
- npm: `import { TeapotIcon } from '@gentleface/react';` (@gentleface/react 0.2.0)
- Changed: 2026-10-30 (added)

## Alternatives

- `coffee`: coffee or a hot drink
- `kettle`: the kettle appliance

## Also fits

- coffee: tea
- kettle: tea or a teapot

## Files

Each SVG is 16 × 16 with fill="currentColor". Keep it at 16 px or an exact multiple (32, 48) on whole pixels: a fractional size or position blurs it.

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

The SVG of every style: https://gentleface.com/icons/teapot.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="M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z"/></svg>
```

### React

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

export function TeapotIcon(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="M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z" />
    </svg>
  );
}
```

### Vue

```vue
<!-- Gentleface "teapot" (line-round), MIT. https://gentleface.com/icons/teapot -->
<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="M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z" />
  </svg>
</template>
```

### Svelte

```svelte
<!-- Gentleface "teapot" (line-round), MIT. https://gentleface.com/icons/teapot -->
<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="M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z" />
</svg>
```

### HTML img

```html
<!-- Gentleface "teapot" (line-round), MIT. https://gentleface.com/icons/teapot. 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/teapot.svg" width="16" height="16" alt="">
```

### CSS

```css
/* Gentleface "teapot" (line-round), MIT. https://gentleface.com/icons/teapot. Takes the text color. */
.icon-teapot {
  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='M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z'/%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='M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z'/%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='M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z'/%3E%3C/svg%3E
```

### Sprite

```html
<!-- Gentleface "teapot" (line-round), MIT. https://gentleface.com/icons/teapot
     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#teapot"/></svg>
```

### SwiftUI

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

struct TeapotIcon: Shape {
    func path(in rect: CGRect) -> Path {
        var p = Path()
        p.move(to: CGPoint(x: 14.447, y: 8.805))
        p.addCurve(to: CGPoint(x: 15, y: 10.5), control1: CGPoint(x: 14.816, y: 9.248), control2: CGPoint(x: 15, y: 9.813))
        p.addCurve(to: CGPoint(x: 14.447, y: 12.195), control1: CGPoint(x: 15, y: 11.187), control2: CGPoint(x: 14.816, y: 11.752))
        p.addCurve(to: CGPoint(x: 12.5, y: 13), control1: CGPoint(x: 13.999, y: 12.732), control2: CGPoint(x: 13.351, y: 13))
        p.addLine(to: CGPoint(x: 11.5, y: 13))
        p.addCurve(to: CGPoint(x: 11.156, y: 12.863), control1: CGPoint(x: 11.367, y: 13), control2: CGPoint(x: 11.253, y: 12.954))
        p.addCurve(to: CGPoint(x: 10.895, y: 13.124), control1: CGPoint(x: 11.075, y: 12.954), control2: CGPoint(x: 10.988, y: 13.041))
        p.addCurve(to: CGPoint(x: 9.769, y: 13.784), control1: CGPoint(x: 10.57, y: 13.412), control2: CGPoint(x: 10.195, y: 13.632))
        p.addCurve(to: CGPoint(x: 8.5, y: 14), control1: CGPoint(x: 9.363, y: 13.928), control2: CGPoint(x: 8.94, y: 14))
        p.addLine(to: CGPoint(x: 6.5, y: 14))
        p.addCurve(to: CGPoint(x: 5.231, y: 13.784), control1: CGPoint(x: 6.06, y: 14), control2: CGPoint(x: 5.637, y: 13.928))
        p.addCurve(to: CGPoint(x: 4.105, y: 13.124), control1: CGPoint(x: 4.805, y: 13.632), control2: CGPoint(x: 4.43, y: 13.412))
        p.addCurve(to: CGPoint(x: 3.3, y: 12.013), control1: CGPoint(x: 3.757, y: 12.814), control2: CGPoint(x: 3.488, y: 12.444))
        p.addCurve(to: CGPoint(x: 3.015, y: 10.858), control1: CGPoint(x: 3.144, y: 11.657), control2: CGPoint(x: 3.049, y: 11.272))
        p.addLine(to: CGPoint(x: 1.288, y: 7.979))
        p.addCurve(to: CGPoint(x: 1.143, y: 7.494), control1: CGPoint(x: 1.198, y: 7.83), control2: CGPoint(x: 1.15, y: 7.668))
        p.addCurve(to: CGPoint(x: 1.167, y: 7.231), control1: CGPoint(x: 1.14, y: 7.405), control2: CGPoint(x: 1.148, y: 7.317))
        p.addCurve(to: CGPoint(x: 1.705, y: 6.891), control1: CGPoint(x: 1.222, y: 6.989), control2: CGPoint(x: 1.463, y: 6.837))
        p.addCurve(to: CGPoint(x: 1.952, y: 7.042), control1: CGPoint(x: 1.802, y: 6.913), control2: CGPoint(x: 1.888, y: 6.966))
        p.addLine(to: CGPoint(x: 3.308, y: 8.67))
        p.addCurve(to: CGPoint(x: 3.428, y: 8.401), control1: CGPoint(x: 3.345, y: 8.577), control2: CGPoint(x: 3.385, y: 8.488))
        p.addCurve(to: CGPoint(x: 4.536, y: 7.186), control1: CGPoint(x: 3.686, y: 7.885), control2: CGPoint(x: 4.055, y: 7.48))
        p.addCurve(to: CGPoint(x: 4.764, y: 6.672), control1: CGPoint(x: 4.577, y: 7.01), control2: CGPoint(x: 4.653, y: 6.838))
        p.addCurve(to: CGPoint(x: 5.417, y: 6.048), control1: CGPoint(x: 4.922, y: 6.434), control2: CGPoint(x: 5.14, y: 6.226))
        p.addCurve(to: CGPoint(x: 6.021, y: 5.75), control1: CGPoint(x: 5.601, y: 5.93), control2: CGPoint(x: 5.802, y: 5.831))
        p.addCurve(to: CGPoint(x: 6.532, y: 4.854), control1: CGPoint(x: 6.082, y: 5.389), control2: CGPoint(x: 6.252, y: 5.09))
        p.addCurve(to: CGPoint(x: 7.5, y: 4.5), control1: CGPoint(x: 6.811, y: 4.618), control2: CGPoint(x: 7.134, y: 4.5))
        p.addCurve(to: CGPoint(x: 8.468, y: 4.854), control1: CGPoint(x: 7.866, y: 4.5), control2: CGPoint(x: 8.189, y: 4.618))
        p.addCurve(to: CGPoint(x: 8.979, y: 5.75), control1: CGPoint(x: 8.748, y: 5.09), control2: CGPoint(x: 8.918, y: 5.389))
        p.addCurve(to: CGPoint(x: 9.583, y: 6.048), control1: CGPoint(x: 9.198, y: 5.831), control2: CGPoint(x: 9.399, y: 5.93))
        p.addCurve(to: CGPoint(x: 10.236, y: 6.672), control1: CGPoint(x: 9.86, y: 6.226), control2: CGPoint(x: 10.078, y: 6.434))
        p.addCurve(to: CGPoint(x: 10.461, y: 7.174), control1: CGPoint(x: 10.345, y: 6.835), control2: CGPoint(x: 10.42, y: 7.002))
        p.addCurve(to: CGPoint(x: 10.614, y: 7.256), control1: CGPoint(x: 10.522, y: 7.206), control2: CGPoint(x: 10.573, y: 7.233))
        p.addCurve(to: CGPoint(x: 11.008, y: 7.522), control1: CGPoint(x: 10.77, y: 7.345), control2: CGPoint(x: 10.901, y: 7.434))
        p.addCurve(to: CGPoint(x: 11.391, y: 8), control1: CGPoint(x: 11.181, y: 7.667), control2: CGPoint(x: 11.309, y: 7.826))
        p.addLine(to: CGPoint(x: 12.5, y: 8))
        p.addCurve(to: CGPoint(x: 14.447, y: 8.805), control1: CGPoint(x: 13.351, y: 8), control2: CGPoint(x: 13.999, y: 8.268))
        p.closeSubpath()
        p.move(to: CGPoint(x: 8.393, y: 6.612))
        p.addCurve(to: CGPoint(x: 7.5, y: 6.5), control1: CGPoint(x: 8.117, y: 6.537), control2: CGPoint(x: 7.819, y: 6.5))
        p.addCurve(to: CGPoint(x: 6.607, y: 6.612), control1: CGPoint(x: 7.181, y: 6.5), control2: CGPoint(x: 6.883, y: 6.537))
        p.addCurve(to: CGPoint(x: 5.958, y: 6.889), control1: CGPoint(x: 6.358, y: 6.679), control2: CGPoint(x: 6.142, y: 6.771))
        p.addCurve(to: CGPoint(x: 5.805, y: 7), control1: CGPoint(x: 5.902, y: 6.925), control2: CGPoint(x: 5.851, y: 6.962))
        p.addLine(to: CGPoint(x: 9.195, y: 7))
        p.addCurve(to: CGPoint(x: 9.042, y: 6.889), control1: CGPoint(x: 9.149, y: 6.962), control2: CGPoint(x: 9.098, y: 6.925))
        p.addCurve(to: CGPoint(x: 8.393, y: 6.612), control1: CGPoint(x: 8.858, y: 6.771), control2: CGPoint(x: 8.642, y: 6.679))
        p.closeSubpath()
        p.move(to: CGPoint(x: 10.23, y: 12.376))
        p.addCurve(to: CGPoint(x: 11, y: 10.5), control1: CGPoint(x: 10.743, y: 11.92), control2: CGPoint(x: 11, y: 11.295))
        p.addCurve(to: CGPoint(x: 10.61, y: 8.812), control1: CGPoint(x: 11, y: 9.7), control2: CGPoint(x: 10.87, y: 9.138))
        p.addCurve(to: CGPoint(x: 10.5, y: 8.5), control1: CGPoint(x: 10.537, y: 8.721), control2: CGPoint(x: 10.5, y: 8.617))
        p.addCurve(to: CGPoint(x: 10.367, y: 8.29), control1: CGPoint(x: 10.5, y: 8.434), control2: CGPoint(x: 10.456, y: 8.364))
        p.addCurve(to: CGPoint(x: 9.881, y: 8), control1: CGPoint(x: 10.284, y: 8.221), control2: CGPoint(x: 10.121, y: 8.124))
        p.addLine(to: CGPoint(x: 5.124, y: 8))
        p.addCurve(to: CGPoint(x: 4.322, y: 8.849), control1: CGPoint(x: 4.773, y: 8.199), control2: CGPoint(x: 4.506, y: 8.482))
        p.addCurve(to: CGPoint(x: 4, y: 10.5), control1: CGPoint(x: 4.107, y: 9.278), control2: CGPoint(x: 4, y: 9.829))
        p.addCurve(to: CGPoint(x: 4.77, y: 12.376), control1: CGPoint(x: 4, y: 11.295), control2: CGPoint(x: 4.257, y: 11.92))
        p.addCurve(to: CGPoint(x: 5.566, y: 12.841), control1: CGPoint(x: 4.997, y: 12.578), control2: CGPoint(x: 5.263, y: 12.734))
        p.addCurve(to: CGPoint(x: 6.5, y: 13), control1: CGPoint(x: 5.863, y: 12.947), control2: CGPoint(x: 6.175, y: 13))
        p.addLine(to: CGPoint(x: 8.5, y: 13))
        p.addCurve(to: CGPoint(x: 9.434, y: 12.841), control1: CGPoint(x: 8.825, y: 13), control2: CGPoint(x: 9.137, y: 12.947))
        p.addCurve(to: CGPoint(x: 10.23, y: 12.376), control1: CGPoint(x: 9.737, y: 12.734), control2: CGPoint(x: 10.003, y: 12.578))
        p.closeSubpath()
        p.move(to: CGPoint(x: 13.678, y: 11.555))
        p.addCurve(to: CGPoint(x: 14, y: 10.5), control1: CGPoint(x: 13.893, y: 11.298), control2: CGPoint(x: 14, y: 10.946))
        p.addCurve(to: CGPoint(x: 13.678, y: 9.445), control1: CGPoint(x: 14, y: 10.054), control2: CGPoint(x: 13.893, y: 9.702))
        p.addCurve(to: CGPoint(x: 12.5, y: 9), control1: CGPoint(x: 13.431, y: 9.148), control2: CGPoint(x: 13.038, y: 9))
        p.addLine(to: CGPoint(x: 11.809, y: 9))
        p.addCurve(to: CGPoint(x: 11.889, y: 9.3), control1: CGPoint(x: 11.839, y: 9.096), control2: CGPoint(x: 11.866, y: 9.196))
        p.addCurve(to: CGPoint(x: 12, y: 10.5), control1: CGPoint(x: 11.963, y: 9.64), control2: CGPoint(x: 12, y: 10.04))
        p.addCurve(to: CGPoint(x: 11.706, y: 12), control1: CGPoint(x: 12, y: 11.047), control2: CGPoint(x: 11.902, y: 11.547))
        p.addLine(to: CGPoint(x: 12.5, y: 12))
        p.addCurve(to: CGPoint(x: 13.678, y: 11.555), control1: CGPoint(x: 13.038, y: 12), control2: CGPoint(x: 13.431, y: 11.852))
        p.closeSubpath()
        return p.applying(CGAffineTransform(scaleX: rect.width / 16, y: rect.height / 16))
    }
}

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

### Compose

```kotlin
// Gentleface "teapot" (line-round), MIT. https://gentleface.com/icons/teapot
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 TeapotIcon: ImageVector by lazy {
    ImageVector.Builder(
        name = "teapot", defaultWidth = 16.dp, defaultHeight = 16.dp,
        viewportWidth = 16f, viewportHeight = 16f,
    ).addPath(
        pathData = addPathNodes("M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z"),
        fill = SolidColor(Color.Black),
    ).build()
}

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

### Android XML

```xml
<!-- res/drawable/ic_teapot.xml · Gentleface "teapot" (line-round), MIT. https://gentleface.com/icons/teapot -->
<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="M14.447 8.805C14.816 9.248 15 9.813 15 10.5C15 11.187 14.816 11.752 14.447 12.195C13.999 12.732 13.351 13 12.5 13L11.5 13C11.367 13 11.253 12.954 11.156 12.863C11.075 12.954 10.988 13.041 10.895 13.124C10.57 13.412 10.195 13.632 9.769 13.784C9.363 13.928 8.94 14 8.5 14L6.5 14C6.06 14 5.637 13.928 5.231 13.784C4.805 13.632 4.43 13.412 4.105 13.124C3.757 12.814 3.488 12.444 3.3 12.013C3.144 11.657 3.049 11.272 3.015 10.858L1.288 7.979C1.198 7.83 1.15 7.668 1.143 7.494C1.14 7.405 1.148 7.317 1.167 7.231C1.222 6.989 1.463 6.837 1.705 6.891C1.802 6.913 1.888 6.966 1.952 7.042L3.308 8.67C3.345 8.577 3.385 8.488 3.428 8.401C3.686 7.885 4.055 7.48 4.536 7.186C4.577 7.01 4.653 6.838 4.764 6.672C4.922 6.434 5.14 6.226 5.417 6.048C5.601 5.93 5.802 5.831 6.021 5.75C6.082 5.389 6.252 5.09 6.532 4.854C6.811 4.618 7.134 4.5 7.5 4.5C7.866 4.5 8.189 4.618 8.468 4.854C8.748 5.09 8.918 5.389 8.979 5.75C9.198 5.831 9.399 5.93 9.583 6.048C9.86 6.226 10.078 6.434 10.236 6.672C10.345 6.835 10.42 7.002 10.461 7.174C10.522 7.206 10.573 7.233 10.614 7.256C10.77 7.345 10.901 7.434 11.008 7.522C11.181 7.667 11.309 7.826 11.391 8L12.5 8C13.351 8 13.999 8.268 14.447 8.805ZM8.393 6.612C8.117 6.537 7.819 6.5 7.5 6.5C7.181 6.5 6.883 6.537 6.607 6.612C6.358 6.679 6.142 6.771 5.958 6.889C5.902 6.925 5.851 6.962 5.805 7L9.195 7C9.149 6.962 9.098 6.925 9.042 6.889C8.858 6.771 8.642 6.679 8.393 6.612ZM10.23 12.376C10.743 11.92 11 11.295 11 10.5C11 9.7 10.87 9.138 10.61 8.812C10.537 8.721 10.5 8.617 10.5 8.5C10.5 8.434 10.456 8.364 10.367 8.29C10.284 8.221 10.121 8.124 9.881 8L5.124 8C4.773 8.199 4.506 8.482 4.322 8.849C4.107 9.278 4 9.829 4 10.5C4 11.295 4.257 11.92 4.77 12.376C4.997 12.578 5.263 12.734 5.566 12.841C5.863 12.947 6.175 13 6.5 13L8.5 13C8.825 13 9.137 12.947 9.434 12.841C9.737 12.734 10.003 12.578 10.23 12.376ZM13.678 11.555C13.893 11.298 14 10.946 14 10.5C14 10.054 13.893 9.702 13.678 9.445C13.431 9.148 13.038 9 12.5 9L11.809 9C11.839 9.096 11.866 9.196 11.889 9.3C11.963 9.64 12 10.04 12 10.5C12 11.047 11.902 11.547 11.706 12L12.5 12C13.038 12 13.431 11.852 13.678 11.555Z"/>
</vector>
```

### Flutter

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

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

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

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

  @override
  void paint(Canvas canvas, Size size) {
    canvas.scale(size.width / 16, size.height / 16);
    final p = Path()
      ..moveTo(14.447, 8.805)
      ..cubicTo(14.816, 9.248, 15, 9.813, 15, 10.5)
      ..cubicTo(15, 11.187, 14.816, 11.752, 14.447, 12.195)
      ..cubicTo(13.999, 12.732, 13.351, 13, 12.5, 13)
      ..lineTo(11.5, 13)
      ..cubicTo(11.367, 13, 11.253, 12.954, 11.156, 12.863)
      ..cubicTo(11.075, 12.954, 10.988, 13.041, 10.895, 13.124)
      ..cubicTo(10.57, 13.412, 10.195, 13.632, 9.769, 13.784)
      ..cubicTo(9.363, 13.928, 8.94, 14, 8.5, 14)
      ..lineTo(6.5, 14)
      ..cubicTo(6.06, 14, 5.637, 13.928, 5.231, 13.784)
      ..cubicTo(4.805, 13.632, 4.43, 13.412, 4.105, 13.124)
      ..cubicTo(3.757, 12.814, 3.488, 12.444, 3.3, 12.013)
      ..cubicTo(3.144, 11.657, 3.049, 11.272, 3.015, 10.858)
      ..lineTo(1.288, 7.979)
      ..cubicTo(1.198, 7.83, 1.15, 7.668, 1.143, 7.494)
      ..cubicTo(1.14, 7.405, 1.148, 7.317, 1.167, 7.231)
      ..cubicTo(1.222, 6.989, 1.463, 6.837, 1.705, 6.891)
      ..cubicTo(1.802, 6.913, 1.888, 6.966, 1.952, 7.042)
      ..lineTo(3.308, 8.67)
      ..cubicTo(3.345, 8.577, 3.385, 8.488, 3.428, 8.401)
      ..cubicTo(3.686, 7.885, 4.055, 7.48, 4.536, 7.186)
      ..cubicTo(4.577, 7.01, 4.653, 6.838, 4.764, 6.672)
      ..cubicTo(4.922, 6.434, 5.14, 6.226, 5.417, 6.048)
      ..cubicTo(5.601, 5.93, 5.802, 5.831, 6.021, 5.75)
      ..cubicTo(6.082, 5.389, 6.252, 5.09, 6.532, 4.854)
      ..cubicTo(6.811, 4.618, 7.134, 4.5, 7.5, 4.5)
      ..cubicTo(7.866, 4.5, 8.189, 4.618, 8.468, 4.854)
      ..cubicTo(8.748, 5.09, 8.918, 5.389, 8.979, 5.75)
      ..cubicTo(9.198, 5.831, 9.399, 5.93, 9.583, 6.048)
      ..cubicTo(9.86, 6.226, 10.078, 6.434, 10.236, 6.672)
      ..cubicTo(10.345, 6.835, 10.42, 7.002, 10.461, 7.174)
      ..cubicTo(10.522, 7.206, 10.573, 7.233, 10.614, 7.256)
      ..cubicTo(10.77, 7.345, 10.901, 7.434, 11.008, 7.522)
      ..cubicTo(11.181, 7.667, 11.309, 7.826, 11.391, 8)
      ..lineTo(12.5, 8)
      ..cubicTo(13.351, 8, 13.999, 8.268, 14.447, 8.805)
      ..close()
      ..moveTo(8.393, 6.612)
      ..cubicTo(8.117, 6.537, 7.819, 6.5, 7.5, 6.5)
      ..cubicTo(7.181, 6.5, 6.883, 6.537, 6.607, 6.612)
      ..cubicTo(6.358, 6.679, 6.142, 6.771, 5.958, 6.889)
      ..cubicTo(5.902, 6.925, 5.851, 6.962, 5.805, 7)
      ..lineTo(9.195, 7)
      ..cubicTo(9.149, 6.962, 9.098, 6.925, 9.042, 6.889)
      ..cubicTo(8.858, 6.771, 8.642, 6.679, 8.393, 6.612)
      ..close()
      ..moveTo(10.23, 12.376)
      ..cubicTo(10.743, 11.92, 11, 11.295, 11, 10.5)
      ..cubicTo(11, 9.7, 10.87, 9.138, 10.61, 8.812)
      ..cubicTo(10.537, 8.721, 10.5, 8.617, 10.5, 8.5)
      ..cubicTo(10.5, 8.434, 10.456, 8.364, 10.367, 8.29)
      ..cubicTo(10.284, 8.221, 10.121, 8.124, 9.881, 8)
      ..lineTo(5.124, 8)
      ..cubicTo(4.773, 8.199, 4.506, 8.482, 4.322, 8.849)
      ..cubicTo(4.107, 9.278, 4, 9.829, 4, 10.5)
      ..cubicTo(4, 11.295, 4.257, 11.92, 4.77, 12.376)
      ..cubicTo(4.997, 12.578, 5.263, 12.734, 5.566, 12.841)
      ..cubicTo(5.863, 12.947, 6.175, 13, 6.5, 13)
      ..lineTo(8.5, 13)
      ..cubicTo(8.825, 13, 9.137, 12.947, 9.434, 12.841)
      ..cubicTo(9.737, 12.734, 10.003, 12.578, 10.23, 12.376)
      ..close()
      ..moveTo(13.678, 11.555)
      ..cubicTo(13.893, 11.298, 14, 10.946, 14, 10.5)
      ..cubicTo(14, 10.054, 13.893, 9.702, 13.678, 9.445)
      ..cubicTo(13.431, 9.148, 13.038, 9, 12.5, 9)
      ..lineTo(11.809, 9)
      ..cubicTo(11.839, 9.096, 11.866, 9.196, 11.889, 9.3)
      ..cubicTo(11.963, 9.64, 12, 10.04, 12, 10.5)
      ..cubicTo(12, 11.047, 11.902, 11.547, 11.706, 12)
      ..lineTo(12.5, 12)
      ..cubicTo(13.038, 12, 13.431, 11.852, 13.678, 11.555)
      ..close();
    canvas.drawPath(p, Paint()..color = color);
  }

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