flame icon

Flame: hot, popular, trending, fire. 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="M11.552 3.977C11.931 4.438 12.214 4.793 12.399 5.044C12.717 5.473 12.98 5.885 13.189 6.278C13.73 7.294 14 8.368 14 9.5C14 10.199 13.871 10.874 13.614 11.525C13.334 12.231 12.926 12.852 12.389 13.389C11.852 13.926 11.231 14.334 10.525 14.614C9.874 14.871 9.199 15 8.5 15C7.801 15 7.126 14.871 6.475 14.614C5.769 14.334 5.148 13.926 4.611 13.389C4.074 12.852 3.666 12.231 3.386 11.525C3.129 10.874 3 10.199 3 9.5C3 8.851 3.003 8.377 3.008 8.077C3.017 7.581 3.035 7.147 3.064 6.774C3.134 5.867 3.288 5.056 3.526 4.342C3.569 4.211 3.653 4.115 3.776 4.053C3.9 3.991 4.027 3.982 4.158 4.026C4.316 4.078 4.422 4.184 4.474 4.342C4.639 4.836 4.764 5.197 4.851 5.425C4.99 5.793 5.123 6.091 5.25 6.32C5.486 6.745 5.72 6.971 5.953 6.997C5.97 6.975 5.989 6.942 6.01 6.897C6.077 6.762 6.179 6.456 6.317 5.979C6.447 5.529 6.556 5.175 6.645 4.918C6.8 4.47 6.971 4.058 7.16 3.681C7.663 2.674 8.337 1.819 9.18 1.116C9.286 1.027 9.408 0.99 9.545 1.002C9.683 1.015 9.796 1.074 9.884 1.18C9.938 1.245 9.974 1.319 9.99 1.402C10.069 1.794 10.253 2.213 10.544 2.661C10.731 2.949 11.067 3.388 11.552 3.977ZM7.59 5.244C7.507 5.485 7.403 5.823 7.278 6.256C7.2 6.526 7.142 6.719 7.104 6.837C7.037 7.042 6.971 7.21 6.907 7.34C6.798 7.56 6.668 7.725 6.517 7.835C6.366 7.945 6.194 8 6 8C5.359 8 4.818 7.602 4.375 6.805C4.291 6.653 4.205 6.478 4.119 6.28C4.095 6.465 4.076 6.655 4.061 6.851C4.034 7.204 4.016 7.619 4.008 8.095C4.003 8.389 4 8.857 4 9.5C4 10.072 4.105 10.624 4.316 11.156C4.545 11.734 4.879 12.243 5.318 12.682C5.757 13.121 6.266 13.455 6.844 13.684C7.376 13.895 7.928 14 8.5 14C9.072 14 9.624 13.895 10.156 13.684C10.734 13.455 11.243 13.121 11.682 12.682C12.121 12.243 12.455 11.734 12.684 11.156C12.895 10.624 13 10.072 13 9.5C13 8.534 12.769 7.617 12.306 6.747C12.12 6.398 11.883 6.028 11.595 5.639C11.42 5.402 11.148 5.06 10.78 4.613C10.526 4.305 10.339 4.073 10.219 3.919C10.016 3.659 9.845 3.421 9.705 3.206C9.528 2.932 9.381 2.664 9.266 2.4C8.783 2.903 8.379 3.479 8.054 4.128C7.885 4.466 7.731 4.838 7.59 5.244ZM9.692 8.175C9.756 8.265 9.859 8.398 10.002 8.577C10.155 8.769 10.27 8.917 10.344 9.022C10.475 9.205 10.584 9.383 10.669 9.554C10.89 9.995 11 10.477 11 11C11 11.254 10.953 11.5 10.86 11.736C10.758 11.993 10.609 12.219 10.414 12.414C10.219 12.609 9.993 12.758 9.736 12.86C9.5 12.953 9.254 13 9 13C8.746 13 8.5 12.953 8.264 12.86C8.007 12.758 7.781 12.609 7.586 12.414C7.391 12.219 7.242 11.993 7.14 11.736C7.047 11.5 7 11.254 7 11C7 10.477 7.11 9.995 7.331 9.554C7.416 9.383 7.525 9.205 7.656 9.022C7.73 8.917 7.845 8.769 7.998 8.577C8.141 8.398 8.244 8.264 8.308 8.175C8.409 8.034 8.49 7.901 8.553 7.776C8.615 7.653 8.711 7.569 8.842 7.526C8.973 7.482 9.1 7.491 9.224 7.553C9.323 7.602 9.398 7.677 9.447 7.776C9.51 7.901 9.591 8.034 9.692 8.175ZM8.469 9.603C8.369 9.744 8.287 9.877 8.225 10.001C8.075 10.301 8 10.634 8 11C8 11.276 8.098 11.512 8.293 11.707C8.488 11.902 8.724 12 9 12C9.276 12 9.512 11.902 9.707 11.707C9.902 11.512 10 11.276 10 11C10 10.634 9.925 10.301 9.775 10.001C9.713 9.877 9.631 9.744 9.531 9.603C9.466 9.513 9.363 9.379 9.221 9.201C9.135 9.094 9.061 9 9 8.92C8.939 9 8.865 9.094 8.779 9.201C8.637 9.379 8.534 9.513 8.469 9.603Z"/></svg>

