Hover the icon or press Play. Suggested motion: pop. Pick another to preview it and update the animated code:
Switch Camera icon
A free switch camera 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/switch-camera.jsonimport * as React from "react";
/**
* Switch Camera from Flat Color Icons (https://github.com/icons8/flat-color-icons), MIT.
* Via Cuelark UI: ui.cuelark.com/icons/flat-color/switch-camera. Sized in em, colored by currentColor.
*/
export function FcSwitchCameraIcon(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="#5E35B1">
<path
d="M33.9,12.1H14.2L17.6,7c0.4-0.6,1-0.9,1.7-0.9h9.6c0.7,0,1.3,0.3,1.7,0.9L33.9,12.1z"
/>
<path d="M14,11H8V9.2C8,8.5,8.5,8,9.2,8h3.6C13.5,8,14,8.5,14,9.2V11z" />
<path
d="M40,42H8c-2.2,0-4-1.8-4-4V14c0-2.2,1.8-4,4-4h32c2.2,0,4,1.8,4,4v24C44,40.2,42.2,42,40,42z"
/>
</g>
<path
fill="#E8EAF6"
d="M34,25c0-5.5-4.5-10-10-10c-2.4,0-4.6,0.8-6.3,2.2l1.2,1.6c1.4-1.1,3.1-1.8,5.1-1.8c4.4,0,8,3.6,8,8h-3.5 l4.5,5.6l4.5-5.6H34z"
/>
<path
fill="#E8EAF6"
d="M29.1,31.2C27.7,32.3,25.9,33,24,33c-4.4,0-8-3.6-8-8h3.5L15,19.4L10.5,25H14c0,5.5,4.5,10,10,10 c2.4,0,4.6-0.8,6.3-2.2L29.1,31.2z"
/>
</svg>
);
}import { FcSwitchCamera } from "react-icons/fc";
export function Example() {
return <FcSwitchCamera 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="#5E35B1">
<path
d="M33.9,12.1H14.2L17.6,7c0.4-0.6,1-0.9,1.7-0.9h9.6c0.7,0,1.3,0.3,1.7,0.9L33.9,12.1z"
/>
<path d="M14,11H8V9.2C8,8.5,8.5,8,9.2,8h3.6C13.5,8,14,8.5,14,9.2V11z" />
<path
d="M40,42H8c-2.2,0-4-1.8-4-4V14c0-2.2,1.8-4,4-4h32c2.2,0,4,1.8,4,4v24C44,40.2,42.2,42,40,42z"
/>
</g>
<path
fill="#E8EAF6"
d="M34,25c0-5.5-4.5-10-10-10c-2.4,0-4.6,0.8-6.3,2.2l1.2,1.6c1.4-1.1,3.1-1.8,5.1-1.8c4.4,0,8,3.6,8,8h-3.5 l4.5,5.6l4.5-5.6H34z"
/>
<path
fill="#E8EAF6"
d="M29.1,31.2C27.7,32.3,25.9,33,24,33c-4.4,0-8-3.6-8-8h3.5L15,19.4L10.5,25H14c0,5.5,4.5,10,10,10 c2.4,0,4.6-0.8,6.3-2.2L29.1,31.2z"
/>
</svg>"Switch Camera" icon from Flat Color Icons (https://github.com/icons8/flat-color-icons), licensed under MIT license.