Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:
Assistant icon
A free assistant icon from Flat Color 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/flat-color/assistant.jsonimport * as React from "react";
/**
* Assistant from Flat Color Icons (https://github.com/icons8/flat-color-icons), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/flat-color/assistant. Sized in em, colored by currentColor.
*/
export function FcAssistantIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
version="1"
viewBox="0 0 48 48"
enableBackground="new 0 0 48 48"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<g fill="#FFA726">
<circle cx="10" cy="26" r="4" />
<circle cx="38" cy="26" r="4" />
</g>
<path
fill="#FFB74D"
d="M39,19c0-12.7-30-8.3-30,0c0,1.8,0,8.2,0,10c0,8.3,6.7,15,15,15s15-6.7,15-15C39,27.2,39,20.8,39,19z"
/>
<path
fill="#FF5722"
d="M24,3C14.6,3,7,10.6,7,20c0,1.2,0,3.4,0,3.4L9,25v-3l21-9.8l9,9.8v3l2-1.6c0,0,0-2.1,0-3.4 C41,12,35.3,3,24,3z"
/>
<g fill="#784719">
<circle cx="31" cy="26" r="2" />
<circle cx="17" cy="26" r="2" />
</g>
<path
fill="#757575"
d="M43,24c-0.6,0-1,0.4-1,1v-7c0-8.8-7.2-16-16-16h-7c-0.6,0-1,0.4-1,1s0.4,1,1,1h7c7.7,0,14,6.3,14,14v10 c0,0.6,0.4,1,1,1s1-0.4,1-1v2c0,3.9-3.1,7-7,7H24c-0.6,0-1,0.4-1,1s0.4,1,1,1h11c5,0,9-4,9-9v-5C44,24.4,43.6,24,43,24z"
/>
<g fill="#37474F">
<path
d="M43,22h-1c-1.1,0-2,0.9-2,2v4c0,1.1,0.9,2,2,2h1c1.1,0,2-0.9,2-2v-4C45,22.9,44.1,22,43,22z"
/>
<circle cx="24" cy="38" r="2" />
</g>
</svg>
);
}import { FcAssistant } from "react-icons/fc";
export function Example() {
return <FcAssistant className="size-5" />;
}<svg
version="1"
viewBox="0 0 48 48"
enable-background="new 0 0 48 48"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<g fill="#FFA726">
<circle cx="10" cy="26" r="4" />
<circle cx="38" cy="26" r="4" />
</g>
<path
fill="#FFB74D"
d="M39,19c0-12.7-30-8.3-30,0c0,1.8,0,8.2,0,10c0,8.3,6.7,15,15,15s15-6.7,15-15C39,27.2,39,20.8,39,19z"
/>
<path
fill="#FF5722"
d="M24,3C14.6,3,7,10.6,7,20c0,1.2,0,3.4,0,3.4L9,25v-3l21-9.8l9,9.8v3l2-1.6c0,0,0-2.1,0-3.4 C41,12,35.3,3,24,3z"
/>
<g fill="#784719">
<circle cx="31" cy="26" r="2" />
<circle cx="17" cy="26" r="2" />
</g>
<path
fill="#757575"
d="M43,24c-0.6,0-1,0.4-1,1v-7c0-8.8-7.2-16-16-16h-7c-0.6,0-1,0.4-1,1s0.4,1,1,1h7c7.7,0,14,6.3,14,14v10 c0,0.6,0.4,1,1,1s1-0.4,1-1v2c0,3.9-3.1,7-7,7H24c-0.6,0-1,0.4-1,1s0.4,1,1,1h11c5,0,9-4,9-9v-5C44,24.4,43.6,24,43,24z"
/>
<g fill="#37474F">
<path
d="M43,22h-1c-1.1,0-2,0.9-2,2v4c0,1.1,0.9,2,2,2h1c1.1,0,2-0.9,2-2v-4C45,22.9,44.1,22,43,22z"
/>
<circle cx="24" cy="38" r="2" />
</g>
</svg>"Assistant" icon from Flat Color Icons (https://github.com/icons8/flat-color-icons), licensed under MIT license.