donut icon

Donut: donut, doughnut, doughnuts. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

Code line-round

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="M10.416 1.531C10.48 1.623 10.509 1.726 10.504 1.84C10.482 2.308 10.552 2.763 10.713 3.204C10.89 3.687 11.161 4.111 11.525 4.475C11.889 4.839 12.313 5.11 12.796 5.287C13.237 5.448 13.692 5.518 14.16 5.496C14.274 5.491 14.377 5.52 14.469 5.584C14.56 5.647 14.624 5.733 14.659 5.842C14.967 6.792 15.067 7.764 14.959 8.757C14.839 9.863 14.475 10.882 13.869 11.815C13.262 12.748 12.478 13.494 11.516 14.053C10.652 14.555 9.724 14.858 8.73 14.962C7.736 15.066 6.765 14.962 5.816 14.651C4.759 14.303 3.837 13.736 3.05 12.95C2.264 12.163 1.697 11.241 1.349 10.184C1.038 9.235 0.934 8.264 1.038 7.27C1.142 6.276 1.445 5.348 1.947 4.484C2.506 3.522 3.252 2.738 4.185 2.131C5.118 1.525 6.137 1.161 7.243 1.041C8.236 0.933 9.208 1.033 10.158 1.341C10.267 1.376 10.353 1.44 10.416 1.531ZM6.14 8.736C6.242 8.993 6.391 9.219 6.586 9.414C6.781 9.609 7.007 9.758 7.264 9.86C7.5 9.953 7.746 10 8 10C8.254 10 8.5 9.953 8.736 9.86C8.993 9.758 9.219 9.609 9.414 9.414C9.609 9.219 9.758 8.993 9.86 8.736C9.953 8.5 10 8.254 10 8C10 7.746 9.953 7.5 9.86 7.264C9.758 7.007 9.609 6.781 9.414 6.586C9.219 6.391 8.993 6.242 8.736 6.14C8.5 6.047 8.254 6 8 6C7.746 6 7.5 6.047 7.264 6.14C7.007 6.242 6.781 6.391 6.586 6.586C6.391 6.781 6.242 7.007 6.14 7.264C6.047 7.5 6 7.746 6 8C6 8.254 6.047 8.5 6.14 8.736ZM2.3 9.872C2.597 10.778 3.083 11.568 3.757 12.243C4.432 12.917 5.222 13.403 6.128 13.7C6.942 13.968 7.774 14.057 8.626 13.967C9.477 13.878 10.273 13.618 11.014 13.188C11.838 12.709 12.511 12.07 13.03 11.27C13.55 10.471 13.862 9.597 13.965 8.649C13.97 8.599 13.975 8.55 13.979 8.5L13 8.5C13 9.083 12.969 9.563 12.906 9.938C12.853 10.256 12.779 10.503 12.684 10.68C12.66 10.724 12.635 10.763 12.61 10.797C12.462 10.996 12.18 11.037 11.98 10.889C11.95 10.866 11.922 10.839 11.898 10.809C11.827 10.72 11.763 10.598 11.705 10.441C11.624 10.223 11.537 9.849 11.445 9.319C11.405 9.092 11.375 8.932 11.354 8.838C11.32 8.684 11.285 8.571 11.25 8.5C11.123 8.5 11.025 8.509 10.954 8.527C10.919 8.723 10.864 8.916 10.789 9.104C10.637 9.489 10.414 9.828 10.121 10.121C9.828 10.414 9.489 10.637 9.104 10.789C8.75 10.93 8.381 11 8 11C7.619 11 7.25 10.93 6.896 10.789C6.511 10.637 6.172 10.414 5.879 10.121C5.586 9.828 5.363 9.489 5.211 9.104C5.136 8.916 5.081 8.723 5.046 8.527C4.975 8.509 4.877 8.5 4.75 8.5C4.715 8.571 4.68 8.684 4.646 8.838C4.625 8.932 4.595 9.092 4.555 9.319C4.463 9.849 4.376 10.223 4.295 10.441C4.237 10.598 4.173 10.72 4.102 10.809C3.947 11.003 3.664 11.034 3.47 10.879C3.44 10.855 3.413 10.828 3.39 10.797C3.365 10.763 3.34 10.724 3.316 10.68C3.221 10.503 3.147 10.256 3.094 9.938C3.031 9.562 3 9.083 3 8.5L2.019 8.5C2.058 8.963 2.151 9.421 2.3 9.872Z"/></svg>

React

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

