Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:
Butterfly icon
A free butterfly icon from Phosphor Icons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.
- License
- MIT license
- Project
- github.com
npx shadcn@latest add https://ui.cuelark.com/r/icons/phosphor/butterfly.jsonimport * as React from "react";
/**
* Butterfly from Phosphor Icons (https://github.com/phosphor-icons/core), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/phosphor/butterfly. Sized in em, colored by currentColor.
*/
export function PiButterflyIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
viewBox="0 0 256 256"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
d="M232.7,50.48C229,45.7,221.84,40,209,40c-16.85,0-38.46,11.28-57.81,30.16A140.07,140.07,0,0,0,136,87.53V56a8,8,0,0,0-16,0V87.53a140.07,140.07,0,0,0-15.15-17.37C85.49,51.28,63.88,40,47,40,34.16,40,27,45.7,23.3,50.48c-6.82,8.77-12.18,24.08-.21,71.2,6.05,23.83,19.51,33,30.63,36.42A44,44,0,0,0,128,205.27a44,44,0,0,0,74.28-47.17c11.12-3.4,24.57-12.59,30.63-36.42C239.63,95.24,244.85,66.1,232.7,50.48ZM92,208A28.12,28.12,0,0,1,88.86,152a8,8,0,1,0-1.76-15.9A43.64,43.64,0,0,0,66.36,144c-8.43.09-22-3.57-27.76-26.26C35.72,106.39,27,71.86,35.94,60.3,37.37,58.46,40.09,56,47,56c27.27,0,73,44.88,73,71.67V180A28,28,0,0,1,92,208ZM217.4,117.74c-5.77,22.69-19.33,26.34-27.77,26.26a43.6,43.6,0,0,0-20.74-7.95,8,8,0,1,0-1.76,15.9A28.11,28.11,0,1,1,136,180V127.67C136,100.88,181.69,56,209,56c6.95,0,9.66,2.46,11.1,4.3C229.05,71.86,220.28,106.39,217.4,117.74Z"
/>
</svg>
);
}import { PiButterfly } from "react-icons/pi";
export function Example() {
return <PiButterfly className="size-5" />;
}<svg
viewBox="0 0 256 256"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M232.7,50.48C229,45.7,221.84,40,209,40c-16.85,0-38.46,11.28-57.81,30.16A140.07,140.07,0,0,0,136,87.53V56a8,8,0,0,0-16,0V87.53a140.07,140.07,0,0,0-15.15-17.37C85.49,51.28,63.88,40,47,40,34.16,40,27,45.7,23.3,50.48c-6.82,8.77-12.18,24.08-.21,71.2,6.05,23.83,19.51,33,30.63,36.42A44,44,0,0,0,128,205.27a44,44,0,0,0,74.28-47.17c11.12-3.4,24.57-12.59,30.63-36.42C239.63,95.24,244.85,66.1,232.7,50.48ZM92,208A28.12,28.12,0,0,1,88.86,152a8,8,0,1,0-1.76-15.9A43.64,43.64,0,0,0,66.36,144c-8.43.09-22-3.57-27.76-26.26C35.72,106.39,27,71.86,35.94,60.3,37.37,58.46,40.09,56,47,56c27.27,0,73,44.88,73,71.67V180A28,28,0,0,1,92,208ZM217.4,117.74c-5.77,22.69-19.33,26.34-27.77,26.26a43.6,43.6,0,0,0-20.74-7.95,8,8,0,1,0-1.76,15.9A28.11,28.11,0,1,1,136,180V127.67C136,100.88,181.69,56,209,56c6.95,0,9.66,2.46,11.1,4.3C229.05,71.86,220.28,106.39,217.4,117.74Z"
/>
</svg>"Butterfly" icon from Phosphor Icons (https://github.com/phosphor-icons/core), licensed under MIT license.