Gentleface › Layout & interface › icon-set

icon-set icon

Icon set: icon set, icons, icon pack, icon library. Drawn on the 16 px grid. Free SVG, PNG and code, MIT licensed. Part of the free toolbar icon set.

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="M1.458 7.526C1.361 7.368 1.311 7.196 1.309 7.01C1.307 6.849 1.343 6.697 1.415 6.553L4.053 1.276C4.116 1.15 4.212 1.066 4.341 1.023C4.47 0.98 4.598 0.99 4.724 1.053C4.823 1.102 4.898 1.177 4.947 1.276L7.585 6.553C7.657 6.697 7.693 6.849 7.691 7.01C7.689 7.196 7.639 7.368 7.542 7.526C7.444 7.684 7.312 7.805 7.147 7.89C7.004 7.963 6.852 8 6.691 8L2.309 8C2.148 8 1.996 7.963 1.853 7.89C1.688 7.805 1.556 7.684 1.458 7.526ZM14.856 4.144C14.952 4.241 15 4.359 15 4.5C15 4.641 14.952 4.759 14.856 4.856C14.759 4.952 14.641 5 14.5 5L13 5L13 6.5C13 6.641 12.952 6.759 12.856 6.856C12.759 6.952 12.641 7 12.5 7C12.359 7 12.241 6.952 12.144 6.856C12.048 6.759 12 6.641 12 6.5L12 5L10.5 5C10.359 5 10.241 4.952 10.144 4.856C10.048 4.759 10 4.641 10 4.5C10 4.359 10.048 4.241 10.144 4.144C10.241 4.048 10.359 4 10.5 4L12 4L12 2.5C12 2.359 12.048 2.241 12.144 2.144C12.241 2.048 12.359 2 12.5 2C12.641 2 12.759 2.048 12.856 2.144C12.952 2.241 13 2.359 13 2.5L13 4L14.5 4C14.641 4 14.759 4.048 14.856 4.144ZM4.5 2.618L2.309 7L6.691 7L4.5 2.618ZM1.879 9.879C2.172 9.586 2.511 9.363 2.896 9.211C3.25 9.07 3.619 9 4 9C4.381 9 4.75 9.07 5.104 9.211C5.489 9.363 5.828 9.586 6.121 9.879C6.414 10.172 6.637 10.511 6.789 10.896C6.93 11.25 7 11.619 7 12C7 12.381 6.93 12.75 6.789 13.104C6.637 13.489 6.414 13.828 6.121 14.121C5.828 14.414 5.489 14.637 5.104 14.789C4.75 14.93 4.381 15 4 15C3.619 15 3.25 14.93 2.896 14.789C2.511 14.637 2.172 14.414 1.879 14.121C1.586 13.828 1.363 13.489 1.211 13.104C1.07 12.75 1 12.381 1 12C1 11.619 1.07 11.25 1.211 10.896C1.363 10.511 1.586 10.172 1.879 9.879ZM15 10L15 14C15 14.276 14.902 14.512 14.707 14.707C14.512 14.902 14.276 15 14 15L10 15C9.724 15 9.488 14.902 9.293 14.707C9.098 14.512 9 14.276 9 14L9 10C9 9.724 9.098 9.488 9.293 9.293C9.488 9.098 9.724 9 10 9L14 9C14.276 9 14.512 9.098 14.707 9.293C14.902 9.488 15 9.724 15 10ZM2.586 13.414C2.781 13.609 3.007 13.758 3.264 13.86C3.5 13.953 3.746 14 4 14C4.254 14 4.5 13.953 4.736 13.86C4.993 13.758 5.219 13.609 5.414 13.414C5.609 13.219 5.758 12.993 5.86 12.736C5.953 12.5 6 12.254 6 12C6 11.746 5.953 11.5 5.86 11.264C5.758 11.007 5.609 10.781 5.414 10.586C5.219 10.391 4.993 10.242 4.736 10.14C4.5 10.047 4.254 10 4 10C3.746 10 3.5 10.047 3.264 10.14C3.007 10.242 2.781 10.391 2.586 10.586C2.391 10.781 2.242 11.007 2.14 11.264C2.047 11.5 2 11.746 2 12C2 12.254 2.047 12.5 2.14 12.736C2.242 12.993 2.391 13.219 2.586 13.414ZM14 14L14 10L10 10L10 14L14 14Z"/></svg>

React

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

export function IconSetIcon(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="M1.458 7.526C1.361 7.368 1.311 7.196 1.309 7.01C1.307 6.849 1.343 6.697 1.415 6.553L4.053 1.276C4.116 1.15 4.212 1.066 4.341 1.023C4.47 0.98 4.598 0.99 4.724 1.053C4.823 1.102 4.898 1.177 4.947 1.276L7.585 6.553C7.657 6.697 7.693 6.849 7.691 7.01C7.689 7.196 7.639 7.368 7.542 7.526C7.444 7.684 7.312 7.805 7.147 7.89C7.004 7.963 6.852 8 6.691 8L2.309 8C2.148 8 1.996 7.963 1.853 7.89C1.688 7.805 1.556 7.684 1.458 7.526ZM14.856 4.144C14.952 4.241 15 4.359 15 4.5C15 4.641 14.952 4.759 14.856 4.856C14.759 4.952 14.641 5 14.5 5L13 5L13 6.5C13 6.641 12.952 6.759 12.856 6.856C12.759 6.952 12.641 7 12.5 7C12.359 7 12.241 6.952 12.144 6.856C12.048 6.759 12 6.641 12 6.5L12 5L10.5 5C10.359 5 10.241 4.952 10.144 4.856C10.048 4.759 10 4.641 10 4.5C10 4.359 10.048 4.241 10.144 4.144C10.241 4.048 10.359 4 10.5 4L12 4L12 2.5C12 2.359 12.048 2.241 12.144 2.144C12.241 2.048 12.359 2 12.5 2C12.641 2 12.759 2.048 12.856 2.144C12.952 2.241 13 2.359 13 2.5L13 4L14.5 4C14.641 4 14.759 4.048 14.856 4.144ZM4.5 2.618L2.309 7L6.691 7L4.5 2.618ZM1.879 9.879C2.172 9.586 2.511 9.363 2.896 9.211C3.25 9.07 3.619 9 4 9C4.381 9 4.75 9.07 5.104 9.211C5.489 9.363 5.828 9.586 6.121 9.879C6.414 10.172 6.637 10.511 6.789 10.896C6.93 11.25 7 11.619 7 12C7 12.381 6.93 12.75 6.789 13.104C6.637 13.489 6.414 13.828 6.121 14.121C5.828 14.414 5.489 14.637 5.104 14.789C4.75 14.93 4.381 15 4 15C3.619 15 3.25 14.93 2.896 14.789C2.511 14.637 2.172 14.414 1.879 14.121C1.586 13.828 1.363 13.489 1.211 13.104C1.07 12.75 1 12.381 1 12C1 11.619 1.07 11.25 1.211 10.896C1.363 10.511 1.586 10.172 1.879 9.879ZM15 10L15 14C15 14.276 14.902 14.512 14.707 14.707C14.512 14.902 14.276 15 14 15L10 15C9.724 15 9.488 14.902 9.293 14.707C9.098 14.512 9 14.276 9 14L9 10C9 9.724 9.098 9.488 9.293 9.293C9.488 9.098 9.724 9 10 9L14 9C14.276 9 14.512 9.098 14.707 9.293C14.902 9.488 15 9.724 15 10ZM2.586 13.414C2.781 13.609 3.007 13.758 3.264 13.86C3.5 13.953 3.746 14 4 14C4.254 14 4.5 13.953 4.736 13.86C4.993 13.758 5.219 13.609 5.414 13.414C5.609 13.219 5.758 12.993 5.86 12.736C5.953 12.5 6 12.254 6 12C6 11.746 5.953 11.5 5.86 11.264C5.758 11.007 5.609 10.781 5.414 10.586C5.219 10.391 4.993 10.242 4.736 10.14C4.5 10.047 4.254 10 4 10C3.746 10 3.5 10.047 3.264 10.14C3.007 10.242 2.781 10.391 2.586 10.586C2.391 10.781 2.242 11.007 2.14 11.264C2.047 11.5 2 11.746 2 12C2 12.254 2.047 12.5 2.14 12.736C2.242 12.993 2.391 13.219 2.586 13.414ZM14 14L14 10L10 10L10 14L14 14Z" />
    </svg>
  );
}

Vue

Vue: see /icons/icon-set.md

Svelte

Svelte: see /icons/icon-set.md

HTML img

HTML img: see /icons/icon-set.md

CSS

CSS: see /icons/icon-set.md

Data URL

Data URL: see /icons/icon-set.md

Sprite

Sprite: see /icons/icon-set.md

SwiftUI

SwiftUI: see /icons/icon-set.md

Compose

Compose: see /icons/icon-set.md

Android XML

Android XML: see /icons/icon-set.md

Flutter

Flutter: see /icons/icon-set.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

icon set, icons, icon pack, icon library

Tags

icons, icon set, icon pack, icon library, glyphs, symbols, pictograms, shapes, assets, ui kit

Category

Layout & interface

Component name

IconSetIcon

History

2026-10-19 added

More layout & interface icons

accordion apps breadcrumb breadcrumb-chevrons browser button cards carousel-horizontal carousel-vertical checkbox checkbox-indeterminate checkbox-off columns columns-gear command-palette cursor · all layout & interface icons

For agents

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

icon-set icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp

Code line-round

Meaning

More layout & interface icons

For agents

icon-set icon