Gentleface › Games & sports › meeple

meeple icon

Meeple: board game, tabletop game, game piece, board games. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed.

Animated meeple-hop · line-round

The meeple tips back and hops one space to the right, leaning into the jump, and lands with a little rock. It hops back to its place the same way and stands still.

Download SVG

Native SVG animation, with no CSS or script. It loops by itself. Inline it to take the text color: in an <img> it draws black. To play it once on hover or click, run 0.3 s to 1.9 s. Examples and helper.

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="M6.471 13.945C6.251 14.275 5.967 14.533 5.618 14.72C5.268 14.907 4.896 15 4.5 15L2.5 15C2.359 15 2.241 14.952 2.144 14.856C2.048 14.759 2 14.641 2 14.5C2 13.982 2.12 13.465 2.359 12.947C2.45 12.748 2.566 12.535 2.706 12.305C2.788 12.172 2.914 11.978 3.084 11.723C3.247 11.478 3.366 11.295 3.441 11.173C3.561 10.976 3.658 10.797 3.734 10.634C3.832 10.421 3.903 10.209 3.947 10L2.5 10C2.309 10 2.125 9.965 1.948 9.895C1.755 9.818 1.586 9.707 1.439 9.561C1.293 9.414 1.182 9.245 1.105 9.052C1.035 8.875 1 8.691 1 8.5C1 8.309 1.035 8.125 1.105 7.948C1.182 7.755 1.293 7.586 1.439 7.439C1.586 7.293 1.755 7.182 1.948 7.105C2.125 7.035 2.309 7 2.5 7L4.5 7C4.662 7 4.809 6.963 4.943 6.89C5.066 6.822 5.16 6.733 5.224 6.623C5.287 6.516 5.313 6.4 5.303 6.276C5.29 6.121 5.222 5.963 5.1 5.8C4.884 5.512 4.725 5.196 4.623 4.851C4.513 4.48 4.477 4.102 4.513 3.717C4.55 3.332 4.657 2.967 4.834 2.624C4.999 2.304 5.215 2.023 5.481 1.781C5.748 1.539 6.048 1.35 6.382 1.216C6.74 1.072 7.113 1 7.5 1C7.887 1 8.26 1.072 8.618 1.216C8.952 1.35 9.252 1.539 9.519 1.781C9.785 2.023 10.001 2.304 10.166 2.624C10.343 2.967 10.45 3.332 10.487 3.717C10.523 4.102 10.487 4.48 10.377 4.851C10.275 5.196 10.116 5.512 9.9 5.8C9.778 5.963 9.71 6.121 9.697 6.276C9.687 6.4 9.713 6.516 9.776 6.623C9.84 6.733 9.934 6.822 10.057 6.89C10.191 6.963 10.338 7 10.5 7L12.5 7C12.691 7 12.875 7.035 13.052 7.105C13.245 7.182 13.414 7.293 13.561 7.439C13.707 7.586 13.818 7.755 13.895 7.948C13.965 8.125 14 8.309 14 8.5C14 8.691 13.965 8.875 13.895 9.052C13.818 9.245 13.707 9.414 13.561 9.561C13.414 9.707 13.245 9.818 13.052 9.895C12.875 9.965 12.691 10 12.5 10L11.053 10C11.097 10.209 11.168 10.421 11.266 10.634C11.342 10.797 11.439 10.976 11.559 11.173C11.634 11.295 11.753 11.478 11.916 11.723C12.086 11.978 12.212 12.172 12.294 12.305C12.434 12.535 12.55 12.748 12.641 12.947C12.88 13.465 13 13.982 13 14.5C13 14.641 12.952 14.759 12.856 14.856C12.759 14.952 12.641 15 12.5 15L10.5 15C10.104 15 9.732 14.907 9.382 14.72C9.033 14.533 8.749 14.275 8.529 13.945L7.5 12.401L6.471 13.945ZM11.734 13.366C11.658 13.203 11.561 13.024 11.441 12.827C11.366 12.705 11.247 12.522 11.084 12.277C10.914 12.022 10.788 11.828 10.706 11.695C10.566 11.465 10.45 11.252 10.359 11.053C10.12 10.535 10 10.018 10 9.5C10 9.359 10.048 9.241 10.144 9.144C10.241 9.048 10.359 9 10.5 9L12.5 9C12.638 9 12.756 8.951 12.854 8.854C12.951 8.756 13 8.638 13 8.5C13 8.362 12.951 8.244 12.854 8.146C12.756 8.049 12.638 8 12.5 8L10.5 8C10.167 8 9.859 7.922 9.576 7.766C9.29 7.61 9.069 7.397 8.912 7.127C8.743 6.838 8.673 6.527 8.701 6.193C8.73 5.847 8.863 5.516 9.1 5.2C9.244 5.008 9.35 4.797 9.418 4.567C9.491 4.32 9.515 4.068 9.491 3.811C9.467 3.554 9.395 3.311 9.277 3.082C9.167 2.869 9.023 2.682 8.846 2.521C8.668 2.359 8.468 2.234 8.246 2.144C8.006 2.048 7.758 2 7.5 2C7.242 2 6.994 2.048 6.754 2.144C6.532 2.234 6.332 2.359 6.154 2.521C5.977 2.682 5.833 2.869 5.723 3.082C5.605 3.311 5.533 3.554 5.509 3.811C5.485 4.068 5.509 4.32 5.582 4.567C5.65 4.797 5.756 5.008 5.9 5.2C6.137 5.516 6.27 5.847 6.299 6.193C6.327 6.527 6.257 6.838 6.088 7.127C5.931 7.397 5.71 7.61 5.424 7.766C5.141 7.922 4.833 8 4.5 8L2.5 8C2.362 8 2.244 8.049 2.146 8.146C2.049 8.244 2 8.362 2 8.5C2 8.638 2.049 8.756 2.146 8.854C2.244 8.951 2.362 9 2.5 9L4.5 9C4.641 9 4.759 9.048 4.856 9.144C4.952 9.241 5 9.359 5 9.5C5 10.018 4.88 10.535 4.641 11.053C4.55 11.252 4.434 11.465 4.294 11.695C4.212 11.828 4.086 12.022 3.916 12.277C3.753 12.522 3.634 12.705 3.559 12.827C3.439 13.024 3.342 13.203 3.266 13.366C3.168 13.579 3.097 13.791 3.053 14L4.5 14C4.729 14 4.944 13.946 5.146 13.838C5.347 13.73 5.512 13.581 5.639 13.391L6.668 11.847C6.755 11.717 6.865 11.613 7.001 11.535C7.155 11.446 7.322 11.401 7.5 11.401C7.678 11.401 7.845 11.446 7.999 11.535C8.135 11.613 8.245 11.717 8.332 11.847L9.361 13.391C9.488 13.581 9.653 13.73 9.854 13.838C10.056 13.946 10.271 14 10.5 14L11.947 14C11.903 13.791 11.832 13.579 11.734 13.366Z"/></svg>

