# venn-diagram icon

Venn diagram. Gentleface icon, drawn on the 16 px pixel grid. Free, MIT licensed. Page: https://gentleface.com/icons/venn-diagram

- Category: Charts & data
- Use it for: venn diagram, segment overlap
- Tags: venn, diagram, overlap, intersection, sets, segments, compare, circles
- Family: activity, activity-search, area-chart, area-chart-stacked, bar-chart, bar-chart-clock, bar-chart-grouped, bar-chart-grouped-filled, bar-chart-horizontal, bar-chart-off, bar-chart-pencil, bar-chart-plus, bar-chart-search, bar-chart-sparkle, bar-chart-stacked, bubble-chart, candlestick-chart, cohort-chart, combo-chart, donut-chart, funnel-chart, gantt-chart, heatmap, histogram, line-chart, pie-chart, radar-chart, scatter-chart, treemap, trending-down, trending-up, trending-up-down, waterfall-chart
- Component name: VennDiagramIcon
- Added: 2026-10-16

## Don't confuse with

- `boolean-intersect`: the shape operation in design tools

## 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/venn-diagram.svg · PNG https://gentleface.com/png/line-round/16/venn-diagram.png · https://gentleface.com/png/line-round/32/venn-diagram.png · https://gentleface.com/png/line-round/48/venn-diagram.png
- line-soft: https://gentleface.com/svg/line-soft/16/venn-diagram.svg · PNG https://gentleface.com/png/line-soft/16/venn-diagram.png · https://gentleface.com/png/line-soft/32/venn-diagram.png · https://gentleface.com/png/line-soft/48/venn-diagram.png
- line-sharp: https://gentleface.com/svg/line-sharp/16/venn-diagram.svg · PNG https://gentleface.com/png/line-sharp/16/venn-diagram.png · https://gentleface.com/png/line-sharp/32/venn-diagram.png · https://gentleface.com/png/line-sharp/48/venn-diagram.png
- solid-round: https://gentleface.com/svg/solid-round/16/venn-diagram.svg · PNG https://gentleface.com/png/solid-round/16/venn-diagram.png · https://gentleface.com/png/solid-round/32/venn-diagram.png · https://gentleface.com/png/solid-round/48/venn-diagram.png
- solid-soft: https://gentleface.com/svg/solid-soft/16/venn-diagram.svg · PNG https://gentleface.com/png/solid-soft/16/venn-diagram.png · https://gentleface.com/png/solid-soft/32/venn-diagram.png · https://gentleface.com/png/solid-soft/48/venn-diagram.png
- solid-sharp: https://gentleface.com/svg/solid-sharp/16/venn-diagram.svg · PNG https://gentleface.com/png/solid-sharp/16/venn-diagram.png · https://gentleface.com/png/solid-sharp/32/venn-diagram.png · https://gentleface.com/png/solid-sharp/48/venn-diagram.png

The SVG of every style: https://gentleface.com/icons/venn-diagram.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="M10.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z"/></svg>
```

### React

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

export function VennDiagramIcon(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.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z" />
    </svg>
  );
}
```

### Vue

```vue
<!-- Gentleface "venn-diagram" (line-round), MIT. https://gentleface.com/icons/venn-diagram -->
<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="M10.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z" />
  </svg>
</template>
```

### Svelte

```svelte
<!-- Gentleface "venn-diagram" (line-round), MIT. https://gentleface.com/icons/venn-diagram -->
<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="M10.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z" />
</svg>
```

### HTML img

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

### CSS

```css
/* Gentleface "venn-diagram" (line-round), MIT. https://gentleface.com/icons/venn-diagram. Takes the text color. */
.icon-venn-diagram {
  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='M10.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z'/%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='M10.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z'/%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='M10.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z'/%3E%3C/svg%3E
```

### Sprite

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

### SwiftUI

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

