Gentleface › Tools › tape-measure

tape-measure icon

Tape measure: tape measure, size guide, body measurements, size chart. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

Code line-round

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8.42 3.176C8.741 3.303 9.024 3.488 9.268 3.732C9.512 3.976 9.697 4.259 9.824 4.58C9.941 4.875 10 5.182 10 5.5L10 11L11 11L11 9.5C11 9.359 11.048 9.241 11.144 9.144C11.241 9.048 11.359 9 11.5 9C11.641 9 11.759 9.048 11.856 9.144C11.952 9.241 12 9.359 12 9.5L12 11L13 11L13 9.5C13 9.359 13.048 9.241 13.144 9.144C13.241 9.048 13.359 9 13.5 9C13.641 9 13.759 9.048 13.856 9.144C13.952 9.241 14 9.359 14 9.5L14 11L14.5 11C14.641 11 14.759 11.048 14.856 11.144C14.952 11.241 15 11.359 15 11.5L15 13.5C15 13.641 14.952 13.759 14.856 13.856C14.759 13.952 14.641 14 14.5 14C14.359 14 14.241 13.952 14.144 13.856C14.048 13.759 14 13.641 14 13.5L14 12L3.5 12C3.182 12 2.875 11.941 2.58 11.824C2.259 11.697 1.976 11.512 1.732 11.268C1.488 11.024 1.303 10.741 1.176 10.42C1.059 10.125 1 9.818 1 9.5L1 5.5C1 5.182 1.059 4.875 1.176 4.58C1.303 4.259 1.488 3.976 1.732 3.732C1.976 3.488 2.259 3.303 2.58 3.176C2.875 3.059 3.182 3 3.5 3L7.5 3C7.818 3 8.125 3.059 8.42 3.176ZM9 5.5C9 5.309 8.965 5.125 8.895 4.948C8.818 4.755 8.707 4.586 8.561 4.439C8.414 4.293 8.245 4.182 8.052 4.105C7.875 4.035 7.691 4 7.5 4L3.5 4C3.309 4 3.125 4.035 2.948 4.105C2.755 4.182 2.586 4.293 2.439 4.439C2.293 4.586 2.182 4.755 2.105 4.948C2.035 5.125 2 5.309 2 5.5L2 9.5C2 9.691 2.035 9.875 2.105 10.052C2.182 10.245 2.293 10.414 2.439 10.561C2.586 10.707 2.755 10.818 2.948 10.895C3.125 10.965 3.309 11 3.5 11L9 11L9 5.5ZM3.176 6.58C3.303 6.259 3.488 5.976 3.732 5.732C3.976 5.488 4.259 5.303 4.58 5.176C4.875 5.059 5.182 5 5.5 5C5.818 5 6.125 5.059 6.42 5.176C6.741 5.303 7.024 5.488 7.268 5.732C7.512 5.976 7.697 6.259 7.824 6.58C7.941 6.875 8 7.182 8 7.5C8 7.818 7.941 8.125 7.824 8.42C7.697 8.741 7.512 9.024 7.268 9.268C7.024 9.512 6.741 9.697 6.42 9.824C6.125 9.941 5.818 10 5.5 10C5.182 10 4.875 9.941 4.58 9.824C4.259 9.697 3.976 9.512 3.732 9.268C3.488 9.024 3.303 8.741 3.176 8.42C3.059 8.125 3 7.818 3 7.5C3 7.182 3.059 6.875 3.176 6.58ZM4.105 8.052C4.182 8.245 4.293 8.414 4.439 8.561C4.586 8.707 4.755 8.818 4.948 8.895C5.125 8.965 5.309 9 5.5 9C5.691 9 5.875 8.965 6.052 8.895C6.245 8.818 6.414 8.707 6.561 8.561C6.707 8.414 6.818 8.245 6.895 8.052C6.965 7.875 7 7.691 7 7.5C7 7.309 6.965 7.125 6.895 6.948C6.818 6.755 6.707 6.586 6.561 6.439C6.414 6.293 6.245 6.182 6.052 6.105C5.875 6.035 5.691 6 5.5 6C5.309 6 5.125 6.035 4.948 6.105C4.755 6.182 4.586 6.293 4.439 6.439C4.293 6.586 4.182 6.755 4.105 6.948C4.035 7.125 4 7.309 4 7.5C4 7.691 4.035 7.875 4.105 8.052Z"/></svg>

React

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