React

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

export function MeepleIcon(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="M6.471 13.945C6.251 14.275 5.967 14.533 5.618 14.72C5.268 14.907 4.896 15 4.5 15L2.5 15C2.359 15 2.241 14.952 2.144 14.856C2.048 14.759 2 14.641 2 14.5C2 13.982 2.12 13.465 2.359 12.947C2.45 12.748 2.566 12.535 2.706 12.305C2.788 12.172 2.914 11.978 3.084 11.723C3.247 11.478 3.366 11.295 3.441 11.173C3.561 10.976 3.658 10.797 3.734 10.634C3.832 10.421 3.903 10.209 3.947 10L2.5 10C2.309 10 2.125 9.965 1.948 9.895C1.755 9.818 1.586 9.707 1.439 9.561C1.293 9.414 1.182 9.245 1.105 9.052C1.035 8.875 1 8.691 1 8.5C1 8.309 1.035 8.125 1.105 7.948C1.182 7.755 1.293 7.586 1.439 7.439C1.586 7.293 1.755 7.182 1.948 7.105C2.125 7.035 2.309 7 2.5 7L4.5 7C4.662 7 4.809 6.963 4.943 6.89C5.066 6.822 5.16 6.733 5.224 6.623C5.287 6.516 5.313 6.4 5.303 6.276C5.29 6.121 5.222 5.963 5.1 5.8C4.884 5.512 4.725 5.196 4.623 4.851C4.513 4.48 4.477 4.102 4.513 3.717C4.55 3.332 4.657 2.967 4.834 2.624C4.999 2.304 5.215 2.023 5.481 1.781C5.748 1.539 6.048 1.35 6.382 1.216C6.74 1.072 7.113 1 7.5 1C7.887 1 8.26 1.072 8.618 1.216C8.952 1.35 9.252 1.539 9.519 1.781C9.785 2.023 10.001 2.304 10.166 2.624C10.343 2.967 10.45 3.332 10.487 3.717C10.523 4.102 10.487 4.48 10.377 4.851C10.275 5.196 10.116 5.512 9.9 5.8C9.778 5.963 9.71 6.121 9.697 6.276C9.687 6.4 9.713 6.516 9.776 6.623C9.84 6.733 9.934 6.822 10.057 6.89C10.191 6.963 10.338 7 10.5 7L12.5 7C12.691 7 12.875 7.035 13.052 7.105C13.245 7.182 13.414 7.293 13.561 7.439C13.707 7.586 13.818 7.755 13.895 7.948C13.965 8.125 14 8.309 14 8.5C14 8.691 13.965 8.875 13.895 9.052C13.818 9.245 13.707 9.414 13.561 9.561C13.414 9.707 13.245 9.818 13.052 9.895C12.875 9.965 12.691 10 12.5 10L11.053 10C11.097 10.209 11.168 10.421 11.266 10.634C11.342 10.797 11.439 10.976 11.559 11.173C11.634 11.295 11.753 11.478 11.916 11.723C12.086 11.978 12.212 12.172 12.294 12.305C12.434 12.535 12.55 12.748 12.641 12.947C12.88 13.465 13 13.982 13 14.5C13 14.641 12.952 14.759 12.856 14.856C12.759 14.952 12.641 15 12.5 15L10.5 15C10.104 15 9.732 14.907 9.382 14.72C9.033 14.533 8.749 14.275 8.529 13.945L7.5 12.401L6.471 13.945ZM11.734 13.366C11.658 13.203 11.561 13.024 11.441 12.827C11.366 12.705 11.247 12.522 11.084 12.277C10.914 12.022 10.788 11.828 10.706 11.695C10.566 11.465 10.45 11.252 10.359 11.053C10.12 10.535 10 10.018 10 9.5C10 9.359 10.048 9.241 10.144 9.144C10.241 9.048 10.359 9 10.5 9L12.5 9C12.638 9 12.756 8.951 12.854 8.854C12.951 8.756 13 8.638 13 8.5C13 8.362 12.951 8.244 12.854 8.146C12.756 8.049 12.638 8 12.5 8L10.5 8C10.167 8 9.859 7.922 9.576 7.766C9.29 7.61 9.069 7.397 8.912 7.127C8.743 6.838 8.673 6.527 8.701 6.193C8.73 5.847 8.863 5.516 9.1 5.2C9.244 5.008 9.35 4.797 9.418 4.567C9.491 4.32 9.515 4.068 9.491 3.811C9.467 3.554 9.395 3.311 9.277 3.082C9.167 2.869 9.023 2.682 8.846 2.521C8.668 2.359 8.468 2.234 8.246 2.144C8.006 2.048 7.758 2 7.5 2C7.242 2 6.994 2.048 6.754 2.144C6.532 2.234 6.332 2.359 6.154 2.521C5.977 2.682 5.833 2.869 5.723 3.082C5.605 3.311 5.533 3.554 5.509 3.811C5.485 4.068 5.509 4.32 5.582 4.567C5.65 4.797 5.756 5.008 5.9 5.2C6.137 5.516 6.27 5.847 6.299 6.193C6.327 6.527 6.257 6.838 6.088 7.127C5.931 7.397 5.71 7.61 5.424 7.766C5.141 7.922 4.833 8 4.5 8L2.5 8C2.362 8 2.244 8.049 2.146 8.146C2.049 8.244 2 8.362 2 8.5C2 8.638 2.049 8.756 2.146 8.854C2.244 8.951 2.362 9 2.5 9L4.5 9C4.641 9 4.759 9.048 4.856 9.144C4.952 9.241 5 9.359 5 9.5C5 10.018 4.88 10.535 4.641 11.053C4.55 11.252 4.434 11.465 4.294 11.695C4.212 11.828 4.086 12.022 3.916 12.277C3.753 12.522 3.634 12.705 3.559 12.827C3.439 13.024 3.342 13.203 3.266 13.366C3.168 13.579 3.097 13.791 3.053 14L4.5 14C4.729 14 4.944 13.946 5.146 13.838C5.347 13.73 5.512 13.581 5.639 13.391L6.668 11.847C6.755 11.717 6.865 11.613 7.001 11.535C7.155 11.446 7.322 11.401 7.5 11.401C7.678 11.401 7.845 11.446 7.999 11.535C8.135 11.613 8.245 11.717 8.332 11.847L9.361 13.391C9.488 13.581 9.653 13.73 9.854 13.838C10.056 13.946 10.271 14 10.5 14L11.947 14C11.903 13.791 11.832 13.579 11.734 13.366Z" />
    </svg>
  );
}