struct VennDiagramIcon: Shape {
    func path(in rect: CGRect) -> Path {
        var p = Path()
        p.move(to: CGPoint(x: 10.062, y: 3))
        p.addCurve(to: CGPoint(x: 12.635, y: 3.751), control1: CGPoint(x: 10.989, y: 3.012), control2: CGPoint(x: 11.847, y: 3.262))
        p.addCurve(to: CGPoint(x: 14.451, y: 5.723), control1: CGPoint(x: 13.423, y: 4.24), control2: CGPoint(x: 14.029, y: 4.897))
        p.addCurve(to: CGPoint(x: 15, y: 8), control1: CGPoint(x: 14.817, y: 6.438), control2: CGPoint(x: 15, y: 7.197))
        p.addCurve(to: CGPoint(x: 14.451, y: 10.277), control1: CGPoint(x: 15, y: 8.803), control2: CGPoint(x: 14.817, y: 9.562))
        p.addCurve(to: CGPoint(x: 12.635, y: 12.249), control1: CGPoint(x: 14.029, y: 11.103), control2: CGPoint(x: 13.423, y: 11.76))
        p.addCurve(to: CGPoint(x: 10.062, y: 13), control1: CGPoint(x: 11.847, y: 12.738), control2: CGPoint(x: 10.989, y: 12.988))
        p.addCurve(to: CGPoint(x: 8, y: 12.583), control1: CGPoint(x: 9.341, y: 13.009), control2: CGPoint(x: 8.654, y: 12.87))
        p.addCurve(to: CGPoint(x: 5.938, y: 13), control1: CGPoint(x: 7.346, y: 12.87), control2: CGPoint(x: 6.659, y: 13.009))
        p.addCurve(to: CGPoint(x: 3.365, y: 12.249), control1: CGPoint(x: 5.011, y: 12.988), control2: CGPoint(x: 4.153, y: 12.738))
        p.addCurve(to: CGPoint(x: 1.549, y: 10.277), control1: CGPoint(x: 2.577, y: 11.76), control2: CGPoint(x: 1.971, y: 11.103))
        p.addCurve(to: CGPoint(x: 1, y: 8), control1: CGPoint(x: 1.183, y: 9.562), control2: CGPoint(x: 1, y: 8.803))
        p.addCurve(to: CGPoint(x: 1.549, y: 5.723), control1: CGPoint(x: 1, y: 7.197), control2: CGPoint(x: 1.183, y: 6.438))
        p.addCurve(to: CGPoint(x: 3.365, y: 3.751), control1: CGPoint(x: 1.971, y: 4.897), control2: CGPoint(x: 2.577, y: 4.24))
        p.addCurve(to: CGPoint(x: 5.938, y: 3), control1: CGPoint(x: 4.153, y: 3.262), control2: CGPoint(x: 5.011, y: 3.012))
        p.addCurve(to: CGPoint(x: 8, y: 3.417), control1: CGPoint(x: 6.659, y: 2.991), control2: CGPoint(x: 7.346, y: 3.13))
        p.addCurve(to: CGPoint(x: 10.062, y: 3), control1: CGPoint(x: 8.654, y: 3.13), control2: CGPoint(x: 9.341, y: 2.991))
        p.closeSubpath()
        p.move(to: CGPoint(x: 12.108, y: 11.399))
        p.addCurve(to: CGPoint(x: 13.561, y: 9.822), control1: CGPoint(x: 12.739, y: 11.008), control2: CGPoint(x: 13.223, y: 10.482))
        p.addCurve(to: CGPoint(x: 14, y: 8), control1: CGPoint(x: 13.854, y: 9.25), control2: CGPoint(x: 14, y: 8.643))
        p.addCurve(to: CGPoint(x: 13.561, y: 6.178), control1: CGPoint(x: 14, y: 7.357), control2: CGPoint(x: 13.854, y: 6.75))
        p.addCurve(to: CGPoint(x: 12.108, y: 4.601), control1: CGPoint(x: 13.223, y: 5.518), control2: CGPoint(x: 12.739, y: 4.992))
        p.addCurve(to: CGPoint(x: 10.049, y: 4), control1: CGPoint(x: 11.478, y: 4.21), control2: CGPoint(x: 10.791, y: 4.009))
        p.addCurve(to: CGPoint(x: 9.128, y: 4.095), control1: CGPoint(x: 9.734, y: 3.996), control2: CGPoint(x: 9.427, y: 4.028))
        p.addCurve(to: CGPoint(x: 10.249, y: 5.365), control1: CGPoint(x: 9.568, y: 4.445), control2: CGPoint(x: 9.942, y: 4.869))
        p.addCurve(to: CGPoint(x: 11, y: 8), control1: CGPoint(x: 10.75, y: 6.172), control2: CGPoint(x: 11, y: 7.05))
        p.addCurve(to: CGPoint(x: 10.249, y: 10.635), control1: CGPoint(x: 11, y: 8.95), control2: CGPoint(x: 10.75, y: 9.828))
        p.addCurve(to: CGPoint(x: 9.128, y: 11.905), control1: CGPoint(x: 9.942, y: 11.131), control2: CGPoint(x: 9.568, y: 11.555))
        p.addCurve(to: CGPoint(x: 10.049, y: 12), control1: CGPoint(x: 9.427, y: 11.972), control2: CGPoint(x: 9.734, y: 12.004))
        p.addCurve(to: CGPoint(x: 12.108, y: 11.399), control1: CGPoint(x: 10.791, y: 11.991), control2: CGPoint(x: 11.478, y: 11.79))
        p.closeSubpath()
        p.move(to: CGPoint(x: 3.892, y: 4.601))
        p.addCurve(to: CGPoint(x: 2.439, y: 6.178), control1: CGPoint(x: 3.261, y: 4.992), control2: CGPoint(x: 2.777, y: 5.518))
        p.addCurve(to: CGPoint(x: 2, y: 8), control1: CGPoint(x: 2.146, y: 6.75), control2: CGPoint(x: 2, y: 7.357))
        p.addCurve(to: CGPoint(x: 2.439, y: 9.822), control1: CGPoint(x: 2, y: 8.643), control2: CGPoint(x: 2.146, y: 9.25))
        p.addCurve(to: CGPoint(x: 3.892, y: 11.399), control1: CGPoint(x: 2.777, y: 10.482), control2: CGPoint(x: 3.261, y: 11.008))
        p.addCurve(to: CGPoint(x: 5.951, y: 12), control1: CGPoint(x: 4.522, y: 11.79), control2: CGPoint(x: 5.209, y: 11.991))
        p.addCurve(to: CGPoint(x: 6.872, y: 11.905), control1: CGPoint(x: 6.266, y: 12.004), control2: CGPoint(x: 6.573, y: 11.972))
        p.addCurve(to: CGPoint(x: 5.751, y: 10.635), control1: CGPoint(x: 6.432, y: 11.555), control2: CGPoint(x: 6.058, y: 11.131))
        p.addCurve(to: CGPoint(x: 5, y: 8), control1: CGPoint(x: 5.25, y: 9.828), control2: CGPoint(x: 5, y: 8.95))
        p.addCurve(to: CGPoint(x: 5.751, y: 5.365), control1: CGPoint(x: 5, y: 7.05), control2: CGPoint(x: 5.25, y: 6.172))
        p.addCurve(to: CGPoint(x: 6.872, y: 4.095), control1: CGPoint(x: 6.058, y: 4.869), control2: CGPoint(x: 6.432, y: 4.445))
        p.addCurve(to: CGPoint(x: 5.951, y: 4), control1: CGPoint(x: 6.573, y: 4.028), control2: CGPoint(x: 6.266, y: 3.996))
        p.addCurve(to: CGPoint(x: 3.892, y: 4.601), control1: CGPoint(x: 5.209, y: 4.009), control2: CGPoint(x: 4.522, y: 4.21))
        p.closeSubpath()
        p.move(to: CGPoint(x: 6, y: 8))
        p.addCurve(to: CGPoint(x: 6.601, y: 10.108), control1: CGPoint(x: 6, y: 8.76), control2: CGPoint(x: 6.2, y: 9.463))
        p.addCurve(to: CGPoint(x: 8, y: 11.465), control1: CGPoint(x: 6.956, y: 10.682), control2: CGPoint(x: 7.423, y: 11.134))
        p.addCurve(to: CGPoint(x: 9.399, y: 10.108), control1: CGPoint(x: 8.577, y: 11.134), control2: CGPoint(x: 9.044, y: 10.682))
        p.addCurve(to: CGPoint(x: 10, y: 8), control1: CGPoint(x: 9.8, y: 9.463), control2: CGPoint(x: 10, y: 8.76))
        p.addCurve(to: CGPoint(x: 9.399, y: 5.892), control1: CGPoint(x: 10, y: 7.24), control2: CGPoint(x: 9.8, y: 6.537))
        p.addCurve(to: CGPoint(x: 8, y: 4.535), control1: CGPoint(x: 9.044, y: 5.318), control2: CGPoint(x: 8.577, y: 4.866))
        p.addCurve(to: CGPoint(x: 6.601, y: 5.892), control1: CGPoint(x: 7.423, y: 4.866), control2: CGPoint(x: 6.956, y: 5.318))
        p.addCurve(to: CGPoint(x: 6, y: 8), control1: CGPoint(x: 6.2, y: 6.537), control2: CGPoint(x: 6, y: 7.24))
        p.closeSubpath()
        return p.applying(CGAffineTransform(scaleX: rect.width / 16, y: rect.height / 16))
    }
}

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