React

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

export function FlameIcon(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="M11.552 3.977C11.931 4.438 12.214 4.793 12.399 5.044C12.717 5.473 12.98 5.885 13.189 6.278C13.73 7.294 14 8.368 14 9.5C14 10.199 13.871 10.874 13.614 11.525C13.334 12.231 12.926 12.852 12.389 13.389C11.852 13.926 11.231 14.334 10.525 14.614C9.874 14.871 9.199 15 8.5 15C7.801 15 7.126 14.871 6.475 14.614C5.769 14.334 5.148 13.926 4.611 13.389C4.074 12.852 3.666 12.231 3.386 11.525C3.129 10.874 3 10.199 3 9.5C3 8.851 3.003 8.377 3.008 8.077C3.017 7.581 3.035 7.147 3.064 6.774C3.134 5.867 3.288 5.056 3.526 4.342C3.569 4.211 3.653 4.115 3.776 4.053C3.9 3.991 4.027 3.982 4.158 4.026C4.316 4.078 4.422 4.184 4.474 4.342C4.639 4.836 4.764 5.197 4.851 5.425C4.99 5.793 5.123 6.091 5.25 6.32C5.486 6.745 5.72 6.971 5.953 6.997C5.97 6.975 5.989 6.942 6.01 6.897C6.077 6.762 6.179 6.456 6.317 5.979C6.447 5.529 6.556 5.175 6.645 4.918C6.8 4.47 6.971 4.058 7.16 3.681C7.663 2.674 8.337 1.819 9.18 1.116C9.286 1.027 9.408 0.99 9.545 1.002C9.683 1.015 9.796 1.074 9.884 1.18C9.938 1.245 9.974 1.319 9.99 1.402C10.069 1.794 10.253 2.213 10.544 2.661C10.731 2.949 11.067 3.388 11.552 3.977ZM7.59 5.244C7.507 5.485 7.403 5.823 7.278 6.256C7.2 6.526 7.142 6.719 7.104 6.837C7.037 7.042 6.971 7.21 6.907 7.34C6.798 7.56 6.668 7.725 6.517 7.835C6.366 7.945 6.194 8 6 8C5.359 8 4.818 7.602 4.375 6.805C4.291 6.653 4.205 6.478 4.119 6.28C4.095 6.465 4.076 6.655 4.061 6.851C4.034 7.204 4.016 7.619 4.008 8.095C4.003 8.389 4 8.857 4 9.5C4 10.072 4.105 10.624 4.316 11.156C4.545 11.734 4.879 12.243 5.318 12.682C5.757 13.121 6.266 13.455 6.844 13.684C7.376 13.895 7.928 14 8.5 14C9.072 14 9.624 13.895 10.156 13.684C10.734 13.455 11.243 13.121 11.682 12.682C12.121 12.243 12.455 11.734 12.684 11.156C12.895 10.624 13 10.072 13 9.5C13 8.534 12.769 7.617 12.306 6.747C12.12 6.398 11.883 6.028 11.595 5.639C11.42 5.402 11.148 5.06 10.78 4.613C10.526 4.305 10.339 4.073 10.219 3.919C10.016 3.659 9.845 3.421 9.705 3.206C9.528 2.932 9.381 2.664 9.266 2.4C8.783 2.903 8.379 3.479 8.054 4.128C7.885 4.466 7.731 4.838 7.59 5.244ZM9.692 8.175C9.756 8.265 9.859 8.398 10.002 8.577C10.155 8.769 10.27 8.917 10.344 9.022C10.475 9.205 10.584 9.383 10.669 9.554C10.89 9.995 11 10.477 11 11C11 11.254 10.953 11.5 10.86 11.736C10.758 11.993 10.609 12.219 10.414 12.414C10.219 12.609 9.993 12.758 9.736 12.86C9.5 12.953 9.254 13 9 13C8.746 13 8.5 12.953 8.264 12.86C8.007 12.758 7.781 12.609 7.586 12.414C7.391 12.219 7.242 11.993 7.14 11.736C7.047 11.5 7 11.254 7 11C7 10.477 7.11 9.995 7.331 9.554C7.416 9.383 7.525 9.205 7.656 9.022C7.73 8.917 7.845 8.769 7.998 8.577C8.141 8.398 8.244 8.264 8.308 8.175C8.409 8.034 8.49 7.901 8.553 7.776C8.615 7.653 8.711 7.569 8.842 7.526C8.973 7.482 9.1 7.491 9.224 7.553C9.323 7.602 9.398 7.677 9.447 7.776C9.51 7.901 9.591 8.034 9.692 8.175ZM8.469 9.603C8.369 9.744 8.287 9.877 8.225 10.001C8.075 10.301 8 10.634 8 11C8 11.276 8.098 11.512 8.293 11.707C8.488 11.902 8.724 12 9 12C9.276 12 9.512 11.902 9.707 11.707C9.902 11.512 10 11.276 10 11C10 10.634 9.925 10.301 9.775 10.001C9.713 9.877 9.631 9.744 9.531 9.603C9.466 9.513 9.363 9.379 9.221 9.201C9.135 9.094 9.061 9 9 8.92C8.939 9 8.865 9.094 8.779 9.201C8.637 9.379 8.534 9.513 8.469 9.603Z" />
    </svg>
  );
}

