Hover the icon or press Play. Suggested motion: nudge-up. Pick another to preview it and update the animated code:
Cloud Upload icon
A free cloud upload icon from VS Code 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
- CC BY 4.0 license
- Project
- github.com
npx shadcn@latest add https://ui.cuelark.com/r/icons/vscode-codicons/cloud-upload.jsonimport * as React from "react";
/**
* Cloud Upload from VS Code Icons (https://github.com/microsoft/vscode-codicons), CC BY 4.0.
* Via Cuelark UI: ui.cuelark.com/icons/vscode-codicons/cloud-upload. Sized in em, colored by currentColor.
*/
export function VscCloudUploadIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
viewBox="0 0 16 16"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
d="M11.5 7C9.015 7 7 9.015 7 11.5C7 13.985 9.015 16 11.5 16C13.985 16 16 13.985 16 11.5C16 9.015 13.985 7 11.5 7ZM13.854 11.854C13.659 12.049 13.342 12.049 13.147 11.854L12.001 10.708V14.001C12.001 14.277 11.777 14.501 11.501 14.501C11.225 14.501 11.001 14.277 11.001 14.001V10.708L9.855 11.854C9.66 12.049 9.343 12.049 9.148 11.854C8.953 11.659 8.953 11.342 9.148 11.147L11.148 9.147C11.196 9.099 11.251 9.063 11.31 9.039C11.368 9.015 11.432 9.001 11.498 9.001H11.504C11.571 9.001 11.634 9.015 11.692 9.039C11.75 9.063 11.805 9.099 11.852 9.145L11.855 9.148L13.855 11.148C14.05 11.343 14.05 11.66 13.855 11.855L13.854 11.854ZM4.25 12H6V13H4.25C2.455 13 1 11.545 1 9.75C1 8.029 2.338 6.62 4.03 6.507C4.273 4.53 5.958 3 8 3C9.862 3 11.411 4.278 11.857 6H10.811C10.397 4.838 9.303 4 8 4C6.343 4 5 5.343 5 7C5 7.276 4.776 7.5 4.5 7.5H4.25C3.007 7.5 2 8.507 2 9.75C2 10.993 3.007 12 4.25 12Z"
/>
</svg>
);
}import { VscCloudUpload } from "react-icons/vsc";
export function Example() {
return <VscCloudUpload className="size-5" />;
}<svg
viewBox="0 0 16 16"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M11.5 7C9.015 7 7 9.015 7 11.5C7 13.985 9.015 16 11.5 16C13.985 16 16 13.985 16 11.5C16 9.015 13.985 7 11.5 7ZM13.854 11.854C13.659 12.049 13.342 12.049 13.147 11.854L12.001 10.708V14.001C12.001 14.277 11.777 14.501 11.501 14.501C11.225 14.501 11.001 14.277 11.001 14.001V10.708L9.855 11.854C9.66 12.049 9.343 12.049 9.148 11.854C8.953 11.659 8.953 11.342 9.148 11.147L11.148 9.147C11.196 9.099 11.251 9.063 11.31 9.039C11.368 9.015 11.432 9.001 11.498 9.001H11.504C11.571 9.001 11.634 9.015 11.692 9.039C11.75 9.063 11.805 9.099 11.852 9.145L11.855 9.148L13.855 11.148C14.05 11.343 14.05 11.66 13.855 11.855L13.854 11.854ZM4.25 12H6V13H4.25C2.455 13 1 11.545 1 9.75C1 8.029 2.338 6.62 4.03 6.507C4.273 4.53 5.958 3 8 3C9.862 3 11.411 4.278 11.857 6H10.811C10.397 4.838 9.303 4 8 4C6.343 4 5 5.343 5 7C5 7.276 4.776 7.5 4.5 7.5H4.25C3.007 7.5 2 8.507 2 9.75C2 10.993 3.007 12 4.25 12Z"
/>
</svg>"Cloud Upload" icon from VS Code Icons (https://github.com/microsoft/vscode-codicons), licensed under CC BY 4.0 license.