Vue

Vue: see /icons/meeple.md

Svelte

Svelte: see /icons/meeple.md

HTML img

HTML img: see /icons/meeple.md

CSS

CSS: see /icons/meeple.md

Data URL

Data URL: see /icons/meeple.md

Sprite

Sprite: see /icons/meeple.md

SwiftUI

SwiftUI: see /icons/meeple.md

Compose

Compose: see /icons/meeple.md

Android XML

Android XML: see /icons/meeple.md

Flutter

Flutter: see /icons/meeple.md

Each icon is drawn on the 16 px grid, and most also on the 20 and 24 px grids (at 24 in three weights: light 1 px, regular 1.5 px, bold 2 px). Show the drawing made for your size, or an exact multiple of it, on whole pixels: 16 for 16 and 32 px, 20 for 20 and 40, 24 for 24 and 48. A size in between or a fractional position blurs it. The code on each icon page is the 16 px drawing, an SVG with fill="currentColor"; the icon page's downloads follow its Grid switch, and npm has the 20 and 24 px drawings too. 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.

With npm: import { MeepleIcon } from '@gentleface/react'; (setup).

Meaning

Use it for

board game, tabletop game, game piece, board games, tabletop

Alternatives

dice: dice or chance
chess-knight: chess
playing-cards: card games

Also fits

chess: board games in general
dice: board games in general

Tags

meeple, board-game, tabletop-game, game-piece, tabletop, token, pawn, carcassonne, game-night, game

Category

Games & sports

Component name

MeepleIcon

History

2026-11-06 20 px drawn, 24 px drawn, added, released in 0.4.0

Since

version 0.4.0

More games & sports icons

alien american-football badminton barbell baseball baseball-bat basketball basketball-court billiards bomb bow-arrow bowling boxing-glove chess-bishop chess-king chess-knight · all games & sports icons

For agents

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

meeple icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp