butterfly emoji

butterfly from Fluent Emoji Flat by Microsoft Corporation · Default · Animals & Nature · MIT Free for personal and commercial use.

Name: butterfly
Set: Fluent Emoji Flat
Style: Default
Category: Animals & Nature
Viewbox: 32×32
License: MIT

The same emoji in other sets

butterflyEmoji One (Colored)butterflyFluent Emoji butterflyFluent Emoji High Contrast butterflyIconPark butterflyIconPark Outline butterflyIconPark Solid butterflyIconPark TwoTone butterflyLucide Lab butterflyMaterial Design Icons butterfly-fillMingCute Icon butterflyNoto Emoji butterflyOpenMoji butterflyPhosphor butterflyTabler Icons butterflyTwitter Emoji

More animals & nature icons from Fluent Emoji Flat

ant baby-chick badger bat bear beaver beetle bird bison black-cat blackbird blossom blowfish boar bouquet bug cactus camel cat cat-face cherry-blossom chicken chipmunk cockroach

Use the butterfly emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#533566" d="M27.5 2c-.62 0-1.19.23-1.63.6L16 11L6.13 2.6C5.69 2.23 5.12 2 4.5 2A2.5 2.5 0 0 0 2 4.5v9.75C2 16.32 3.68 18 5.75 18H8c-3.31 0-6 2.69-6 6s2.69 6 6 6a6 6 0 0 0 5.67-4.04L16 20.39l2.33 5.57A6 6 0 0 0 24 30c3.31 0 6-2.69 6-6s-2.69-6-6-6h2.25c2.07 0 3.75-1.68 3.75-3.75V4.5A2.5 2.5 0 0 0 27.5 2"/><path fill="#ff822d" d="m10.21 13.96l-4.76-2.75c-.54-.32-1.22.08-1.22.71v2c0 1.7 1.38 3.08 3.08 3.08c.62 0 1.22-.25 1.66-.69l1.37-1.37a.62.62 0 0 0-.13-.98m11.81 0l4.76-2.75c.54-.32 1.22.08 1.22.71v2c0 1.7-1.38 3.08-3.08 3.08c-.62 0-1.22-.25-1.66-.69l-1.37-1.37a.62.62 0 0 1 .13-.98M17 16.85l2.77-1.6c.38-.21.86-.15 1.17.16l.8.8c.29.29.08.79-.33.79H17zm-4.54-1.6l2.77 1.6V17h-4.41c-.41 0-.62-.5-.33-.79l.8-.8c.31-.31.79-.37 1.17-.16"/><path fill="#ff6723" d="M4.23 5.98V8.2c0 .71.38 1.37.99 1.72l10.01 5.78V13L5.76 5.25c-.61-.5-1.53-.06-1.53.73m23.77 0V8.2c0 .71-.38 1.37-.99 1.72L17 15.7V13l9.47-7.75c.61-.5 1.53-.06 1.53.73M12.96 19.5H9.64c-.55 0-.82.66-.43 1.04l2.95 2.95c.31.31.83.2 1-.2l.9-2.15c.33-.77-.25-1.64-1.1-1.64m-6.94.46A4.5 4.5 0 0 0 3.5 24c0 2.47 1.95 4.46 4.41 4.5a4.47 4.47 0 0 0 4.12-2.51l.01-.02q.001-.007.005-.01q.004-.004.005-.01c.22-.47.12-1.04-.25-1.41L7.45 20.2c-.38-.38-.95-.48-1.43-.24m.62 7.05a1.64 1.64 0 1 1 0-3.28a1.64 1.64 0 0 1 0 3.28m12.44-7.51h3.32c.55 0 .82.66.43 1.04l-2.95 2.95c-.31.31-.83.2-1-.2l-.9-2.15c-.33-.77.25-1.64 1.1-1.64m6.94.46c1.49.73 2.52 2.27 2.52 4.04c0 2.47-1.95 4.46-4.41 4.5a4.47 4.47 0 0 1-4.12-2.51l-.01-.01q-.001-.007-.005-.01q-.005-.003-.005-.01c-.22-.47-.12-1.04.25-1.41l4.35-4.35c.38-.38.95-.48 1.43-.24m-.62 6.92a1.64 1.64 0 1 0 0-3.28a1.64 1.64 0 0 0 0 3.28"/><path fill="#212121" d="M13.305 2.193a.5.5 0 0 0-.79.614a11.87 11.87 0 0 1 2.495 7.303a.5.5 0 0 0 .99.1a.5.5 0 0 0 .99-.1c0-2.755.93-5.288 2.495-7.303a.5.5 0 0 0-.79-.614A12.86 12.86 0 0 0 16 9.596a12.86 12.86 0 0 0-2.695-7.403"/><path fill="#321b41" d="M16.917 10.778a2 2 0 1 0-1.84-.003a1.45 1.45 0 0 0-.587 1.165v10.61c0 .8.65 1.45 1.45 1.45h.11c.8 0 1.45-.65 1.45-1.45V11.94c0-.475-.23-.897-.583-1.162"/></g></svg>

