Gentleface › People & accounts › user-ribbon

user-ribbon icon

User ribbon: certified user, user award. 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="M4.732 2.732C4.976 2.488 5.259 2.303 5.58 2.176C5.875 2.059 6.182 2 6.5 2C6.818 2 7.125 2.059 7.42 2.176C7.741 2.303 8.024 2.488 8.268 2.732C8.512 2.976 8.697 3.259 8.824 3.58C8.941 3.875 9 4.182 9 4.5C9 4.818 8.941 5.125 8.824 5.42C8.697 5.741 8.512 6.024 8.268 6.268C8.024 6.512 7.741 6.697 7.42 6.824C7.125 6.941 6.818 7 6.5 7C6.182 7 5.875 6.941 5.58 6.824C5.259 6.697 4.976 6.512 4.732 6.268C4.488 6.024 4.303 5.741 4.176 5.42C4.059 5.125 4 4.818 4 4.5C4 4.182 4.059 3.875 4.176 3.58C4.303 3.259 4.488 2.976 4.732 2.732ZM5.439 5.561C5.586 5.707 5.755 5.818 5.948 5.895C6.125 5.965 6.309 6 6.5 6C6.691 6 6.875 5.965 7.052 5.895C7.245 5.818 7.414 5.707 7.561 5.561C7.707 5.414 7.818 5.245 7.895 5.052C7.965 4.875 8 4.691 8 4.5C8 4.309 7.965 4.125 7.895 3.948C7.818 3.755 7.707 3.586 7.561 3.439C7.414 3.293 7.245 3.182 7.052 3.105C6.875 3.035 6.691 3 6.5 3C6.309 3 6.125 3.035 5.948 3.105C5.755 3.182 5.586 3.293 5.439 3.439C5.293 3.586 5.182 3.755 5.105 3.948C5.035 4.125 5 4.309 5 4.5C5 4.691 5.035 4.875 5.105 5.052C5.182 5.245 5.293 5.414 5.439 5.561ZM13.599 14.493C13.465 14.52 13.34 14.494 13.223 14.416L12 13.601L10.777 14.416C10.693 14.472 10.601 14.5 10.5 14.5C10.359 14.5 10.241 14.452 10.144 14.356C10.048 14.259 10 14.141 10 14L10 11.236C9.959 11.199 9.918 11.161 9.879 11.121C9.586 10.828 9.363 10.489 9.211 10.104C9.07 9.75 9 9.381 9 9C9 8.619 9.07 8.25 9.211 7.896C9.363 7.511 9.586 7.172 9.879 6.879C10.172 6.586 10.511 6.363 10.896 6.211C11.25 6.07 11.619 6 12 6C12.381 6 12.75 6.07 13.104 6.211C13.489 6.363 13.828 6.586 14.121 6.879C14.414 7.172 14.637 7.511 14.789 7.896C14.93 8.25 15 8.619 15 9C15 9.381 14.93 9.75 14.789 10.104C14.637 10.489 14.414 10.828 14.121 11.121C14.082 11.161 14.041 11.199 14 11.236L14 14C14 14.101 13.972 14.193 13.916 14.277C13.838 14.395 13.732 14.467 13.599 14.493ZM10.586 10.414C10.781 10.609 11.007 10.758 11.264 10.86C11.5 10.953 11.746 11 12 11C12.254 11 12.5 10.953 12.736 10.86C12.993 10.758 13.219 10.609 13.414 10.414C13.609 10.219 13.758 9.993 13.86 9.736C13.953 9.5 14 9.254 14 9C14 8.746 13.953 8.5 13.86 8.264C13.758 8.007 13.609 7.781 13.414 7.586C13.219 7.391 12.993 7.242 12.736 7.14C12.5 7.047 12.254 7 12 7C11.746 7 11.5 7.047 11.264 7.14C11.007 7.242 10.781 7.391 10.586 7.586C10.391 7.781 10.242 8.007 10.14 8.264C10.047 8.5 10 8.746 10 9C10 9.254 10.047 9.5 10.14 9.736C10.242 9.993 10.391 10.219 10.586 10.414ZM8.08 9.799C8.04 9.931 7.962 10.029 7.845 10.094C7.726 10.16 7.599 10.174 7.463 10.135C7.149 10.045 6.827 10 6.5 10C6.055 10 5.625 10.082 5.212 10.246C4.762 10.424 4.367 10.683 4.025 11.025C3.683 11.367 3.424 11.762 3.246 12.212C3.082 12.625 3 13.055 3 13.5L3 14.5C3 14.641 2.952 14.759 2.856 14.856C2.759 14.952 2.641 15 2.5 15C2.359 15 2.241 14.952 2.144 14.856C2.048 14.759 2 14.641 2 14.5L2 13.5C2 12.928 2.105 12.376 2.316 11.844C2.545 11.266 2.879 10.757 3.318 10.318C3.757 9.879 4.266 9.545 4.844 9.316C5.376 9.105 5.928 9 6.5 9C6.921 9 7.334 9.058 7.739 9.174C7.858 9.208 7.951 9.276 8.017 9.377C8.031 9.519 8.052 9.66 8.08 9.799ZM12 12.499C12.1 12.499 12.193 12.527 12.277 12.584L13 13.066L13 11.828C12.678 11.943 12.344 12 12 12C11.656 12 11.322 11.943 11 11.828L11 13.066L11.723 12.584C11.807 12.527 11.9 12.499 12 12.499Z"/></svg>