### Compose

```kotlin
// Gentleface "venn-diagram" (line-round), MIT. https://gentleface.com/icons/venn-diagram
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 VennDiagramIcon: ImageVector by lazy {
    ImageVector.Builder(
        name = "venn-diagram", defaultWidth = 16.dp, defaultHeight = 16.dp,
        viewportWidth = 16f, viewportHeight = 16f,
    ).addPath(
        pathData = addPathNodes("M10.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z"),
        fill = SolidColor(Color.Black),
    ).build()
}

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

### Android XML

```xml
<!-- res/drawable/ic_venn_diagram.xml · Gentleface "venn-diagram" (line-round), MIT. https://gentleface.com/icons/venn-diagram -->
<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="M10.062 3C10.989 3.012 11.847 3.262 12.635 3.751C13.423 4.24 14.029 4.897 14.451 5.723C14.817 6.438 15 7.197 15 8C15 8.803 14.817 9.562 14.451 10.277C14.029 11.103 13.423 11.76 12.635 12.249C11.847 12.738 10.989 12.988 10.062 13C9.341 13.009 8.654 12.87 8 12.583C7.346 12.87 6.659 13.009 5.938 13C5.011 12.988 4.153 12.738 3.365 12.249C2.577 11.76 1.971 11.103 1.549 10.277C1.183 9.562 1 8.803 1 8C1 7.197 1.183 6.438 1.549 5.723C1.971 4.897 2.577 4.24 3.365 3.751C4.153 3.262 5.011 3.012 5.938 3C6.659 2.991 7.346 3.13 8 3.417C8.654 3.13 9.341 2.991 10.062 3ZM12.108 11.399C12.739 11.008 13.223 10.482 13.561 9.822C13.854 9.25 14 8.643 14 8C14 7.357 13.854 6.75 13.561 6.178C13.223 5.518 12.739 4.992 12.108 4.601C11.478 4.21 10.791 4.009 10.049 4C9.734 3.996 9.427 4.028 9.128 4.095C9.568 4.445 9.942 4.869 10.249 5.365C10.75 6.172 11 7.05 11 8C11 8.95 10.75 9.828 10.249 10.635C9.942 11.131 9.568 11.555 9.128 11.905C9.427 11.972 9.734 12.004 10.049 12C10.791 11.991 11.478 11.79 12.108 11.399ZM3.892 4.601C3.261 4.992 2.777 5.518 2.439 6.178C2.146 6.75 2 7.357 2 8C2 8.643 2.146 9.25 2.439 9.822C2.777 10.482 3.261 11.008 3.892 11.399C4.522 11.79 5.209 11.991 5.951 12C6.266 12.004 6.573 11.972 6.872 11.905C6.432 11.555 6.058 11.131 5.751 10.635C5.25 9.828 5 8.95 5 8C5 7.05 5.25 6.172 5.751 5.365C6.058 4.869 6.432 4.445 6.872 4.095C6.573 4.028 6.266 3.996 5.951 4C5.209 4.009 4.522 4.21 3.892 4.601ZM6 8C6 8.76 6.2 9.463 6.601 10.108C6.956 10.682 7.423 11.134 8 11.465C8.577 11.134 9.044 10.682 9.399 10.108C9.8 9.463 10 8.76 10 8C10 7.24 9.8 6.537 9.399 5.892C9.044 5.318 8.577 4.866 8 4.535C7.423 4.866 6.956 5.318 6.601 5.892C6.2 6.537 6 7.24 6 8Z"/>
</vector>
```

### Flutter

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

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

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

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

  @override
  void paint(Canvas canvas, Size size) {
    canvas.scale(size.width / 16, size.height / 16);
    final p = Path()
      ..moveTo(10.062, 3)
      ..cubicTo(10.989, 3.012, 11.847, 3.262, 12.635, 3.751)
      ..cubicTo(13.423, 4.24, 14.029, 4.897, 14.451, 5.723)
      ..cubicTo(14.817, 6.438, 15, 7.197, 15, 8)
      ..cubicTo(15, 8.803, 14.817, 9.562, 14.451, 10.277)
      ..cubicTo(14.029, 11.103, 13.423, 11.76, 12.635, 12.249)
      ..cubicTo(11.847, 12.738, 10.989, 12.988, 10.062, 13)
      ..cubicTo(9.341, 13.009, 8.654, 12.87, 8, 12.583)
      ..cubicTo(7.346, 12.87, 6.659, 13.009, 5.938, 13)
      ..cubicTo(5.011, 12.988, 4.153, 12.738, 3.365, 12.249)
      ..cubicTo(2.577, 11.76, 1.971, 11.103, 1.549, 10.277)
      ..cubicTo(1.183, 9.562, 1, 8.803, 1, 8)
      ..cubicTo(1, 7.197, 1.183, 6.438, 1.549, 5.723)
      ..cubicTo(1.971, 4.897, 2.577, 4.24, 3.365, 3.751)
      ..cubicTo(4.153, 3.262, 5.011, 3.012, 5.938, 3)
      ..cubicTo(6.659, 2.991, 7.346, 3.13, 8, 3.417)
      ..cubicTo(8.654, 3.13, 9.341, 2.991, 10.062, 3)
      ..close()
      ..moveTo(12.108, 11.399)
      ..cubicTo(12.739, 11.008, 13.223, 10.482, 13.561, 9.822)
      ..cubicTo(13.854, 9.25, 14, 8.643, 14, 8)
      ..cubicTo(14, 7.357, 13.854, 6.75, 13.561, 6.178)
      ..cubicTo(13.223, 5.518, 12.739, 4.992, 12.108, 4.601)
      ..cubicTo(11.478, 4.21, 10.791, 4.009, 10.049, 4)
      ..cubicTo(9.734, 3.996, 9.427, 4.028, 9.128, 4.095)
      ..cubicTo(9.568, 4.445, 9.942, 4.869, 10.249, 5.365)
      ..cubicTo(10.75, 6.172, 11, 7.05, 11, 8)
      ..cubicTo(11, 8.95, 10.75, 9.828, 10.249, 10.635)
      ..cubicTo(9.942, 11.131, 9.568, 11.555, 9.128, 11.905)
      ..cubicTo(9.427, 11.972, 9.734, 12.004, 10.049, 12)
      ..cubicTo(10.791, 11.991, 11.478, 11.79, 12.108, 11.399)
      ..close()
      ..moveTo(3.892, 4.601)
      ..cubicTo(3.261, 4.992, 2.777, 5.518, 2.439, 6.178)
      ..cubicTo(2.146, 6.75, 2, 7.357, 2, 8)
      ..cubicTo(2, 8.643, 2.146, 9.25, 2.439, 9.822)
      ..cubicTo(2.777, 10.482, 3.261, 11.008, 3.892, 11.399)
      ..cubicTo(4.522, 11.79, 5.209, 11.991, 5.951, 12)
      ..cubicTo(6.266, 12.004, 6.573, 11.972, 6.872, 11.905)
      ..cubicTo(6.432, 11.555, 6.058, 11.131, 5.751, 10.635)
      ..cubicTo(5.25, 9.828, 5, 8.95, 5, 8)
      ..cubicTo(5, 7.05, 5.25, 6.172, 5.751, 5.365)
      ..cubicTo(6.058, 4.869, 6.432, 4.445, 6.872, 4.095)
      ..cubicTo(6.573, 4.028, 6.266, 3.996, 5.951, 4)
      ..cubicTo(5.209, 4.009, 4.522, 4.21, 3.892, 4.601)
      ..close()
      ..moveTo(6, 8)
      ..cubicTo(6, 8.76, 6.2, 9.463, 6.601, 10.108)
      ..cubicTo(6.956, 10.682, 7.423, 11.134, 8, 11.465)
      ..cubicTo(8.577, 11.134, 9.044, 10.682, 9.399, 10.108)
      ..cubicTo(9.8, 9.463, 10, 8.76, 10, 8)
      ..cubicTo(10, 7.24, 9.8, 6.537, 9.399, 5.892)
      ..cubicTo(9.044, 5.318, 8.577, 4.866, 8, 4.535)
      ..cubicTo(7.423, 4.866, 6.956, 5.318, 6.601, 5.892)
      ..cubicTo(6.2, 6.537, 6, 7.24, 6, 8)
      ..close();
    canvas.drawPath(p, Paint()..color = color);
  }

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