React

import type { SVGProps } from "react";

export function FluentEmojiFlatButterfly(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#533566" d="M27.5 2c-.62 0-1.19.23-1.63.6L16 11L6.13 2.6C5.69 2.23 5.12 2 4.5 2A2.5 2.5 0 0 0 2 4.5v9.75C2 16.32 3.68 18 5.75 18H8c-3.31 0-6 2.69-6 6s2.69 6 6 6a6 6 0 0 0 5.67-4.04L16 20.39l2.33 5.57A6 6 0 0 0 24 30c3.31 0 6-2.69 6-6s-2.69-6-6-6h2.25c2.07 0 3.75-1.68 3.75-3.75V4.5A2.5 2.5 0 0 0 27.5 2"/><path fill="#ff822d" d="m10.21 13.96l-4.76-2.75c-.54-.32-1.22.08-1.22.71v2c0 1.7 1.38 3.08 3.08 3.08c.62 0 1.22-.25 1.66-.69l1.37-1.37a.62.62 0 0 0-.13-.98m11.81 0l4.76-2.75c.54-.32 1.22.08 1.22.71v2c0 1.7-1.38 3.08-3.08 3.08c-.62 0-1.22-.25-1.66-.69l-1.37-1.37a.62.62 0 0 1 .13-.98M17 16.85l2.77-1.6c.38-.21.86-.15 1.17.16l.8.8c.29.29.08.79-.33.79H17zm-4.54-1.6l2.77 1.6V17h-4.41c-.41 0-.62-.5-.33-.79l.8-.8c.31-.31.79-.37 1.17-.16"/><path fill="#ff6723" d="M4.23 5.98V8.2c0 .71.38 1.37.99 1.72l10.01 5.78V13L5.76 5.25c-.61-.5-1.53-.06-1.53.73m23.77 0V8.2c0 .71-.38 1.37-.99 1.72L17 15.7V13l9.47-7.75c.61-.5 1.53-.06 1.53.73M12.96 19.5H9.64c-.55 0-.82.66-.43 1.04l2.95 2.95c.31.31.83.2 1-.2l.9-2.15c.33-.77-.25-1.64-1.1-1.64m-6.94.46A4.5 4.5 0 0 0 3.5 24c0 2.47 1.95 4.46 4.41 4.5a4.47 4.47 0 0 0 4.12-2.51l.01-.02q.001-.007.005-.01q.004-.004.005-.01c.22-.47.12-1.04-.25-1.41L7.45 20.2c-.38-.38-.95-.48-1.43-.24m.62 7.05a1.64 1.64 0 1 1 0-3.28a1.64 1.64 0 0 1 0 3.28m12.44-7.51h3.32c.55 0 .82.66.43 1.04l-2.95 2.95c-.31.31-.83.2-1-.2l-.9-2.15c-.33-.77.25-1.64 1.1-1.64m6.94.46c1.49.73 2.52 2.27 2.52 4.04c0 2.47-1.95 4.46-4.41 4.5a4.47 4.47 0 0 1-4.12-2.51l-.01-.01q-.001-.007-.005-.01q-.005-.003-.005-.01c-.22-.47-.12-1.04.25-1.41l4.35-4.35c.38-.38.95-.48 1.43-.24m-.62 6.92a1.64 1.64 0 1 0 0-3.28a1.64 1.64 0 0 0 0 3.28"/><path fill="#212121" d="M13.305 2.193a.5.5 0 0 0-.79.614a11.87 11.87 0 0 1 2.495 7.303a.5.5 0 0 0 .99.1a.5.5 0 0 0 .99-.1c0-2.755.93-5.288 2.495-7.303a.5.5 0 0 0-.79-.614A12.86 12.86 0 0 0 16 9.596a12.86 12.86 0 0 0-2.695-7.403"/><path fill="#321b41" d="M16.917 10.778a2 2 0 1 0-1.84-.003a1.45 1.45 0 0 0-.587 1.165v10.61c0 .8.65 1.45 1.45 1.45h.11c.8 0 1.45-.65 1.45-1.45V11.94c0-.475-.23-.897-.583-1.162"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="none"><path fill="#533566" d="M27.5 2c-.62 0-1.19.23-1.63.6L16 11L6.13 2.6C5.69 2.23 5.12 2 4.5 2A2.5 2.5 0 0 0 2 4.5v9.75C2 16.32 3.68 18 5.75 18H8c-3.31 0-6 2.69-6 6s2.69 6 6 6a6 6 0 0 0 5.67-4.04L16 20.39l2.33 5.57A6 6 0 0 0 24 30c3.31 0 6-2.69 6-6s-2.69-6-6-6h2.25c2.07 0 3.75-1.68 3.75-3.75V4.5A2.5 2.5 0 0 0 27.5 2"/><path fill="#ff822d" d="m10.21 13.96l-4.76-2.75c-.54-.32-1.22.08-1.22.71v2c0 1.7 1.38 3.08 3.08 3.08c.62 0 1.22-.25 1.66-.69l1.37-1.37a.62.62 0 0 0-.13-.98m11.81 0l4.76-2.75c.54-.32 1.22.08 1.22.71v2c0 1.7-1.38 3.08-3.08 3.08c-.62 0-1.22-.25-1.66-.69l-1.37-1.37a.62.62 0 0 1 .13-.98M17 16.85l2.77-1.6c.38-.21.86-.15 1.17.16l.8.8c.29.29.08.79-.33.79H17zm-4.54-1.6l2.77 1.6V17h-4.41c-.41 0-.62-.5-.33-.79l.8-.8c.31-.31.79-.37 1.17-.16"/><path fill="#ff6723" d="M4.23 5.98V8.2c0 .71.38 1.37.99 1.72l10.01 5.78V13L5.76 5.25c-.61-.5-1.53-.06-1.53.73m23.77 0V8.2c0 .71-.38 1.37-.99 1.72L17 15.7V13l9.47-7.75c.61-.5 1.53-.06 1.53.73M12.96 19.5H9.64c-.55 0-.82.66-.43 1.04l2.95 2.95c.31.31.83.2 1-.2l.9-2.15c.33-.77-.25-1.64-1.1-1.64m-6.94.46A4.5 4.5 0 0 0 3.5 24c0 2.47 1.95 4.46 4.41 4.5a4.47 4.47 0 0 0 4.12-2.51l.01-.02q.001-.007.005-.01q.004-.004.005-.01c.22-.47.12-1.04-.25-1.41L7.45 20.2c-.38-.38-.95-.48-1.43-.24m.62 7.05a1.64 1.64 0 1 1 0-3.28a1.64 1.64 0 0 1 0 3.28m12.44-7.51h3.32c.55 0 .82.66.43 1.04l-2.95 2.95c-.31.31-.83.2-1-.2l-.9-2.15c-.33-.77.25-1.64 1.1-1.64m6.94.46c1.49.73 2.52 2.27 2.52 4.04c0 2.47-1.95 4.46-4.41 4.5a4.47 4.47 0 0 1-4.12-2.51l-.01-.01q-.001-.007-.005-.01q-.005-.003-.005-.01c-.22-.47-.12-1.04.25-1.41l4.35-4.35c.38-.38.95-.48 1.43-.24m-.62 6.92a1.64 1.64 0 1 0 0-3.28a1.64 1.64 0 0 0 0 3.28"/><path fill="#212121" d="M13.305 2.193a.5.5 0 0 0-.79.614a11.87 11.87 0 0 1 2.495 7.303a.5.5 0 0 0 .99.1a.5.5 0 0 0 .99-.1c0-2.755.93-5.288 2.495-7.303a.5.5 0 0 0-.79-.614A12.86 12.86 0 0 0 16 9.596a12.86 12.86 0 0 0-2.695-7.403"/><path fill="#321b41" d="M16.917 10.778a2 2 0 1 0-1.84-.003a1.45 1.45 0 0 0-.587 1.165v10.61c0 .8.65 1.45 1.45 1.45h.11c.8 0 1.45-.65 1.45-1.45V11.94c0-.475-.23-.897-.583-1.162"/></g></svg>
</template>

CSS

.icon-butterfly {
  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%2032%2032%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%23533566%22%20d%3D%22M27.5%202c-.62%200-1.19.23-1.63.6L16%2011L6.13%202.6C5.69%202.23%205.12%202%204.5%202A2.5%202.5%200%200%200%202%204.5v9.75C2%2016.32%203.68%2018%205.75%2018H8c-3.31%200-6%202.69-6%206s2.69%206%206%206a6%206%200%200%200%205.67-4.04L16%2020.39l2.33%205.57A6%206%200%200%200%2024%2030c3.31%200%206-2.69%206-6s-2.69-6-6-6h2.25c2.07%200%203.75-1.68%203.75-3.75V4.5A2.5%202.5%200%200%200%2027.5%202%22%2F%3E%3Cpath%20fill%3D%22%23ff822d%22%20d%3D%22m10.21%2013.96l-4.76-2.75c-.54-.32-1.22.08-1.22.71v2c0%201.7%201.38%203.08%203.08%203.08c.62%200%201.22-.25%201.66-.69l1.37-1.37a.62.62%200%200%200-.13-.98m11.81%200l4.76-2.75c.54-.32%201.22.08%201.22.71v2c0%201.7-1.38%203.08-3.08%203.08c-.62%200-1.22-.25-1.66-.69l-1.37-1.37a.62.62%200%200%201%20.13-.98M17%2016.85l2.77-1.6c.38-.21.86-.15%201.17.16l.8.8c.29.29.08.79-.33.79H17zm-4.54-1.6l2.77%201.6V17h-4.41c-.41%200-.62-.5-.33-.79l.8-.8c.31-.31.79-.37%201.17-.16%22%2F%3E%3Cpath%20fill%3D%22%23ff6723%22%20d%3D%22M4.23%205.98V8.2c0%20.71.38%201.37.99%201.72l10.01%205.78V13L5.76%205.25c-.61-.5-1.53-.06-1.53.73m23.77%200V8.2c0%20.71-.38%201.37-.99%201.72L17%2015.7V13l9.47-7.75c.61-.5%201.53-.06%201.53.73M12.96%2019.5H9.64c-.55%200-.82.66-.43%201.04l2.95%202.95c.31.31.83.2%201-.2l.9-2.15c.33-.77-.25-1.64-1.1-1.64m-6.94.46A4.5%204.5%200%200%200%203.5%2024c0%202.47%201.95%204.46%204.41%204.5a4.47%204.47%200%200%200%204.12-2.51l.01-.02q.001-.007.005-.01q.004-.004.005-.01c.22-.47.12-1.04-.25-1.41L7.45%2020.2c-.38-.38-.95-.48-1.43-.24m.62%207.05a1.64%201.64%200%201%201%200-3.28a1.64%201.64%200%200%201%200%203.28m12.44-7.51h3.32c.55%200%20.82.66.43%201.04l-2.95%202.95c-.31.31-.83.2-1-.2l-.9-2.15c-.33-.77.25-1.64%201.1-1.64m6.94.46c1.49.73%202.52%202.27%202.52%204.04c0%202.47-1.95%204.46-4.41%204.5a4.47%204.47%200%200%201-4.12-2.51l-.01-.01q-.001-.007-.005-.01q-.005-.003-.005-.01c-.22-.47-.12-1.04.25-1.41l4.35-4.35c.38-.38.95-.48%201.43-.24m-.62%206.92a1.64%201.64%200%201%200%200-3.28a1.64%201.64%200%200%200%200%203.28%22%2F%3E%3Cpath%20fill%3D%22%23212121%22%20d%3D%22M13.305%202.193a.5.5%200%200%200-.79.614a11.87%2011.87%200%200%201%202.495%207.303a.5.5%200%200%200%20.99.1a.5.5%200%200%200%20.99-.1c0-2.755.93-5.288%202.495-7.303a.5.5%200%200%200-.79-.614A12.86%2012.86%200%200%200%2016%209.596a12.86%2012.86%200%200%200-2.695-7.403%22%2F%3E%3Cpath%20fill%3D%22%23321b41%22%20d%3D%22M16.917%2010.778a2%202%200%201%200-1.84-.003a1.45%201.45%200%200%200-.587%201.165v10.61c0%20.8.65%201.45%201.45%201.45h.11c.8%200%201.45-.65%201.45-1.45V11.94c0-.475-.23-.897-.583-1.162%22%2F%3E%3C%2Fg%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%2032%2032%22%3E%3Cg%20fill%3D%22none%22%3E%3Cpath%20fill%3D%22%23533566%22%20d%3D%22M27.5%202c-.62%200-1.19.23-1.63.6L16%2011L6.13%202.6C5.69%202.23%205.12%202%204.5%202A2.5%202.5%200%200%200%202%204.5v9.75C2%2016.32%203.68%2018%205.75%2018H8c-3.31%200-6%202.69-6%206s2.69%206%206%206a6%206%200%200%200%205.67-4.04L16%2020.39l2.33%205.57A6%206%200%200%200%2024%2030c3.31%200%206-2.69%206-6s-2.69-6-6-6h2.25c2.07%200%203.75-1.68%203.75-3.75V4.5A2.5%202.5%200%200%200%2027.5%202%22%2F%3E%3Cpath%20fill%3D%22%23ff822d%22%20d%3D%22m10.21%2013.96l-4.76-2.75c-.54-.32-1.22.08-1.22.71v2c0%201.7%201.38%203.08%203.08%203.08c.62%200%201.22-.25%201.66-.69l1.37-1.37a.62.62%200%200%200-.13-.98m11.81%200l4.76-2.75c.54-.32%201.22.08%201.22.71v2c0%201.7-1.38%203.08-3.08%203.08c-.62%200-1.22-.25-1.66-.69l-1.37-1.37a.62.62%200%200%201%20.13-.98M17%2016.85l2.77-1.6c.38-.21.86-.15%201.17.16l.8.8c.29.29.08.79-.33.79H17zm-4.54-1.6l2.77%201.6V17h-4.41c-.41%200-.62-.5-.33-.79l.8-.8c.31-.31.79-.37%201.17-.16%22%2F%3E%3Cpath%20fill%3D%22%23ff6723%22%20d%3D%22M4.23%205.98V8.2c0%20.71.38%201.37.99%201.72l10.01%205.78V13L5.76%205.25c-.61-.5-1.53-.06-1.53.73m23.77%200V8.2c0%20.71-.38%201.37-.99%201.72L17%2015.7V13l9.47-7.75c.61-.5%201.53-.06%201.53.73M12.96%2019.5H9.64c-.55%200-.82.66-.43%201.04l2.95%202.95c.31.31.83.2%201-.2l.9-2.15c.33-.77-.25-1.64-1.1-1.64m-6.94.46A4.5%204.5%200%200%200%203.5%2024c0%202.47%201.95%204.46%204.41%204.5a4.47%204.47%200%200%200%204.12-2.51l.01-.02q.001-.007.005-.01q.004-.004.005-.01c.22-.47.12-1.04-.25-1.41L7.45%2020.2c-.38-.38-.95-.48-1.43-.24m.62%207.05a1.64%201.64%200%201%201%200-3.28a1.64%201.64%200%200%201%200%203.28m12.44-7.51h3.32c.55%200%20.82.66.43%201.04l-2.95%202.95c-.31.31-.83.2-1-.2l-.9-2.15c-.33-.77.25-1.64%201.1-1.64m6.94.46c1.49.73%202.52%202.27%202.52%204.04c0%202.47-1.95%204.46-4.41%204.5a4.47%204.47%200%200%201-4.12-2.51l-.01-.01q-.001-.007-.005-.01q-.005-.003-.005-.01c-.22-.47-.12-1.04.25-1.41l4.35-4.35c.38-.38.95-.48%201.43-.24m-.62%206.92a1.64%201.64%200%201%200%200-3.28a1.64%201.64%200%200%200%200%203.28%22%2F%3E%3Cpath%20fill%3D%22%23212121%22%20d%3D%22M13.305%202.193a.5.5%200%200%200-.79.614a11.87%2011.87%200%200%201%202.495%207.303a.5.5%200%200%200%20.99.1a.5.5%200%200%200%20.99-.1c0-2.755.93-5.288%202.495-7.303a.5.5%200%200%200-.79-.614A12.86%2012.86%200%200%200%2016%209.596a12.86%2012.86%200%200%200-2.695-7.403%22%2F%3E%3Cpath%20fill%3D%22%23321b41%22%20d%3D%22M16.917%2010.778a2%202%200%201%200-1.84-.003a1.45%201.45%200%200%200-.587%201.165v10.61c0%20.8.65%201.45%201.45%201.45h.11c.8%200%201.45-.65%201.45-1.45V11.94c0-.475-.23-.897-.583-1.162%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-emoji-flat/butterfly.svg?color=%231a73e8&size=48