# hash icon

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

- Category: Math & symbols
- Use it for: hashtag, hash, number sign, channel
- Tags: hash, hashtag, pound, octothorpe, number, channel, symbol
- Component name: HashIcon
- Added: 2026-10-14

## Alternatives

- `numbers`: a number field or a numeric type (number-field)

## Also fits

- number field: the # number sign (number-sign)

## Not for

- tag (use `tag`): a # hashtag or topic
- frame (use `frame`): the # sign means hashtag or channel

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

The SVG of every style: https://gentleface.com/icons/hash.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="M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z"/></svg>
```

### React

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

export function HashIcon(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="M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z" />
    </svg>
  );
}
```

### Vue

```vue
<!-- Gentleface "hash" (line-round), MIT. https://gentleface.com/icons/hash -->
<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="M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z" />
  </svg>
</template>
```

### Svelte

```svelte
<!-- Gentleface "hash" (line-round), MIT. https://gentleface.com/icons/hash -->
<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="M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z" />
</svg>
```

### HTML img

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

### CSS

```css
/* Gentleface "hash" (line-round), MIT. https://gentleface.com/icons/hash. Takes the text color. */
.icon-hash {
  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='M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z'/%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='M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z'/%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='M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z'/%3E%3C/svg%3E
```

### Sprite

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

### SwiftUI

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