export function DonutIcon(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="M10.416 1.531C10.48 1.623 10.509 1.726 10.504 1.84C10.482 2.308 10.552 2.763 10.713 3.204C10.89 3.687 11.161 4.111 11.525 4.475C11.889 4.839 12.313 5.11 12.796 5.287C13.237 5.448 13.692 5.518 14.16 5.496C14.274 5.491 14.377 5.52 14.469 5.584C14.56 5.647 14.624 5.733 14.659 5.842C14.967 6.792 15.067 7.764 14.959 8.757C14.839 9.863 14.475 10.882 13.869 11.815C13.262 12.748 12.478 13.494 11.516 14.053C10.652 14.555 9.724 14.858 8.73 14.962C7.736 15.066 6.765 14.962 5.816 14.651C4.759 14.303 3.837 13.736 3.05 12.95C2.264 12.163 1.697 11.241 1.349 10.184C1.038 9.235 0.934 8.264 1.038 7.27C1.142 6.276 1.445 5.348 1.947 4.484C2.506 3.522 3.252 2.738 4.185 2.131C5.118 1.525 6.137 1.161 7.243 1.041C8.236 0.933 9.208 1.033 10.158 1.341C10.267 1.376 10.353 1.44 10.416 1.531ZM6.14 8.736C6.242 8.993 6.391 9.219 6.586 9.414C6.781 9.609 7.007 9.758 7.264 9.86C7.5 9.953 7.746 10 8 10C8.254 10 8.5 9.953 8.736 9.86C8.993 9.758 9.219 9.609 9.414 9.414C9.609 9.219 9.758 8.993 9.86 8.736C9.953 8.5 10 8.254 10 8C10 7.746 9.953 7.5 9.86 7.264C9.758 7.007 9.609 6.781 9.414 6.586C9.219 6.391 8.993 6.242 8.736 6.14C8.5 6.047 8.254 6 8 6C7.746 6 7.5 6.047 7.264 6.14C7.007 6.242 6.781 6.391 6.586 6.586C6.391 6.781 6.242 7.007 6.14 7.264C6.047 7.5 6 7.746 6 8C6 8.254 6.047 8.5 6.14 8.736ZM2.3 9.872C2.597 10.778 3.083 11.568 3.757 12.243C4.432 12.917 5.222 13.403 6.128 13.7C6.942 13.968 7.774 14.057 8.626 13.967C9.477 13.878 10.273 13.618 11.014 13.188C11.838 12.709 12.511 12.07 13.03 11.27C13.55 10.471 13.862 9.597 13.965 8.649C13.97 8.599 13.975 8.55 13.979 8.5L13 8.5C13 9.083 12.969 9.563 12.906 9.938C12.853 10.256 12.779 10.503 12.684 10.68C12.66 10.724 12.635 10.763 12.61 10.797C12.462 10.996 12.18 11.037 11.98 10.889C11.95 10.866 11.922 10.839 11.898 10.809C11.827 10.72 11.763 10.598 11.705 10.441C11.624 10.223 11.537 9.849 11.445 9.319C11.405 9.092 11.375 8.932 11.354 8.838C11.32 8.684 11.285 8.571 11.25 8.5C11.123 8.5 11.025 8.509 10.954 8.527C10.919 8.723 10.864 8.916 10.789 9.104C10.637 9.489 10.414 9.828 10.121 10.121C9.828 10.414 9.489 10.637 9.104 10.789C8.75 10.93 8.381 11 8 11C7.619 11 7.25 10.93 6.896 10.789C6.511 10.637 6.172 10.414 5.879 10.121C5.586 9.828 5.363 9.489 5.211 9.104C5.136 8.916 5.081 8.723 5.046 8.527C4.975 8.509 4.877 8.5 4.75 8.5C4.715 8.571 4.68 8.684 4.646 8.838C4.625 8.932 4.595 9.092 4.555 9.319C4.463 9.849 4.376 10.223 4.295 10.441C4.237 10.598 4.173 10.72 4.102 10.809C3.947 11.003 3.664 11.034 3.47 10.879C3.44 10.855 3.413 10.828 3.39 10.797C3.365 10.763 3.34 10.724 3.316 10.68C3.221 10.503 3.147 10.256 3.094 9.938C3.031 9.562 3 9.083 3 8.5L2.019 8.5C2.058 8.963 2.151 9.421 2.3 9.872Z" />
    </svg>
  );
}

Vue

Vue: see /icons/donut.md

Svelte

Svelte: see /icons/donut.md

HTML img

HTML img: see /icons/donut.md

CSS

CSS: see /icons/donut.md

Data URL

Data URL: see /icons/donut.md

Sprite

Sprite: see /icons/donut.md

SwiftUI

SwiftUI: see /icons/donut.md

Compose

Compose: see /icons/donut.md

Android XML

Android XML: see /icons/donut.md

Flutter

Flutter: see /icons/donut.md

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. 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. More in how to use.

Meaning

Use it for

donut, doughnut, doughnuts

Don’t confuse with

donut-chart: donut-chart is the chart type

Tags

donut, doughnut

Category

Food & drink

Component name

DonutIcon

History

2026-10-30 added

More food & drink icons

apple avocado banana barrel bean bean-off beef beer bottle bowl bowl-chopsticks bread broccoli burger cake cake-slice · all food & drink icons

For agents

Metadata: /icons/donut.json · Markdown: /icons/donut.md · SVG: https://gentleface.com/svg/{style}/16/donut.svg · PNG: https://gentleface.com/png/{style}/{16|32|48}/donut.png

donut icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp

Code line-round

Meaning

More food & drink icons

For agents

donut icon