export function TapeMeasureIcon(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="M8.42 3.176C8.741 3.303 9.024 3.488 9.268 3.732C9.512 3.976 9.697 4.259 9.824 4.58C9.941 4.875 10 5.182 10 5.5L10 11L11 11L11 9.5C11 9.359 11.048 9.241 11.144 9.144C11.241 9.048 11.359 9 11.5 9C11.641 9 11.759 9.048 11.856 9.144C11.952 9.241 12 9.359 12 9.5L12 11L13 11L13 9.5C13 9.359 13.048 9.241 13.144 9.144C13.241 9.048 13.359 9 13.5 9C13.641 9 13.759 9.048 13.856 9.144C13.952 9.241 14 9.359 14 9.5L14 11L14.5 11C14.641 11 14.759 11.048 14.856 11.144C14.952 11.241 15 11.359 15 11.5L15 13.5C15 13.641 14.952 13.759 14.856 13.856C14.759 13.952 14.641 14 14.5 14C14.359 14 14.241 13.952 14.144 13.856C14.048 13.759 14 13.641 14 13.5L14 12L3.5 12C3.182 12 2.875 11.941 2.58 11.824C2.259 11.697 1.976 11.512 1.732 11.268C1.488 11.024 1.303 10.741 1.176 10.42C1.059 10.125 1 9.818 1 9.5L1 5.5C1 5.182 1.059 4.875 1.176 4.58C1.303 4.259 1.488 3.976 1.732 3.732C1.976 3.488 2.259 3.303 2.58 3.176C2.875 3.059 3.182 3 3.5 3L7.5 3C7.818 3 8.125 3.059 8.42 3.176ZM9 5.5C9 5.309 8.965 5.125 8.895 4.948C8.818 4.755 8.707 4.586 8.561 4.439C8.414 4.293 8.245 4.182 8.052 4.105C7.875 4.035 7.691 4 7.5 4L3.5 4C3.309 4 3.125 4.035 2.948 4.105C2.755 4.182 2.586 4.293 2.439 4.439C2.293 4.586 2.182 4.755 2.105 4.948C2.035 5.125 2 5.309 2 5.5L2 9.5C2 9.691 2.035 9.875 2.105 10.052C2.182 10.245 2.293 10.414 2.439 10.561C2.586 10.707 2.755 10.818 2.948 10.895C3.125 10.965 3.309 11 3.5 11L9 11L9 5.5ZM3.176 6.58C3.303 6.259 3.488 5.976 3.732 5.732C3.976 5.488 4.259 5.303 4.58 5.176C4.875 5.059 5.182 5 5.5 5C5.818 5 6.125 5.059 6.42 5.176C6.741 5.303 7.024 5.488 7.268 5.732C7.512 5.976 7.697 6.259 7.824 6.58C7.941 6.875 8 7.182 8 7.5C8 7.818 7.941 8.125 7.824 8.42C7.697 8.741 7.512 9.024 7.268 9.268C7.024 9.512 6.741 9.697 6.42 9.824C6.125 9.941 5.818 10 5.5 10C5.182 10 4.875 9.941 4.58 9.824C4.259 9.697 3.976 9.512 3.732 9.268C3.488 9.024 3.303 8.741 3.176 8.42C3.059 8.125 3 7.818 3 7.5C3 7.182 3.059 6.875 3.176 6.58ZM4.105 8.052C4.182 8.245 4.293 8.414 4.439 8.561C4.586 8.707 4.755 8.818 4.948 8.895C5.125 8.965 5.309 9 5.5 9C5.691 9 5.875 8.965 6.052 8.895C6.245 8.818 6.414 8.707 6.561 8.561C6.707 8.414 6.818 8.245 6.895 8.052C6.965 7.875 7 7.691 7 7.5C7 7.309 6.965 7.125 6.895 6.948C6.818 6.755 6.707 6.586 6.561 6.439C6.414 6.293 6.245 6.182 6.052 6.105C5.875 6.035 5.691 6 5.5 6C5.309 6 5.125 6.035 4.948 6.105C4.755 6.182 4.586 6.293 4.439 6.439C4.293 6.586 4.182 6.755 4.105 6.948C4.035 7.125 4 7.309 4 7.5C4 7.691 4.035 7.875 4.105 8.052Z" />
    </svg>
  );
}

Vue

Vue: see /icons/tape-measure.md

Svelte

Svelte: see /icons/tape-measure.md

HTML img

HTML img: see /icons/tape-measure.md

CSS

CSS: see /icons/tape-measure.md

Data URL

Data URL: see /icons/tape-measure.md

Sprite

Sprite: see /icons/tape-measure.md

SwiftUI

SwiftUI: see /icons/tape-measure.md

Compose

Compose: see /icons/tape-measure.md

Android XML

Android XML: see /icons/tape-measure.md

Flutter

Flutter: see /icons/tape-measure.md

Each SVG is 16 × 16 with fill="currentColor". Keep it at 16 px or an exact multiple (32, 48) on whole pixels: a fractional size or position blurs it. The snippets are decorative (aria-hidden). For an icon that carries meaning on its own, such as an icon-only button, label the button, or give the SVG role="img" and an aria-label. More in how to use.

Meaning

Use it for

tape measure, size guide, body measurements, size chart, sizing

Alternatives

ruler: measure in a design or a document (ruler owns measure)

Also fits

measure: clothing size guides and measuring on site

Tags

tape-measure, size-guide, body-measurements

Category

Tools

Component name

TapeMeasureIcon

History

2026-10-30 added

More tools icons

anvil axe construction crane drill hammer hard-hat ladder pickaxe scissors screwdriver shovel spirit-level toolbox tools tools-upright · all tools icons

For agents

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

tape-measure icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp

Code line-round

Meaning

More tools icons

For agents

tape-measure icon