React

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

export function UserRibbonIcon(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="M4.732 2.732C4.976 2.488 5.259 2.303 5.58 2.176C5.875 2.059 6.182 2 6.5 2C6.818 2 7.125 2.059 7.42 2.176C7.741 2.303 8.024 2.488 8.268 2.732C8.512 2.976 8.697 3.259 8.824 3.58C8.941 3.875 9 4.182 9 4.5C9 4.818 8.941 5.125 8.824 5.42C8.697 5.741 8.512 6.024 8.268 6.268C8.024 6.512 7.741 6.697 7.42 6.824C7.125 6.941 6.818 7 6.5 7C6.182 7 5.875 6.941 5.58 6.824C5.259 6.697 4.976 6.512 4.732 6.268C4.488 6.024 4.303 5.741 4.176 5.42C4.059 5.125 4 4.818 4 4.5C4 4.182 4.059 3.875 4.176 3.58C4.303 3.259 4.488 2.976 4.732 2.732ZM5.439 5.561C5.586 5.707 5.755 5.818 5.948 5.895C6.125 5.965 6.309 6 6.5 6C6.691 6 6.875 5.965 7.052 5.895C7.245 5.818 7.414 5.707 7.561 5.561C7.707 5.414 7.818 5.245 7.895 5.052C7.965 4.875 8 4.691 8 4.5C8 4.309 7.965 4.125 7.895 3.948C7.818 3.755 7.707 3.586 7.561 3.439C7.414 3.293 7.245 3.182 7.052 3.105C6.875 3.035 6.691 3 6.5 3C6.309 3 6.125 3.035 5.948 3.105C5.755 3.182 5.586 3.293 5.439 3.439C5.293 3.586 5.182 3.755 5.105 3.948C5.035 4.125 5 4.309 5 4.5C5 4.691 5.035 4.875 5.105 5.052C5.182 5.245 5.293 5.414 5.439 5.561ZM13.599 14.493C13.465 14.52 13.34 14.494 13.223 14.416L12 13.601L10.777 14.416C10.693 14.472 10.601 14.5 10.5 14.5C10.359 14.5 10.241 14.452 10.144 14.356C10.048 14.259 10 14.141 10 14L10 11.236C9.959 11.199 9.918 11.161 9.879 11.121C9.586 10.828 9.363 10.489 9.211 10.104C9.07 9.75 9 9.381 9 9C9 8.619 9.07 8.25 9.211 7.896C9.363 7.511 9.586 7.172 9.879 6.879C10.172 6.586 10.511 6.363 10.896 6.211C11.25 6.07 11.619 6 12 6C12.381 6 12.75 6.07 13.104 6.211C13.489 6.363 13.828 6.586 14.121 6.879C14.414 7.172 14.637 7.511 14.789 7.896C14.93 8.25 15 8.619 15 9C15 9.381 14.93 9.75 14.789 10.104C14.637 10.489 14.414 10.828 14.121 11.121C14.082 11.161 14.041 11.199 14 11.236L14 14C14 14.101 13.972 14.193 13.916 14.277C13.838 14.395 13.732 14.467 13.599 14.493ZM10.586 10.414C10.781 10.609 11.007 10.758 11.264 10.86C11.5 10.953 11.746 11 12 11C12.254 11 12.5 10.953 12.736 10.86C12.993 10.758 13.219 10.609 13.414 10.414C13.609 10.219 13.758 9.993 13.86 9.736C13.953 9.5 14 9.254 14 9C14 8.746 13.953 8.5 13.86 8.264C13.758 8.007 13.609 7.781 13.414 7.586C13.219 7.391 12.993 7.242 12.736 7.14C12.5 7.047 12.254 7 12 7C11.746 7 11.5 7.047 11.264 7.14C11.007 7.242 10.781 7.391 10.586 7.586C10.391 7.781 10.242 8.007 10.14 8.264C10.047 8.5 10 8.746 10 9C10 9.254 10.047 9.5 10.14 9.736C10.242 9.993 10.391 10.219 10.586 10.414ZM8.08 9.799C8.04 9.931 7.962 10.029 7.845 10.094C7.726 10.16 7.599 10.174 7.463 10.135C7.149 10.045 6.827 10 6.5 10C6.055 10 5.625 10.082 5.212 10.246C4.762 10.424 4.367 10.683 4.025 11.025C3.683 11.367 3.424 11.762 3.246 12.212C3.082 12.625 3 13.055 3 13.5L3 14.5C3 14.641 2.952 14.759 2.856 14.856C2.759 14.952 2.641 15 2.5 15C2.359 15 2.241 14.952 2.144 14.856C2.048 14.759 2 14.641 2 14.5L2 13.5C2 12.928 2.105 12.376 2.316 11.844C2.545 11.266 2.879 10.757 3.318 10.318C3.757 9.879 4.266 9.545 4.844 9.316C5.376 9.105 5.928 9 6.5 9C6.921 9 7.334 9.058 7.739 9.174C7.858 9.208 7.951 9.276 8.017 9.377C8.031 9.519 8.052 9.66 8.08 9.799ZM12 12.499C12.1 12.499 12.193 12.527 12.277 12.584L13 13.066L13 11.828C12.678 11.943 12.344 12 12 12C11.656 12 11.322 11.943 11 11.828L11 13.066L11.723 12.584C11.807 12.527 11.9 12.499 12 12.499Z" />
    </svg>
  );
}

Vue

Vue: see /icons/user-ribbon.md

Svelte

Svelte: see /icons/user-ribbon.md

HTML img

HTML img: see /icons/user-ribbon.md

CSS

CSS: see /icons/user-ribbon.md

Data URL

Data URL: see /icons/user-ribbon.md

Sprite

Sprite: see /icons/user-ribbon.md

SwiftUI

SwiftUI: see /icons/user-ribbon.md

Compose

Compose: see /icons/user-ribbon.md

Android XML

Android XML: see /icons/user-ribbon.md

Flutter

Flutter: see /icons/user-ribbon.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.

Meaning

Use it for

certified user, user award

Tags

person, user, award, ribbon, rosette, certified, badge, achievement

Category

People & accounts

Component name

UserRibbonIcon

History

2026-11-12 20 px drawn, 24 px drawn, added

Family 78

diversity inmate user user-alert user-arms-up user-arrow-down user-arrow-right user-arrow-up user-ban user-banknote user-bolt user-check

More people & accounts icons

address-book address-book-off baby baby-bottle baby-carriage baby-carriage-off coffin contact-card contact-card-link couple diaper elderly family family-outline family-tree gender-female · all people & accounts icons

For agents

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

user-ribbon icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp