Skip to content
Cuelark UI

Hover the icon or press Play. Suggested motion: nudge-down. Pick another to preview it and update the animated code:

VS Code Icons · VscCloudDownload

Cloud Download icon

A free cloud download 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
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/vscode-codicons/cloud-download.json
components/icons/vscode-codicons-cloud-download.tsx
import * as React from "react";

/**
 * Cloud Download from VS Code Icons (https://github.com/microsoft/vscode-codicons), CC BY 4.0.
 * Via Cuelark UI: ui.cuelark.com/icons/vscode-codicons/cloud-download. Sized in em, colored by currentColor.
 */
export function VscCloudDownloadIcon(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.854L11.854 13.854C11.806 13.902 11.751 13.938 11.692 13.963C11.634 13.987 11.57 14 11.504 14.001H11.498C11.431 14.001 11.368 13.987 11.31 13.963C11.252 13.939 11.197 13.903 11.15 13.857L11.147 13.854L9.147 11.854C8.952 11.659 8.952 11.342 9.147 11.147C9.342 10.952 9.659 10.952 9.854 11.147L11 12.294V9.001C11 8.725 11.224 8.501 11.5 8.501C11.776 8.501 12 8.725 12 9.001V12.294L13.146 11.147C13.341 10.952 13.658 10.952 13.853 11.147C14.048 11.342 14.048 11.659 13.853 11.854H13.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>
  );
}
With react-icons
import { VscCloudDownload } from "react-icons/vsc";

export function Example() {
  return <VscCloudDownload className="size-5" />;
}
cloud-download.svg
<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.854L11.854 13.854C11.806 13.902 11.751 13.938 11.692 13.963C11.634 13.987 11.57 14 11.504 14.001H11.498C11.431 14.001 11.368 13.987 11.31 13.963C11.252 13.939 11.197 13.903 11.15 13.857L11.147 13.854L9.147 11.854C8.952 11.659 8.952 11.342 9.147 11.147C9.342 10.952 9.659 10.952 9.854 11.147L11 12.294V9.001C11 8.725 11.224 8.501 11.5 8.501C11.776 8.501 12 8.725 12 9.001V12.294L13.146 11.147C13.341 10.952 13.658 10.952 13.853 11.147C14.048 11.342 14.048 11.659 13.853 11.854H13.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>
Attribution
"Cloud Download" icon from VS Code Icons (https://github.com/microsoft/vscode-codicons), licensed under CC BY 4.0 license.

Related icons: storage, weather, sync, upload

Cloud Download icon in other sets