puzzle piece icon
puzzle-piece-16-solid from HeroIcons by Refactoring UI Inc · Solid 16x16 · MIT Free for personal and commercial use.
- Name
- puzzle-piece-16-solid
- Set
- HeroIcons
- Style
- Solid 16x16
- Viewbox
- 16×16
- License
- MIT
3 other variants in HeroIcons
The same icon in other sets
puzzle-pieceFont Awesome 6 Solidpuzzle-pieceFont Awesome Solidpuzzle-piece-12-filledFluent UI System Iconspuzzle-piece-16Fluent UI System Color Iconspuzzle-pieceFluent Emojipuzzle-pieceFluent Emoji Flatpuzzle-pieceFluent Emoji High Contrastpuzzle-pieceLine Awesomepuzzle-pieceNoto Emojipuzzle-pieceOpenMojipuzzle-piecePhosphorpuzzle-pieceTwitter Emojipuzzle-pieceUnicons
Use the puzzle piece icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M9 3.889c0-.273.188-.502.417-.65c.355-.229.583-.587.583-.989C10 1.56 9.328 1 8.5 1S7 1.56 7 2.25c0 .41.237.774.603 1.002c.22.137.397.355.397.613a.577.577 0 0 1-.605.579q-1.116-.06-2.214-.18a.75.75 0 0 0-.83.81q.1 1.146.133 2.312A.6.6 0 0 1 3.882 8c-.268 0-.495-.185-.64-.412C3.015 7.231 2.655 7 2.25 7C1.56 7 1 7.672 1 8.5S1.56 10 2.25 10c.404 0 .764-.23.993-.588c.144-.227.37-.412.64-.412a.6.6 0 0 1 .601.614a39 39 0 0 1-.231 3.3a.75.75 0 0 0 .661.829q1.24.14 2.5.204A.56.56 0 0 0 8 13.386c0-.271-.187-.499-.415-.645C7.23 12.512 7 12.153 7 11.75c0-.69.672-1.25 1.5-1.25s1.5.56 1.5 1.25c0 .403-.23.762-.585.99c-.228.147-.415.375-.415.646v.11c0 .278.223.504.5.504q1.795 0 3.552-.154a.75.75 0 0 0 .68-.661q.203-1.767.253-3.574a.597.597 0 0 0-.6-.611c-.27 0-.498.187-.644.415c-.229.356-.588.585-.991.585c-.69 0-1.25-.672-1.25-1.5S11.06 7 11.75 7c.403 0 .762.23.99.585c.147.228.375.415.646.415a.597.597 0 0 0 .599-.61a41 41 0 0 0-.132-2.365a.75.75 0 0 0-.815-.684A40 40 0 0 1 9.5 4.5a.5.5 0 0 1-.5-.503z"/></svg>
React
import type { SVGProps } from "react";
export function HeroiconsPuzzlePiece16Solid(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M9 3.889c0-.273.188-.502.417-.65c.355-.229.583-.587.583-.989C10 1.56 9.328 1 8.5 1S7 1.56 7 2.25c0 .41.237.774.603 1.002c.22.137.397.355.397.613a.577.577 0 0 1-.605.579q-1.116-.06-2.214-.18a.75.75 0 0 0-.83.81q.1 1.146.133 2.312A.6.6 0 0 1 3.882 8c-.268 0-.495-.185-.64-.412C3.015 7.231 2.655 7 2.25 7C1.56 7 1 7.672 1 8.5S1.56 10 2.25 10c.404 0 .764-.23.993-.588c.144-.227.37-.412.64-.412a.6.6 0 0 1 .601.614a39 39 0 0 1-.231 3.3a.75.75 0 0 0 .661.829q1.24.14 2.5.204A.56.56 0 0 0 8 13.386c0-.271-.187-.499-.415-.645C7.23 12.512 7 12.153 7 11.75c0-.69.672-1.25 1.5-1.25s1.5.56 1.5 1.25c0 .403-.23.762-.585.99c-.228.147-.415.375-.415.646v.11c0 .278.223.504.5.504q1.795 0 3.552-.154a.75.75 0 0 0 .68-.661q.203-1.767.253-3.574a.597.597 0 0 0-.6-.611c-.27 0-.498.187-.644.415c-.229.356-.588.585-.991.585c-.69 0-1.25-.672-1.25-1.5S11.06 7 11.75 7c.403 0 .762.23.99.585c.147.228.375.415.646.415a.597.597 0 0 0 .599-.61a41 41 0 0 0-.132-2.365a.75.75 0 0 0-.815-.684A40 40 0 0 1 9.5 4.5a.5.5 0 0 1-.5-.503z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M9 3.889c0-.273.188-.502.417-.65c.355-.229.583-.587.583-.989C10 1.56 9.328 1 8.5 1S7 1.56 7 2.25c0 .41.237.774.603 1.002c.22.137.397.355.397.613a.577.577 0 0 1-.605.579q-1.116-.06-2.214-.18a.75.75 0 0 0-.83.81q.1 1.146.133 2.312A.6.6 0 0 1 3.882 8c-.268 0-.495-.185-.64-.412C3.015 7.231 2.655 7 2.25 7C1.56 7 1 7.672 1 8.5S1.56 10 2.25 10c.404 0 .764-.23.993-.588c.144-.227.37-.412.64-.412a.6.6 0 0 1 .601.614a39 39 0 0 1-.231 3.3a.75.75 0 0 0 .661.829q1.24.14 2.5.204A.56.56 0 0 0 8 13.386c0-.271-.187-.499-.415-.645C7.23 12.512 7 12.153 7 11.75c0-.69.672-1.25 1.5-1.25s1.5.56 1.5 1.25c0 .403-.23.762-.585.99c-.228.147-.415.375-.415.646v.11c0 .278.223.504.5.504q1.795 0 3.552-.154a.75.75 0 0 0 .68-.661q.203-1.767.253-3.574a.597.597 0 0 0-.6-.611c-.27 0-.498.187-.644.415c-.229.356-.588.585-.991.585c-.69 0-1.25-.672-1.25-1.5S11.06 7 11.75 7c.403 0 .762.23.99.585c.147.228.375.415.646.415a.597.597 0 0 0 .599-.61a41 41 0 0 0-.132-2.365a.75.75 0 0 0-.815-.684A40 40 0 0 1 9.5 4.5a.5.5 0 0 1-.5-.503z"/></svg> </template>
CSS
.icon-puzzle-piece-16-solid {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M9%203.889c0-.273.188-.502.417-.65c.355-.229.583-.587.583-.989C10%201.56%209.328%201%208.5%201S7%201.56%207%202.25c0%20.41.237.774.603%201.002c.22.137.397.355.397.613a.577.577%200%200%201-.605.579q-1.116-.06-2.214-.18a.75.75%200%200%200-.83.81q.1%201.146.133%202.312A.6.6%200%200%201%203.882%208c-.268%200-.495-.185-.64-.412C3.015%207.231%202.655%207%202.25%207C1.56%207%201%207.672%201%208.5S1.56%2010%202.25%2010c.404%200%20.764-.23.993-.588c.144-.227.37-.412.64-.412a.6.6%200%200%201%20.601.614a39%2039%200%200%201-.231%203.3a.75.75%200%200%200%20.661.829q1.24.14%202.5.204A.56.56%200%200%200%208%2013.386c0-.271-.187-.499-.415-.645C7.23%2012.512%207%2012.153%207%2011.75c0-.69.672-1.25%201.5-1.25s1.5.56%201.5%201.25c0%20.403-.23.762-.585.99c-.228.147-.415.375-.415.646v.11c0%20.278.223.504.5.504q1.795%200%203.552-.154a.75.75%200%200%200%20.68-.661q.203-1.767.253-3.574a.597.597%200%200%200-.6-.611c-.27%200-.498.187-.644.415c-.229.356-.588.585-.991.585c-.69%200-1.25-.672-1.25-1.5S11.06%207%2011.75%207c.403%200%20.762.23.99.585c.147.228.375.415.646.415a.597.597%200%200%200%20.599-.61a41%2041%200%200%200-.132-2.365a.75.75%200%200%200-.815-.684A40%2040%200%200%201%209.5%204.5a.5.5%200%200%201-.5-.503z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M9%203.889c0-.273.188-.502.417-.65c.355-.229.583-.587.583-.989C10%201.56%209.328%201%208.5%201S7%201.56%207%202.25c0%20.41.237.774.603%201.002c.22.137.397.355.397.613a.577.577%200%200%201-.605.579q-1.116-.06-2.214-.18a.75.75%200%200%200-.83.81q.1%201.146.133%202.312A.6.6%200%200%201%203.882%208c-.268%200-.495-.185-.64-.412C3.015%207.231%202.655%207%202.25%207C1.56%207%201%207.672%201%208.5S1.56%2010%202.25%2010c.404%200%20.764-.23.993-.588c.144-.227.37-.412.64-.412a.6.6%200%200%201%20.601.614a39%2039%200%200%201-.231%203.3a.75.75%200%200%200%20.661.829q1.24.14%202.5.204A.56.56%200%200%200%208%2013.386c0-.271-.187-.499-.415-.645C7.23%2012.512%207%2012.153%207%2011.75c0-.69.672-1.25%201.5-1.25s1.5.56%201.5%201.25c0%20.403-.23.762-.585.99c-.228.147-.415.375-.415.646v.11c0%20.278.223.504.5.504q1.795%200%203.552-.154a.75.75%200%200%200%20.68-.661q.203-1.767.253-3.574a.597.597%200%200%200-.6-.611c-.27%200-.498.187-.644.415c-.229.356-.588.585-.991.585c-.69%200-1.25-.672-1.25-1.5S11.06%207%2011.75%207c.403%200%20.762.23.99.585c.147.228.375.415.646.415a.597.597%200%200%200%20.599-.61a41%2041%200%200%200-.132-2.365a.75.75%200%200%200-.815-.684A40%2040%200%200%201%209.5%204.5a.5.5%200%200%201-.5-.503z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/heroicons/puzzle-piece-16-solid.svg?color=%231a73e8&size=48
