# section icon

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

- Category: Math & symbols
- Use it for: section sign, legal section, section mark
- Tags: section, section-sign, paragraph, legal, law, clause, symbol
- Component name: SectionIcon
- Added: 2026-10-16

## Alternatives

- `pilcrow`: the paragraph mark ¶ (paragraph)

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

The SVG of every style: https://gentleface.com/icons/section.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="M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z"/></svg>
```

### React

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

export function SectionIcon(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="M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z" />
    </svg>
  );
}
```

### Vue

```vue
<!-- Gentleface "section" (line-round), MIT. https://gentleface.com/icons/section -->
<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="M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z" />
  </svg>
</template>
```

### Svelte

```svelte
<!-- Gentleface "section" (line-round), MIT. https://gentleface.com/icons/section -->
<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="M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z" />
</svg>
```

### HTML img

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

### CSS

```css
/* Gentleface "section" (line-round), MIT. https://gentleface.com/icons/section. Takes the text color. */
.icon-section {
  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='M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z'/%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='M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z'/%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='M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z'/%3E%3C/svg%3E
```

### Sprite

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

### SwiftUI

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

struct SectionIcon: Shape {
    func path(in rect: CGRect) -> Path {
        var p = Path()
        p.move(to: CGPoint(x: 7.285, y: 2.101))
        p.addCurve(to: CGPoint(x: 6.24, y: 2.793), control1: CGPoint(x: 6.825, y: 2.235), control2: CGPoint(x: 6.477, y: 2.465))
        p.addCurve(to: CGPoint(x: 6.026, y: 3.74), control1: CGPoint(x: 6.024, y: 3.092), control2: CGPoint(x: 5.953, y: 3.408))
        p.addCurve(to: CGPoint(x: 6.672, y: 4.617), control1: CGPoint(x: 6.103, y: 4.087), control2: CGPoint(x: 6.318, y: 4.38))
        p.addCurve(to: CGPoint(x: 8, y: 5), control1: CGPoint(x: 7.052, y: 4.872), control2: CGPoint(x: 7.495, y: 5))
        p.addCurve(to: CGPoint(x: 9.071, y: 5.164), control1: CGPoint(x: 8.369, y: 5), control2: CGPoint(x: 8.726, y: 5.055))
        p.addCurve(to: CGPoint(x: 10.08, y: 5.695), control1: CGPoint(x: 9.451, y: 5.284), control2: CGPoint(x: 9.788, y: 5.461))
        p.addCurve(to: CGPoint(x: 10.773, y: 6.542), control1: CGPoint(x: 10.382, y: 5.937), control2: CGPoint(x: 10.613, y: 6.219))
        p.addCurve(to: CGPoint(x: 11, y: 7.5), control1: CGPoint(x: 10.924, y: 6.848), control2: CGPoint(x: 11, y: 7.168))
        p.addCurve(to: CGPoint(x: 10.773, y: 8.458), control1: CGPoint(x: 11, y: 7.832), control2: CGPoint(x: 10.924, y: 8.152))
        p.addCurve(to: CGPoint(x: 10.08, y: 9.305), control1: CGPoint(x: 10.613, y: 8.781), control2: CGPoint(x: 10.382, y: 9.063))
        p.addCurve(to: CGPoint(x: 9.805, y: 9.5), control1: CGPoint(x: 9.992, y: 9.375), control2: CGPoint(x: 9.9, y: 9.44))
        p.addCurve(to: CGPoint(x: 9.886, y: 9.553), control1: CGPoint(x: 9.832, y: 9.517), control2: CGPoint(x: 9.859, y: 9.535))
        p.addCurve(to: CGPoint(x: 10.588, y: 10.231), control1: CGPoint(x: 10.169, y: 9.743), control2: CGPoint(x: 10.403, y: 9.969))
        p.addCurve(to: CGPoint(x: 10.95, y: 11.045), control1: CGPoint(x: 10.766, y: 10.484), control2: CGPoint(x: 10.887, y: 10.756))
        p.addCurve(to: CGPoint(x: 10.956, y: 11.927), control1: CGPoint(x: 11.015, y: 11.339), control2: CGPoint(x: 11.017, y: 11.633))
        p.addCurve(to: CGPoint(x: 10.571, y: 12.793), control1: CGPoint(x: 10.893, y: 12.236), control2: CGPoint(x: 10.764, y: 12.525))
        p.addCurve(to: CGPoint(x: 9.86, y: 13.464), control1: CGPoint(x: 10.383, y: 13.053), control2: CGPoint(x: 10.146, y: 13.276))
        p.addCurve(to: CGPoint(x: 8.995, y: 13.859), control1: CGPoint(x: 9.599, y: 13.636), control2: CGPoint(x: 9.31, y: 13.768))
        p.addCurve(to: CGPoint(x: 8.032, y: 14), control1: CGPoint(x: 8.683, y: 13.95), control2: CGPoint(x: 8.362, y: 13.997))
        p.addCurve(to: CGPoint(x: 7.005, y: 13.859), control1: CGPoint(x: 7.679, y: 14.003), control2: CGPoint(x: 7.337, y: 13.956))
        p.addCurve(to: CGPoint(x: 6.089, y: 13.43), control1: CGPoint(x: 6.669, y: 13.762), control2: CGPoint(x: 6.363, y: 13.618))
        p.addCurve(to: CGPoint(x: 5.429, y: 12.793), control1: CGPoint(x: 5.826, y: 13.249), control2: CGPoint(x: 5.606, y: 13.037))
        p.addCurve(to: CGPoint(x: 5.338, y: 12.42), control1: CGPoint(x: 5.347, y: 12.678), control2: CGPoint(x: 5.317, y: 12.554))
        p.addCurve(to: CGPoint(x: 5.542, y: 12.095), control1: CGPoint(x: 5.36, y: 12.285), control2: CGPoint(x: 5.428, y: 12.177))
        p.addCurve(to: CGPoint(x: 5.915, y: 12.006), control1: CGPoint(x: 5.654, y: 12.014), control2: CGPoint(x: 5.778, y: 11.984))
        p.addCurve(to: CGPoint(x: 6.24, y: 12.207), control1: CGPoint(x: 6.051, y: 12.028), control2: CGPoint(x: 6.16, y: 12.095))
        p.addCurve(to: CGPoint(x: 7.285, y: 12.899), control1: CGPoint(x: 6.477, y: 12.535), control2: CGPoint(x: 6.825, y: 12.765))
        p.addCurve(to: CGPoint(x: 8.715, y: 12.899), control1: CGPoint(x: 7.762, y: 13.038), control2: CGPoint(x: 8.238, y: 13.038))
        p.addCurve(to: CGPoint(x: 9.76, y: 12.207), control1: CGPoint(x: 9.175, y: 12.765), control2: CGPoint(x: 9.523, y: 12.535))
        p.addCurve(to: CGPoint(x: 9.974, y: 11.26), control1: CGPoint(x: 9.976, y: 11.908), control2: CGPoint(x: 10.047, y: 11.592))
        p.addCurve(to: CGPoint(x: 9.328, y: 10.383), control1: CGPoint(x: 9.897, y: 10.913), control2: CGPoint(x: 9.682, y: 10.62))
        p.addCurve(to: CGPoint(x: 8, y: 10), control1: CGPoint(x: 8.948, y: 10.128), control2: CGPoint(x: 8.505, y: 10))
        p.addCurve(to: CGPoint(x: 6.929, y: 9.836), control1: CGPoint(x: 7.631, y: 10), control2: CGPoint(x: 7.274, y: 9.945))
        p.addCurve(to: CGPoint(x: 5.92, y: 9.305), control1: CGPoint(x: 6.549, y: 9.716), control2: CGPoint(x: 6.212, y: 9.539))
        p.addCurve(to: CGPoint(x: 5.227, y: 8.458), control1: CGPoint(x: 5.618, y: 9.063), control2: CGPoint(x: 5.387, y: 8.781))
        p.addCurve(to: CGPoint(x: 5, y: 7.5), control1: CGPoint(x: 5.076, y: 8.152), control2: CGPoint(x: 5, y: 7.832))
        p.addCurve(to: CGPoint(x: 5.227, y: 6.542), control1: CGPoint(x: 5, y: 7.168), control2: CGPoint(x: 5.076, y: 6.848))
        p.addCurve(to: CGPoint(x: 5.92, y: 5.695), control1: CGPoint(x: 5.387, y: 6.219), control2: CGPoint(x: 5.618, y: 5.937))
        p.addCurve(to: CGPoint(x: 6.195, y: 5.5), control1: CGPoint(x: 6.008, y: 5.625), control2: CGPoint(x: 6.1, y: 5.56))
        p.addCurve(to: CGPoint(x: 6.114, y: 5.447), control1: CGPoint(x: 6.168, y: 5.483), control2: CGPoint(x: 6.141, y: 5.465))
        p.addCurve(to: CGPoint(x: 5.412, y: 4.769), control1: CGPoint(x: 5.831, y: 5.257), control2: CGPoint(x: 5.597, y: 5.031))
        p.addCurve(to: CGPoint(x: 5.05, y: 3.955), control1: CGPoint(x: 5.234, y: 4.516), control2: CGPoint(x: 5.113, y: 4.244))
        p.addCurve(to: CGPoint(x: 5.044, y: 3.073), control1: CGPoint(x: 4.985, y: 3.661), control2: CGPoint(x: 4.983, y: 3.367))
        p.addCurve(to: CGPoint(x: 5.429, y: 2.207), control1: CGPoint(x: 5.107, y: 2.764), control2: CGPoint(x: 5.236, y: 2.475))
        p.addCurve(to: CGPoint(x: 6.14, y: 1.536), control1: CGPoint(x: 5.617, y: 1.947), control2: CGPoint(x: 5.854, y: 1.724))
        p.addCurve(to: CGPoint(x: 7.005, y: 1.141), control1: CGPoint(x: 6.401, y: 1.364), control2: CGPoint(x: 6.69, y: 1.232))
        p.addCurve(to: CGPoint(x: 7.968, y: 1), control1: CGPoint(x: 7.317, y: 1.05), control2: CGPoint(x: 7.638, y: 1.003))
        p.addCurve(to: CGPoint(x: 8.995, y: 1.141), control1: CGPoint(x: 8.321, y: 0.997), control2: CGPoint(x: 8.663, y: 1.044))
        p.addCurve(to: CGPoint(x: 9.911, y: 1.57), control1: CGPoint(x: 9.331, y: 1.238), control2: CGPoint(x: 9.637, y: 1.382))
        p.addCurve(to: CGPoint(x: 10.571, y: 2.207), control1: CGPoint(x: 10.174, y: 1.751), control2: CGPoint(x: 10.394, y: 1.963))
        p.addCurve(to: CGPoint(x: 10.659, y: 2.58), control1: CGPoint(x: 10.651, y: 2.319), control2: CGPoint(x: 10.681, y: 2.443))
        p.addCurve(to: CGPoint(x: 10.458, y: 2.905), control1: CGPoint(x: 10.637, y: 2.716), control2: CGPoint(x: 10.57, y: 2.825))
        p.addCurve(to: CGPoint(x: 10.085, y: 2.994), control1: CGPoint(x: 10.346, y: 2.986), control2: CGPoint(x: 10.222, y: 3.016))
        p.addCurve(to: CGPoint(x: 9.76, y: 2.793), control1: CGPoint(x: 9.949, y: 2.972), control2: CGPoint(x: 9.84, y: 2.905))
        p.addCurve(to: CGPoint(x: 8.715, y: 2.101), control1: CGPoint(x: 9.523, y: 2.465), control2: CGPoint(x: 9.175, y: 2.235))
        p.addCurve(to: CGPoint(x: 7.285, y: 2.101), control1: CGPoint(x: 8.238, y: 1.962), control2: CGPoint(x: 7.762, y: 1.962))
        p.closeSubpath()
        p.move(to: CGPoint(x: 9.455, y: 8.524))
        p.addCurve(to: CGPoint(x: 9.876, y: 8.014), control1: CGPoint(x: 9.642, y: 8.375), control2: CGPoint(x: 9.782, y: 8.205))
        p.addCurve(to: CGPoint(x: 10, y: 7.5), control1: CGPoint(x: 9.959, y: 7.848), control2: CGPoint(x: 10, y: 7.676))
        p.addCurve(to: CGPoint(x: 9.876, y: 6.986), control1: CGPoint(x: 10, y: 7.324), control2: CGPoint(x: 9.959, y: 7.152))
        p.addCurve(to: CGPoint(x: 9.455, y: 6.476), control1: CGPoint(x: 9.782, y: 6.795), control2: CGPoint(x: 9.642, y: 6.625))
        p.addCurve(to: CGPoint(x: 8.769, y: 6.117), control1: CGPoint(x: 9.26, y: 6.32), control2: CGPoint(x: 9.031, y: 6.2))
        p.addCurve(to: CGPoint(x: 8, y: 6), control1: CGPoint(x: 8.523, y: 6.039), control2: CGPoint(x: 8.266, y: 6))
        p.addCurve(to: CGPoint(x: 7.231, y: 6.117), control1: CGPoint(x: 7.734, y: 6), control2: CGPoint(x: 7.477, y: 6.039))
        p.addCurve(to: CGPoint(x: 6.545, y: 6.476), control1: CGPoint(x: 6.969, y: 6.2), control2: CGPoint(x: 6.74, y: 6.32))
        p.addCurve(to: CGPoint(x: 6.124, y: 6.986), control1: CGPoint(x: 6.358, y: 6.625), control2: CGPoint(x: 6.218, y: 6.795))
        p.addCurve(to: CGPoint(x: 6, y: 7.5), control1: CGPoint(x: 6.041, y: 7.152), control2: CGPoint(x: 6, y: 7.324))
        p.addCurve(to: CGPoint(x: 6.124, y: 8.014), control1: CGPoint(x: 6, y: 7.676), control2: CGPoint(x: 6.041, y: 7.848))
        p.addCurve(to: CGPoint(x: 6.545, y: 8.524), control1: CGPoint(x: 6.218, y: 8.205), control2: CGPoint(x: 6.358, y: 8.375))
        p.addCurve(to: CGPoint(x: 7.231, y: 8.883), control1: CGPoint(x: 6.74, y: 8.68), control2: CGPoint(x: 6.969, y: 8.8))
        p.addCurve(to: CGPoint(x: 8, y: 9), control1: CGPoint(x: 7.477, y: 8.961), control2: CGPoint(x: 7.734, y: 9))
        p.addCurve(to: CGPoint(x: 8.769, y: 8.883), control1: CGPoint(x: 8.266, y: 9), control2: CGPoint(x: 8.523, y: 8.961))
        p.addCurve(to: CGPoint(x: 9.455, y: 8.524), control1: CGPoint(x: 9.031, y: 8.8), control2: CGPoint(x: 9.26, y: 8.68))
        p.closeSubpath()
        return p.applying(CGAffineTransform(scaleX: rect.width / 16, y: rect.height / 16))
    }
}

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

### Compose

```kotlin
// Gentleface "section" (line-round), MIT. https://gentleface.com/icons/section
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 SectionIcon: ImageVector by lazy {
    ImageVector.Builder(
        name = "section", defaultWidth = 16.dp, defaultHeight = 16.dp,
        viewportWidth = 16f, viewportHeight = 16f,
    ).addPath(
        pathData = addPathNodes("M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z"),
        fill = SolidColor(Color.Black),
    ).build()
}

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

### Android XML

```xml
<!-- res/drawable/ic_section.xml · Gentleface "section" (line-round), MIT. https://gentleface.com/icons/section -->
<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="M7.285 2.101C6.825 2.235 6.477 2.465 6.24 2.793C6.024 3.092 5.953 3.408 6.026 3.74C6.103 4.087 6.318 4.38 6.672 4.617C7.052 4.872 7.495 5 8 5C8.369 5 8.726 5.055 9.071 5.164C9.451 5.284 9.788 5.461 10.08 5.695C10.382 5.937 10.613 6.219 10.773 6.542C10.924 6.848 11 7.168 11 7.5C11 7.832 10.924 8.152 10.773 8.458C10.613 8.781 10.382 9.063 10.08 9.305C9.992 9.375 9.9 9.44 9.805 9.5C9.832 9.517 9.859 9.535 9.886 9.553C10.169 9.743 10.403 9.969 10.588 10.231C10.766 10.484 10.887 10.756 10.95 11.045C11.015 11.339 11.017 11.633 10.956 11.927C10.893 12.236 10.764 12.525 10.571 12.793C10.383 13.053 10.146 13.276 9.86 13.464C9.599 13.636 9.31 13.768 8.995 13.859C8.683 13.95 8.362 13.997 8.032 14C7.679 14.003 7.337 13.956 7.005 13.859C6.669 13.762 6.363 13.618 6.089 13.43C5.826 13.249 5.606 13.037 5.429 12.793C5.347 12.678 5.317 12.554 5.338 12.42C5.36 12.285 5.428 12.177 5.542 12.095C5.654 12.014 5.778 11.984 5.915 12.006C6.051 12.028 6.16 12.095 6.24 12.207C6.477 12.535 6.825 12.765 7.285 12.899C7.762 13.038 8.238 13.038 8.715 12.899C9.175 12.765 9.523 12.535 9.76 12.207C9.976 11.908 10.047 11.592 9.974 11.26C9.897 10.913 9.682 10.62 9.328 10.383C8.948 10.128 8.505 10 8 10C7.631 10 7.274 9.945 6.929 9.836C6.549 9.716 6.212 9.539 5.92 9.305C5.618 9.063 5.387 8.781 5.227 8.458C5.076 8.152 5 7.832 5 7.5C5 7.168 5.076 6.848 5.227 6.542C5.387 6.219 5.618 5.937 5.92 5.695C6.008 5.625 6.1 5.56 6.195 5.5C6.168 5.483 6.141 5.465 6.114 5.447C5.831 5.257 5.597 5.031 5.412 4.769C5.234 4.516 5.113 4.244 5.05 3.955C4.985 3.661 4.983 3.367 5.044 3.073C5.107 2.764 5.236 2.475 5.429 2.207C5.617 1.947 5.854 1.724 6.14 1.536C6.401 1.364 6.69 1.232 7.005 1.141C7.317 1.05 7.638 1.003 7.968 1C8.321 0.997 8.663 1.044 8.995 1.141C9.331 1.238 9.637 1.382 9.911 1.57C10.174 1.751 10.394 1.963 10.571 2.207C10.651 2.319 10.681 2.443 10.659 2.58C10.637 2.716 10.57 2.825 10.458 2.905C10.346 2.986 10.222 3.016 10.085 2.994C9.949 2.972 9.84 2.905 9.76 2.793C9.523 2.465 9.175 2.235 8.715 2.101C8.238 1.962 7.762 1.962 7.285 2.101ZM9.455 8.524C9.642 8.375 9.782 8.205 9.876 8.014C9.959 7.848 10 7.676 10 7.5C10 7.324 9.959 7.152 9.876 6.986C9.782 6.795 9.642 6.625 9.455 6.476C9.26 6.32 9.031 6.2 8.769 6.117C8.523 6.039 8.266 6 8 6C7.734 6 7.477 6.039 7.231 6.117C6.969 6.2 6.74 6.32 6.545 6.476C6.358 6.625 6.218 6.795 6.124 6.986C6.041 7.152 6 7.324 6 7.5C6 7.676 6.041 7.848 6.124 8.014C6.218 8.205 6.358 8.375 6.545 8.524C6.74 8.68 6.969 8.8 7.231 8.883C7.477 8.961 7.734 9 8 9C8.266 9 8.523 8.961 8.769 8.883C9.031 8.8 9.26 8.68 9.455 8.524Z"/>
</vector>
```

### Flutter

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

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

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

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

  @override
  void paint(Canvas canvas, Size size) {
    canvas.scale(size.width / 16, size.height / 16);
    final p = Path()
      ..moveTo(7.285, 2.101)
      ..cubicTo(6.825, 2.235, 6.477, 2.465, 6.24, 2.793)
      ..cubicTo(6.024, 3.092, 5.953, 3.408, 6.026, 3.74)
      ..cubicTo(6.103, 4.087, 6.318, 4.38, 6.672, 4.617)
      ..cubicTo(7.052, 4.872, 7.495, 5, 8, 5)
      ..cubicTo(8.369, 5, 8.726, 5.055, 9.071, 5.164)
      ..cubicTo(9.451, 5.284, 9.788, 5.461, 10.08, 5.695)
      ..cubicTo(10.382, 5.937, 10.613, 6.219, 10.773, 6.542)
      ..cubicTo(10.924, 6.848, 11, 7.168, 11, 7.5)
      ..cubicTo(11, 7.832, 10.924, 8.152, 10.773, 8.458)
      ..cubicTo(10.613, 8.781, 10.382, 9.063, 10.08, 9.305)
      ..cubicTo(9.992, 9.375, 9.9, 9.44, 9.805, 9.5)
      ..cubicTo(9.832, 9.517, 9.859, 9.535, 9.886, 9.553)
      ..cubicTo(10.169, 9.743, 10.403, 9.969, 10.588, 10.231)
      ..cubicTo(10.766, 10.484, 10.887, 10.756, 10.95, 11.045)
      ..cubicTo(11.015, 11.339, 11.017, 11.633, 10.956, 11.927)
      ..cubicTo(10.893, 12.236, 10.764, 12.525, 10.571, 12.793)
      ..cubicTo(10.383, 13.053, 10.146, 13.276, 9.86, 13.464)
      ..cubicTo(9.599, 13.636, 9.31, 13.768, 8.995, 13.859)
      ..cubicTo(8.683, 13.95, 8.362, 13.997, 8.032, 14)
      ..cubicTo(7.679, 14.003, 7.337, 13.956, 7.005, 13.859)
      ..cubicTo(6.669, 13.762, 6.363, 13.618, 6.089, 13.43)
      ..cubicTo(5.826, 13.249, 5.606, 13.037, 5.429, 12.793)
      ..cubicTo(5.347, 12.678, 5.317, 12.554, 5.338, 12.42)
      ..cubicTo(5.36, 12.285, 5.428, 12.177, 5.542, 12.095)
      ..cubicTo(5.654, 12.014, 5.778, 11.984, 5.915, 12.006)
      ..cubicTo(6.051, 12.028, 6.16, 12.095, 6.24, 12.207)
      ..cubicTo(6.477, 12.535, 6.825, 12.765, 7.285, 12.899)
      ..cubicTo(7.762, 13.038, 8.238, 13.038, 8.715, 12.899)
      ..cubicTo(9.175, 12.765, 9.523, 12.535, 9.76, 12.207)
      ..cubicTo(9.976, 11.908, 10.047, 11.592, 9.974, 11.26)
      ..cubicTo(9.897, 10.913, 9.682, 10.62, 9.328, 10.383)
      ..cubicTo(8.948, 10.128, 8.505, 10, 8, 10)
      ..cubicTo(7.631, 10, 7.274, 9.945, 6.929, 9.836)
      ..cubicTo(6.549, 9.716, 6.212, 9.539, 5.92, 9.305)
      ..cubicTo(5.618, 9.063, 5.387, 8.781, 5.227, 8.458)
      ..cubicTo(5.076, 8.152, 5, 7.832, 5, 7.5)
      ..cubicTo(5, 7.168, 5.076, 6.848, 5.227, 6.542)
      ..cubicTo(5.387, 6.219, 5.618, 5.937, 5.92, 5.695)
      ..cubicTo(6.008, 5.625, 6.1, 5.56, 6.195, 5.5)
      ..cubicTo(6.168, 5.483, 6.141, 5.465, 6.114, 5.447)
      ..cubicTo(5.831, 5.257, 5.597, 5.031, 5.412, 4.769)
      ..cubicTo(5.234, 4.516, 5.113, 4.244, 5.05, 3.955)
      ..cubicTo(4.985, 3.661, 4.983, 3.367, 5.044, 3.073)
      ..cubicTo(5.107, 2.764, 5.236, 2.475, 5.429, 2.207)
      ..cubicTo(5.617, 1.947, 5.854, 1.724, 6.14, 1.536)
      ..cubicTo(6.401, 1.364, 6.69, 1.232, 7.005, 1.141)
      ..cubicTo(7.317, 1.05, 7.638, 1.003, 7.968, 1)
      ..cubicTo(8.321, 0.997, 8.663, 1.044, 8.995, 1.141)
      ..cubicTo(9.331, 1.238, 9.637, 1.382, 9.911, 1.57)
      ..cubicTo(10.174, 1.751, 10.394, 1.963, 10.571, 2.207)
      ..cubicTo(10.651, 2.319, 10.681, 2.443, 10.659, 2.58)
      ..cubicTo(10.637, 2.716, 10.57, 2.825, 10.458, 2.905)
      ..cubicTo(10.346, 2.986, 10.222, 3.016, 10.085, 2.994)
      ..cubicTo(9.949, 2.972, 9.84, 2.905, 9.76, 2.793)
      ..cubicTo(9.523, 2.465, 9.175, 2.235, 8.715, 2.101)
      ..cubicTo(8.238, 1.962, 7.762, 1.962, 7.285, 2.101)
      ..close()
      ..moveTo(9.455, 8.524)
      ..cubicTo(9.642, 8.375, 9.782, 8.205, 9.876, 8.014)
      ..cubicTo(9.959, 7.848, 10, 7.676, 10, 7.5)
      ..cubicTo(10, 7.324, 9.959, 7.152, 9.876, 6.986)
      ..cubicTo(9.782, 6.795, 9.642, 6.625, 9.455, 6.476)
      ..cubicTo(9.26, 6.32, 9.031, 6.2, 8.769, 6.117)
      ..cubicTo(8.523, 6.039, 8.266, 6, 8, 6)
      ..cubicTo(7.734, 6, 7.477, 6.039, 7.231, 6.117)
      ..cubicTo(6.969, 6.2, 6.74, 6.32, 6.545, 6.476)
      ..cubicTo(6.358, 6.625, 6.218, 6.795, 6.124, 6.986)
      ..cubicTo(6.041, 7.152, 6, 7.324, 6, 7.5)
      ..cubicTo(6, 7.676, 6.041, 7.848, 6.124, 8.014)
      ..cubicTo(6.218, 8.205, 6.358, 8.375, 6.545, 8.524)
      ..cubicTo(6.74, 8.68, 6.969, 8.8, 7.231, 8.883)
      ..cubicTo(7.477, 8.961, 7.734, 9, 8, 9)
      ..cubicTo(8.266, 9, 8.523, 8.961, 8.769, 8.883)
      ..cubicTo(9.031, 8.8, 9.26, 8.68, 9.455, 8.524)
      ..close();
    canvas.drawPath(p, Paint()..color = color);
  }

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