flag icon

flag-sharp from IonIcons by Ben Sperry · Sharp · MIT Free for personal and commercial use.

Name
flag-sharp
Set
IonIcons
Style
Sharp
Viewbox
512×512
License
MIT

2 other variants in IonIcons

flagflag-outline

The same icon in other sets

flagAkar IconsflagBootstrap IconsflagBoxIcons v2flagBoxIcons v2 SolidflagCarbonflag-fillEva IconsflagFramework7 IconsflagFont Awesome 6 RegularflagFont Awesome 6 SolidflagFeather Iconsflag-16-filledFluent UI System Iconsflagcss.ggflagHeroIconsflagHumbleiconsflagJam IconsflagLine AwesomeflagLucideflagMage IconsflagMajesticonsflagMaterial SymbolsflagMaterial Design Iconsflag-16OcticonsflagPhosphorflagPixelarticons

Use the flag icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M102 480H64V57.37l4.69-4.68C72.14 49.23 92.78 32 160 32c37.21 0 78.83 14.71 115.55 27.68C305.12 70.13 333.05 80 352 80c42.83 0 72.72-14.25 73-14.4l23-11.14v259.43l-8.84 4.42C437.71 319 403.19 336 352 336c-24.14 0-54.38-7.14-86.39-14.71C229.63 312.79 192.43 304 160 304c-36.87 0-49.74 5.58-58 9.11Z"/></svg>

React

import type { SVGProps } from "react";

export function IonFlagSharp(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M102 480H64V57.37l4.69-4.68C72.14 49.23 92.78 32 160 32c37.21 0 78.83 14.71 115.55 27.68C305.12 70.13 333.05 80 352 80c42.83 0 72.72-14.25 73-14.4l23-11.14v259.43l-8.84 4.42C437.71 319 403.19 336 352 336c-24.14 0-54.38-7.14-86.39-14.71C229.63 312.79 192.43 304 160 304c-36.87 0-49.74 5.58-58 9.11Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M102 480H64V57.37l4.69-4.68C72.14 49.23 92.78 32 160 32c37.21 0 78.83 14.71 115.55 27.68C305.12 70.13 333.05 80 352 80c42.83 0 72.72-14.25 73-14.4l23-11.14v259.43l-8.84 4.42C437.71 319 403.19 336 352 336c-24.14 0-54.38-7.14-86.39-14.71C229.63 312.79 192.43 304 160 304c-36.87 0-49.74 5.58-58 9.11Z"/></svg>
</template>

CSS

.icon-flag-sharp {
  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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M102%20480H64V57.37l4.69-4.68C72.14%2049.23%2092.78%2032%20160%2032c37.21%200%2078.83%2014.71%20115.55%2027.68C305.12%2070.13%20333.05%2080%20352%2080c42.83%200%2072.72-14.25%2073-14.4l23-11.14v259.43l-8.84%204.42C437.71%20319%20403.19%20336%20352%20336c-24.14%200-54.38-7.14-86.39-14.71C229.63%20312.79%20192.43%20304%20160%20304c-36.87%200-49.74%205.58-58%209.11Z%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M102%20480H64V57.37l4.69-4.68C72.14%2049.23%2092.78%2032%20160%2032c37.21%200%2078.83%2014.71%20115.55%2027.68C305.12%2070.13%20333.05%2080%20352%2080c42.83%200%2072.72-14.25%2073-14.4l23-11.14v259.43l-8.84%204.42C437.71%20319%20403.19%20336%20352%20336c-24.14%200-54.38-7.14-86.39-14.71C229.63%20312.79%20192.43%20304%20160%20304c-36.87%200-49.74%205.58-58%209.11Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/flag-sharp.svg?color=%231a73e8&size=48