struct HashIcon: Shape {
    func path(in rect: CGRect) -> Path {
        var p = Path()
        p.move(to: CGPoint(x: 2.144, y: 9.856))
        p.addCurve(to: CGPoint(x: 2, y: 9.5), control1: CGPoint(x: 2.048, y: 9.759), control2: CGPoint(x: 2, y: 9.641))
        p.addCurve(to: CGPoint(x: 2.144, y: 9.144), control1: CGPoint(x: 2, y: 9.359), control2: CGPoint(x: 2.048, y: 9.241))
        p.addCurve(to: CGPoint(x: 2.5, y: 9), control1: CGPoint(x: 2.241, y: 9.048), control2: CGPoint(x: 2.359, y: 9))
        p.addLine(to: CGPoint(x: 4.69, y: 9))
        p.addLine(to: CGPoint(x: 5.29, y: 6))
        p.addLine(to: CGPoint(x: 2.5, y: 6))
        p.addCurve(to: CGPoint(x: 2.144, y: 5.856), control1: CGPoint(x: 2.359, y: 6), control2: CGPoint(x: 2.241, y: 5.952))
        p.addCurve(to: CGPoint(x: 2, y: 5.5), control1: CGPoint(x: 2.048, y: 5.759), control2: CGPoint(x: 2, y: 5.641))
        p.addCurve(to: CGPoint(x: 2.144, y: 5.144), control1: CGPoint(x: 2, y: 5.359), control2: CGPoint(x: 2.048, y: 5.241))
        p.addCurve(to: CGPoint(x: 2.5, y: 5), control1: CGPoint(x: 2.241, y: 5.048), control2: CGPoint(x: 2.359, y: 5))
        p.addLine(to: CGPoint(x: 5.49, y: 5))
        p.addLine(to: CGPoint(x: 6.01, y: 2.402))
        p.addCurve(to: CGPoint(x: 6.223, y: 2.084), control1: CGPoint(x: 6.037, y: 2.267), control2: CGPoint(x: 6.108, y: 2.161))
        p.addCurve(to: CGPoint(x: 6.598, y: 2.01), control1: CGPoint(x: 6.338, y: 2.007), control2: CGPoint(x: 6.463, y: 1.983))
        p.addCurve(to: CGPoint(x: 6.916, y: 2.223), control1: CGPoint(x: 6.733, y: 2.037), control2: CGPoint(x: 6.839, y: 2.108))
        p.addCurve(to: CGPoint(x: 6.99, y: 2.598), control1: CGPoint(x: 6.993, y: 2.338), control2: CGPoint(x: 7.017, y: 2.463))
        p.addLine(to: CGPoint(x: 6.51, y: 5))
        p.addLine(to: CGPoint(x: 9.49, y: 5))
        p.addLine(to: CGPoint(x: 10.01, y: 2.402))
        p.addCurve(to: CGPoint(x: 10.223, y: 2.084), control1: CGPoint(x: 10.037, y: 2.267), control2: CGPoint(x: 10.108, y: 2.161))
        p.addCurve(to: CGPoint(x: 10.598, y: 2.01), control1: CGPoint(x: 10.338, y: 2.007), control2: CGPoint(x: 10.463, y: 1.983))
        p.addCurve(to: CGPoint(x: 10.919, y: 2.221), control1: CGPoint(x: 10.736, y: 2.037), control2: CGPoint(x: 10.843, y: 2.108))
        p.addCurve(to: CGPoint(x: 10.99, y: 2.598), control1: CGPoint(x: 10.994, y: 2.334), control2: CGPoint(x: 11.018, y: 2.46))
        p.addLine(to: CGPoint(x: 10.51, y: 5))
        p.addLine(to: CGPoint(x: 12.5, y: 5))
        p.addCurve(to: CGPoint(x: 12.856, y: 5.144), control1: CGPoint(x: 12.641, y: 5), control2: CGPoint(x: 12.759, y: 5.048))
        p.addCurve(to: CGPoint(x: 13, y: 5.5), control1: CGPoint(x: 12.952, y: 5.241), control2: CGPoint(x: 13, y: 5.359))
        p.addCurve(to: CGPoint(x: 12.856, y: 5.856), control1: CGPoint(x: 13, y: 5.641), control2: CGPoint(x: 12.952, y: 5.759))
        p.addCurve(to: CGPoint(x: 12.5, y: 6), control1: CGPoint(x: 12.759, y: 5.952), control2: CGPoint(x: 12.641, y: 6))
        p.addLine(to: CGPoint(x: 10.31, y: 6))
        p.addLine(to: CGPoint(x: 9.71, y: 9))
        p.addLine(to: CGPoint(x: 12.5, y: 9))
        p.addCurve(to: CGPoint(x: 12.856, y: 9.144), control1: CGPoint(x: 12.641, y: 9), control2: CGPoint(x: 12.759, y: 9.048))
        p.addCurve(to: CGPoint(x: 13, y: 9.5), control1: CGPoint(x: 12.952, y: 9.241), control2: CGPoint(x: 13, y: 9.359))
        p.addCurve(to: CGPoint(x: 12.856, y: 9.856), control1: CGPoint(x: 13, y: 9.641), control2: CGPoint(x: 12.952, y: 9.759))
        p.addCurve(to: CGPoint(x: 12.5, y: 10), control1: CGPoint(x: 12.759, y: 9.952), control2: CGPoint(x: 12.641, y: 10))
        p.addLine(to: CGPoint(x: 9.51, y: 10))
        p.addLine(to: CGPoint(x: 8.99, y: 12.598))
        p.addCurve(to: CGPoint(x: 8.779, y: 12.919), control1: CGPoint(x: 8.963, y: 12.736), control2: CGPoint(x: 8.892, y: 12.843))
        p.addCurve(to: CGPoint(x: 8.402, y: 12.99), control1: CGPoint(x: 8.666, y: 12.994), control2: CGPoint(x: 8.54, y: 13.018))
        p.addCurve(to: CGPoint(x: 8.081, y: 12.779), control1: CGPoint(x: 8.264, y: 12.963), control2: CGPoint(x: 8.157, y: 12.892))
        p.addCurve(to: CGPoint(x: 8.01, y: 12.402), control1: CGPoint(x: 8.006, y: 12.666), control2: CGPoint(x: 7.982, y: 12.54))
        p.addLine(to: CGPoint(x: 8.49, y: 10))
        p.addLine(to: CGPoint(x: 5.51, y: 10))
        p.addLine(to: CGPoint(x: 4.99, y: 12.598))
        p.addCurve(to: CGPoint(x: 4.779, y: 12.919), control1: CGPoint(x: 4.963, y: 12.736), control2: CGPoint(x: 4.892, y: 12.843))
        p.addCurve(to: CGPoint(x: 4.402, y: 12.99), control1: CGPoint(x: 4.666, y: 12.994), control2: CGPoint(x: 4.54, y: 13.018))
        p.addCurve(to: CGPoint(x: 4.084, y: 12.777), control1: CGPoint(x: 4.267, y: 12.963), control2: CGPoint(x: 4.161, y: 12.892))
        p.addCurve(to: CGPoint(x: 4.01, y: 12.402), control1: CGPoint(x: 4.007, y: 12.662), control2: CGPoint(x: 3.983, y: 12.537))
        p.addLine(to: CGPoint(x: 4.49, y: 10))
        p.addLine(to: CGPoint(x: 2.5, y: 10))
        p.addCurve(to: CGPoint(x: 2.144, y: 9.856), control1: CGPoint(x: 2.359, y: 10), control2: CGPoint(x: 2.241, y: 9.952))
        p.closeSubpath()
        p.move(to: CGPoint(x: 9.29, y: 6))
        p.addLine(to: CGPoint(x: 6.31, y: 6))
        p.addLine(to: CGPoint(x: 5.71, y: 9))
        p.addLine(to: CGPoint(x: 8.69, y: 9))
        p.addLine(to: CGPoint(x: 9.29, y: 6))
        p.closeSubpath()
        return p.applying(CGAffineTransform(scaleX: rect.width / 16, y: rect.height / 16))
    }
}

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

