butterfly icon
butterfly-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.
- Name
- butterfly-light
- Set
- Phosphor
- Style
- Light
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
The same icon in other sets
butterflyEmoji One (Colored)butterflyFluent EmojibutterflyFluent Emoji FlatbutterflyFluent Emoji High ContrastbutterflyIconParkbutterflyIconPark OutlinebutterflyIconPark SolidbutterflyIconPark TwoTonebutterflyLucide LabbutterflyMaterial Design Iconsbutterfly-fillMingCute IconbutterflyNoto EmojibutterflyOpenMojibutterflyTabler IconsbutterflyTwitter Emoji
Use the butterfly icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M231.1 51.71C226.09 45.27 218.64 42 209 42c-16.33 0-37.41 11.06-56.4 29.59A132 132 0 0 0 134 93.94V56a6 6 0 0 0-12 0v37.94a132 132 0 0 0-18.54-22.35C84.49 53.06 63.4 42 47.07 42c-9.69 0-17.14 3.27-22.15 9.71c-5.53 7.11-7.71 17.69-6.66 32.34c.91 12.73 4.12 26.53 6.81 37.13c6.28 24.74 20.77 33 31.78 35.68A42 42 0 1 0 128 201.62a42 42 0 1 0 71.16-44.76c11-2.63 25.5-10.94 31.78-35.68c6.61-25.97 11.78-54.53.16-69.47M92 210a30.12 30.12 0 0 1-3.34-60a6 6 0 0 0-1.31-12a41.7 41.7 0 0 0-20.28 8c-9 .31-24.12-3.16-30.37-27.76c-3.25-12.81-11.89-46.83-2.31-59.15C37.05 55.66 41.2 54 47.07 54c12.88 0 31.72 10.28 48 26.18C111.69 96.39 122 114.59 122 127.67V180a30 30 0 0 1-30 30m127.31-91.77C213.07 142.83 198 146.29 189 146a41.6 41.6 0 0 0-20.28-8a6 6 0 1 0-1.36 12A30.11 30.11 0 1 1 134 180v-52.33c0-13.08 10.32-31.28 26.93-47.49C177.23 64.28 196.07 54 209 54c5.87 0 10 1.66 12.68 5.08c9.53 12.32.89 46.34-2.36 59.15Z"/></svg>
React
import type { SVGProps } from "react";
export function PhButterflyLight(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M231.1 51.71C226.09 45.27 218.64 42 209 42c-16.33 0-37.41 11.06-56.4 29.59A132 132 0 0 0 134 93.94V56a6 6 0 0 0-12 0v37.94a132 132 0 0 0-18.54-22.35C84.49 53.06 63.4 42 47.07 42c-9.69 0-17.14 3.27-22.15 9.71c-5.53 7.11-7.71 17.69-6.66 32.34c.91 12.73 4.12 26.53 6.81 37.13c6.28 24.74 20.77 33 31.78 35.68A42 42 0 1 0 128 201.62a42 42 0 1 0 71.16-44.76c11-2.63 25.5-10.94 31.78-35.68c6.61-25.97 11.78-54.53.16-69.47M92 210a30.12 30.12 0 0 1-3.34-60a6 6 0 0 0-1.31-12a41.7 41.7 0 0 0-20.28 8c-9 .31-24.12-3.16-30.37-27.76c-3.25-12.81-11.89-46.83-2.31-59.15C37.05 55.66 41.2 54 47.07 54c12.88 0 31.72 10.28 48 26.18C111.69 96.39 122 114.59 122 127.67V180a30 30 0 0 1-30 30m127.31-91.77C213.07 142.83 198 146.29 189 146a41.6 41.6 0 0 0-20.28-8a6 6 0 1 0-1.36 12A30.11 30.11 0 1 1 134 180v-52.33c0-13.08 10.32-31.28 26.93-47.49C177.23 64.28 196.07 54 209 54c5.87 0 10 1.66 12.68 5.08c9.53 12.32.89 46.34-2.36 59.15Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M231.1 51.71C226.09 45.27 218.64 42 209 42c-16.33 0-37.41 11.06-56.4 29.59A132 132 0 0 0 134 93.94V56a6 6 0 0 0-12 0v37.94a132 132 0 0 0-18.54-22.35C84.49 53.06 63.4 42 47.07 42c-9.69 0-17.14 3.27-22.15 9.71c-5.53 7.11-7.71 17.69-6.66 32.34c.91 12.73 4.12 26.53 6.81 37.13c6.28 24.74 20.77 33 31.78 35.68A42 42 0 1 0 128 201.62a42 42 0 1 0 71.16-44.76c11-2.63 25.5-10.94 31.78-35.68c6.61-25.97 11.78-54.53.16-69.47M92 210a30.12 30.12 0 0 1-3.34-60a6 6 0 0 0-1.31-12a41.7 41.7 0 0 0-20.28 8c-9 .31-24.12-3.16-30.37-27.76c-3.25-12.81-11.89-46.83-2.31-59.15C37.05 55.66 41.2 54 47.07 54c12.88 0 31.72 10.28 48 26.18C111.69 96.39 122 114.59 122 127.67V180a30 30 0 0 1-30 30m127.31-91.77C213.07 142.83 198 146.29 189 146a41.6 41.6 0 0 0-20.28-8a6 6 0 1 0-1.36 12A30.11 30.11 0 1 1 134 180v-52.33c0-13.08 10.32-31.28 26.93-47.49C177.23 64.28 196.07 54 209 54c5.87 0 10 1.66 12.68 5.08c9.53 12.32.89 46.34-2.36 59.15Z"/></svg> </template>
CSS
.icon-butterfly-light {
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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M231.1%2051.71C226.09%2045.27%20218.64%2042%20209%2042c-16.33%200-37.41%2011.06-56.4%2029.59A132%20132%200%200%200%20134%2093.94V56a6%206%200%200%200-12%200v37.94a132%20132%200%200%200-18.54-22.35C84.49%2053.06%2063.4%2042%2047.07%2042c-9.69%200-17.14%203.27-22.15%209.71c-5.53%207.11-7.71%2017.69-6.66%2032.34c.91%2012.73%204.12%2026.53%206.81%2037.13c6.28%2024.74%2020.77%2033%2031.78%2035.68A42%2042%200%201%200%20128%20201.62a42%2042%200%201%200%2071.16-44.76c11-2.63%2025.5-10.94%2031.78-35.68c6.61-25.97%2011.78-54.53.16-69.47M92%20210a30.12%2030.12%200%200%201-3.34-60a6%206%200%200%200-1.31-12a41.7%2041.7%200%200%200-20.28%208c-9%20.31-24.12-3.16-30.37-27.76c-3.25-12.81-11.89-46.83-2.31-59.15C37.05%2055.66%2041.2%2054%2047.07%2054c12.88%200%2031.72%2010.28%2048%2026.18C111.69%2096.39%20122%20114.59%20122%20127.67V180a30%2030%200%200%201-30%2030m127.31-91.77C213.07%20142.83%20198%20146.29%20189%20146a41.6%2041.6%200%200%200-20.28-8a6%206%200%201%200-1.36%2012A30.11%2030.11%200%201%201%20134%20180v-52.33c0-13.08%2010.32-31.28%2026.93-47.49C177.23%2064.28%20196.07%2054%20209%2054c5.87%200%2010%201.66%2012.68%205.08c9.53%2012.32.89%2046.34-2.36%2059.15Z%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M231.1%2051.71C226.09%2045.27%20218.64%2042%20209%2042c-16.33%200-37.41%2011.06-56.4%2029.59A132%20132%200%200%200%20134%2093.94V56a6%206%200%200%200-12%200v37.94a132%20132%200%200%200-18.54-22.35C84.49%2053.06%2063.4%2042%2047.07%2042c-9.69%200-17.14%203.27-22.15%209.71c-5.53%207.11-7.71%2017.69-6.66%2032.34c.91%2012.73%204.12%2026.53%206.81%2037.13c6.28%2024.74%2020.77%2033%2031.78%2035.68A42%2042%200%201%200%20128%20201.62a42%2042%200%201%200%2071.16-44.76c11-2.63%2025.5-10.94%2031.78-35.68c6.61-25.97%2011.78-54.53.16-69.47M92%20210a30.12%2030.12%200%200%201-3.34-60a6%206%200%200%200-1.31-12a41.7%2041.7%200%200%200-20.28%208c-9%20.31-24.12-3.16-30.37-27.76c-3.25-12.81-11.89-46.83-2.31-59.15C37.05%2055.66%2041.2%2054%2047.07%2054c12.88%200%2031.72%2010.28%2048%2026.18C111.69%2096.39%20122%20114.59%20122%20127.67V180a30%2030%200%200%201-30%2030m127.31-91.77C213.07%20142.83%20198%20146.29%20189%20146a41.6%2041.6%200%200%200-20.28-8a6%206%200%201%200-1.36%2012A30.11%2030.11%200%201%201%20134%20180v-52.33c0-13.08%2010.32-31.28%2026.93-47.49C177.23%2064.28%20196.07%2054%20209%2054c5.87%200%2010%201.66%2012.68%205.08c9.53%2012.32.89%2046.34-2.36%2059.15Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/butterfly-light.svg?color=%231a73e8&size=48