Vue

Vue: see /icons/flame.md

Svelte

Svelte: see /icons/flame.md

HTML img

HTML img: see /icons/flame.md

CSS

CSS: see /icons/flame.md

Data URL

Data URL: see /icons/flame.md

Sprite

Sprite: see /icons/flame.md

SwiftUI

SwiftUI: see /icons/flame.md

Compose

Compose: see /icons/flame.md

Android XML

Android XML: see /icons/flame.md

Flutter

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

hot, popular, trending, fire, streak, hot topic, viral, flames, streaks, daily streak

Alternatives

trending-up: a rising metric in a chart

Also fits

trending up: trending as in hot or popular content
boost: hot or popular content (popular)
candle: fire, hot or trending

Not for

spicy (use pepper): flame owns hot and trending
fire extinguisher (use fire-extinguisher): flame owns fire, hot and trending
fire truck (use fire-truck): trending, hot or fire in general
campfire (use campfire): trending, hot or fire in general; the campfire has logs
high temperature (use thermometer-high): flame owns hot and trending
hot weather (use thermometer-sun): flame owns hot
wildfire (use wildfire): flame owns fire

Tags

fire, flame, hot, burn, popular

Category

Social & emotions

Component name

FlameIcon

History

2026-10-14 added

Family 1

campfire

More social & emotions icons

balloon bookmark bookmark-check bookmark-off bookmark-pencil bookmark-plus bookmark-search bookmark-x bookmarks face-angry face-neutral frown hand-heart heart heart-check heart-crack · all social & emotions icons

For agents

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

flame icon Copy name

line-round

line-soft

line-sharp

solid-round

solid-soft

solid-sharp