Cloud Desktop icon

Use the Cloud Desktop icon in React

Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.

npm install @fluentui/react-icons

import { CloudDesktop24Regular, CloudDesktop24Filled } from "@fluentui/react-icons";

export function Example() {
  return <CloudDesktop24Regular aria-label="Cloud Desktop" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_cloud_desktop_24_regular.svg" width="24" height="24" alt="Cloud Desktop">

Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:

<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M22 13C22.5523 13 23 13.4477 23 14V19C23 19.5523 22.5523 20 22 20H19V21.5H19.25C19.6642 21.5 20 21.8358 20 22.25C20 22.2751 19.9985 22.2998 19.9961 22.3242C19.9985 22.3412 20 22.3584 20 22.375C20 22.6511 19.6511 23 19.375 23H15.625C15.3489 23 15 22.6511 15 22.375C15 22.3584 15.0015 22.3412 15.0039 22.3242C15.0015 22.2998 15 22.2751 15 22.25C15 21.8358 15.3358 21.5 15.75 21.5H16V20H13C12.4477 20 12 19.5523 12 19V14C12 13.4477 12.4477 13 13 13H22ZM12 4C14.9798 4 17.4517 6.17205 17.9199 9.01953C19.6947 9.18387 21.1711 10.3786 21.7441 12H20.0947C19.5758 11.1042 18.6097 10.5 17.5 10.5H17.2441C16.8436 10.5 16.5139 10.1853 16.4951 9.78516C16.3833 7.39997 14.4132 5.5 12 5.5C9.58676 5.5 7.6167 7.39997 7.50488 9.78516C7.4861 10.1853 7.1564 10.5 6.75586 10.5H6.5C4.84315 10.5 3.5 11.8431 3.5 13.5C3.5 15.1569 4.84315 16.5 6.5 16.5H11V18H6.5C4.01472 18 2 15.9853 2 13.5C2 11.1564 3.79181 9.23142 6.08008 9.01953C6.54835 6.17206 9.02022 4 12 4Z" fill="currentColor"/></svg>

Use it from the SVG package

Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/cloud_desktop_24_regular.svg";

Details

Keywords

storageuploaddownloadsavesync