Hover the icon or press Play. Suggested motion: float. Pick another to preview it and update the animated code:
Bubble icon
A free bubble icon from Simple Line 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
- thesabbir.github.io
npx shadcn@latest add https://ui.cuelark.com/r/icons/simple-line-icons/bubble.jsonimport * as React from "react";
/**
* Bubble from Simple Line Icons (https://thesabbir.github.io/simple-line-icons/), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/simple-line-icons/bubble. Sized in em, colored by currentColor.
*/
export function SlBubbleIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
viewBox="0 0 1024 1024"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
d="M512 128c247.024 0 448 143.553 448 320.001 0 176.432-200.976 320-448 320l-26.512.096c-17.584 0-29.088-.464-47.072-3.153l-35.856-5.12-23.008 27.84c-10.576 12.784-64.544 57.12-124.112 85.664 12.112-32.032 21.04-67.008 21.84-101.6l.32-1.904V725.2l-34.864-17.808C129.136 649.28 64 554.752 64 448c0-176.448 200.976-320 448-320zm0-63.999C229.2 64.001 0 235.936 0 448c0 132.064 78.256 247.152 213.584 316.336 0 .816-.256 1.408-.256 2.32 0 57.376-32.16 120.464-51.008 152.944h.048C160.88 923.09 160 926.913 160 931.01c0 16.08 12.96 28.992 29.008 28.992 2.416 0 6.256-.496 7.664-.496.336 0 .528 0 .496.095 100-16.336 209.952-104.688 231.824-131.344 22.48 3.344 37.664 3.84 56.48 3.84 7.936 0 16.496-.096 26.528-.096 282.752 0 512-171.904 512-384 0-212.064-229.248-384-512-383.999z"
/>
</svg>
);
}import { SlBubble } from "react-icons/sl";
export function Example() {
return <SlBubble className="size-5" />;
}<svg
viewBox="0 0 1024 1024"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M512 128c247.024 0 448 143.553 448 320.001 0 176.432-200.976 320-448 320l-26.512.096c-17.584 0-29.088-.464-47.072-3.153l-35.856-5.12-23.008 27.84c-10.576 12.784-64.544 57.12-124.112 85.664 12.112-32.032 21.04-67.008 21.84-101.6l.32-1.904V725.2l-34.864-17.808C129.136 649.28 64 554.752 64 448c0-176.448 200.976-320 448-320zm0-63.999C229.2 64.001 0 235.936 0 448c0 132.064 78.256 247.152 213.584 316.336 0 .816-.256 1.408-.256 2.32 0 57.376-32.16 120.464-51.008 152.944h.048C160.88 923.09 160 926.913 160 931.01c0 16.08 12.96 28.992 29.008 28.992 2.416 0 6.256-.496 7.664-.496.336 0 .528 0 .496.095 100-16.336 209.952-104.688 231.824-131.344 22.48 3.344 37.664 3.84 56.48 3.84 7.936 0 16.496-.096 26.528-.096 282.752 0 512-171.904 512-384 0-212.064-229.248-384-512-383.999z"
/>
</svg>"Bubble" icon from Simple Line Icons (https://thesabbir.github.io/simple-line-icons/), licensed under MIT license.