### Compose

```kotlin
// Gentleface "hash" (line-round), MIT. https://gentleface.com/icons/hash
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 HashIcon: ImageVector by lazy {
    ImageVector.Builder(
        name = "hash", defaultWidth = 16.dp, defaultHeight = 16.dp,
        viewportWidth = 16f, viewportHeight = 16f,
    ).addPath(
        pathData = addPathNodes("M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z"),
        fill = SolidColor(Color.Black),
    ).build()
}

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

### Android XML

```xml
<!-- res/drawable/ic_hash.xml · Gentleface "hash" (line-round), MIT. https://gentleface.com/icons/hash -->
<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="M2.144 9.856C2.048 9.759 2 9.641 2 9.5C2 9.359 2.048 9.241 2.144 9.144C2.241 9.048 2.359 9 2.5 9L4.69 9L5.29 6L2.5 6C2.359 6 2.241 5.952 2.144 5.856C2.048 5.759 2 5.641 2 5.5C2 5.359 2.048 5.241 2.144 5.144C2.241 5.048 2.359 5 2.5 5L5.49 5L6.01 2.402C6.037 2.267 6.108 2.161 6.223 2.084C6.338 2.007 6.463 1.983 6.598 2.01C6.733 2.037 6.839 2.108 6.916 2.223C6.993 2.338 7.017 2.463 6.99 2.598L6.51 5L9.49 5L10.01 2.402C10.037 2.267 10.108 2.161 10.223 2.084C10.338 2.007 10.463 1.983 10.598 2.01C10.736 2.037 10.843 2.108 10.919 2.221C10.994 2.334 11.018 2.46 10.99 2.598L10.51 5L12.5 5C12.641 5 12.759 5.048 12.856 5.144C12.952 5.241 13 5.359 13 5.5C13 5.641 12.952 5.759 12.856 5.856C12.759 5.952 12.641 6 12.5 6L10.31 6L9.71 9L12.5 9C12.641 9 12.759 9.048 12.856 9.144C12.952 9.241 13 9.359 13 9.5C13 9.641 12.952 9.759 12.856 9.856C12.759 9.952 12.641 10 12.5 10L9.51 10L8.99 12.598C8.963 12.736 8.892 12.843 8.779 12.919C8.666 12.994 8.54 13.018 8.402 12.99C8.264 12.963 8.157 12.892 8.081 12.779C8.006 12.666 7.982 12.54 8.01 12.402L8.49 10L5.51 10L4.99 12.598C4.963 12.736 4.892 12.843 4.779 12.919C4.666 12.994 4.54 13.018 4.402 12.99C4.267 12.963 4.161 12.892 4.084 12.777C4.007 12.662 3.983 12.537 4.01 12.402L4.49 10L2.5 10C2.359 10 2.241 9.952 2.144 9.856ZM9.29 6L6.31 6L5.71 9L8.69 9L9.29 6Z"/>
</vector>
```

### Flutter

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

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

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

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

  @override
  void paint(Canvas canvas, Size size) {
    canvas.scale(size.width / 16, size.height / 16);
    final p = Path()
      ..moveTo(2.144, 9.856)
      ..cubicTo(2.048, 9.759, 2, 9.641, 2, 9.5)
      ..cubicTo(2, 9.359, 2.048, 9.241, 2.144, 9.144)
      ..cubicTo(2.241, 9.048, 2.359, 9, 2.5, 9)
      ..lineTo(4.69, 9)
      ..lineTo(5.29, 6)
      ..lineTo(2.5, 6)
      ..cubicTo(2.359, 6, 2.241, 5.952, 2.144, 5.856)
      ..cubicTo(2.048, 5.759, 2, 5.641, 2, 5.5)
      ..cubicTo(2, 5.359, 2.048, 5.241, 2.144, 5.144)
      ..cubicTo(2.241, 5.048, 2.359, 5, 2.5, 5)
      ..lineTo(5.49, 5)
      ..lineTo(6.01, 2.402)
      ..cubicTo(6.037, 2.267, 6.108, 2.161, 6.223, 2.084)
      ..cubicTo(6.338, 2.007, 6.463, 1.983, 6.598, 2.01)
      ..cubicTo(6.733, 2.037, 6.839, 2.108, 6.916, 2.223)
      ..cubicTo(6.993, 2.338, 7.017, 2.463, 6.99, 2.598)
      ..lineTo(6.51, 5)
      ..lineTo(9.49, 5)
      ..lineTo(10.01, 2.402)
      ..cubicTo(10.037, 2.267, 10.108, 2.161, 10.223, 2.084)
      ..cubicTo(10.338, 2.007, 10.463, 1.983, 10.598, 2.01)
      ..cubicTo(10.736, 2.037, 10.843, 2.108, 10.919, 2.221)
      ..cubicTo(10.994, 2.334, 11.018, 2.46, 10.99, 2.598)
      ..lineTo(10.51, 5)
      ..lineTo(12.5, 5)
      ..cubicTo(12.641, 5, 12.759, 5.048, 12.856, 5.144)
      ..cubicTo(12.952, 5.241, 13, 5.359, 13, 5.5)
      ..cubicTo(13, 5.641, 12.952, 5.759, 12.856, 5.856)
      ..cubicTo(12.759, 5.952, 12.641, 6, 12.5, 6)
      ..lineTo(10.31, 6)
      ..lineTo(9.71, 9)
      ..lineTo(12.5, 9)
      ..cubicTo(12.641, 9, 12.759, 9.048, 12.856, 9.144)
      ..cubicTo(12.952, 9.241, 13, 9.359, 13, 9.5)
      ..cubicTo(13, 9.641, 12.952, 9.759, 12.856, 9.856)
      ..cubicTo(12.759, 9.952, 12.641, 10, 12.5, 10)
      ..lineTo(9.51, 10)
      ..lineTo(8.99, 12.598)
      ..cubicTo(8.963, 12.736, 8.892, 12.843, 8.779, 12.919)
      ..cubicTo(8.666, 12.994, 8.54, 13.018, 8.402, 12.99)
      ..cubicTo(8.264, 12.963, 8.157, 12.892, 8.081, 12.779)
      ..cubicTo(8.006, 12.666, 7.982, 12.54, 8.01, 12.402)
      ..lineTo(8.49, 10)
      ..lineTo(5.51, 10)
      ..lineTo(4.99, 12.598)
      ..cubicTo(4.963, 12.736, 4.892, 12.843, 4.779, 12.919)
      ..cubicTo(4.666, 12.994, 4.54, 13.018, 4.402, 12.99)
      ..cubicTo(4.267, 12.963, 4.161, 12.892, 4.084, 12.777)
      ..cubicTo(4.007, 12.662, 3.983, 12.537, 4.01, 12.402)
      ..lineTo(4.49, 10)
      ..lineTo(2.5, 10)
      ..cubicTo(2.359, 10, 2.241, 9.952, 2.144, 9.856)
      ..close()
      ..moveTo(9.29, 6)
      ..lineTo(6.31, 6)
      ..lineTo(5.71, 9)
      ..lineTo(8.69, 9)
      ..lineTo(9.29, 6)
      ..close();
    canvas.drawPath(p, Paint()..color = color);
  }

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