Desk Sparkle icon

Use the Desk Sparkle 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 { DeskSparkle24Regular, DeskSparkle24Filled } from "@fluentui/react-icons";

export function Example() {
  return <DeskSparkle24Regular aria-label="Desk Sparkle" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_desk_sparkle_24_regular.svg" width="24" height="24" alt="Desk Sparkle">

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="M11.8242 4C11.7767 4.14856 11.7505 4.306 11.75 4.46875C11.7511 4.83569 11.8905 5.20478 12.1201 5.5H4.25C3.83579 5.5 3.5 5.83579 3.5 6.25V8H15.4678L15.75 8.99902C15.8139 9.18593 15.9119 9.35479 16.0352 9.5H12V17.25C12 18.7688 10.7688 20 9.25 20H4.75C3.23122 20 2 18.7688 2 17.25V6.25C2 5.00736 3.00736 4 4.25 4H11.8242ZM22 19.25C22 19.6642 21.6642 20 21.25 20C20.8358 20 20.5 19.6642 20.5 19.25V13.8311C20.6841 13.9661 20.9135 14.0498 21.21 14.0498C21.5521 14.0498 21.8043 13.9396 22 13.7666V19.25ZM3.5 17.25C3.5 17.9404 4.05964 18.5 4.75 18.5H9.25C9.94036 18.5 10.5 17.9404 10.5 17.25V9.5H3.5V17.25ZM8.25 11.5C8.66421 11.5 9 11.8358 9 12.25C9 12.6642 8.66421 13 8.25 13H5.75C5.33579 13 5 12.6642 5 12.25C5 11.8358 5.33579 11.5 5.75 11.5H8.25ZM21.2344 8C21.2969 8 21.3581 8.01957 21.4092 8.05566C21.4601 8.09167 21.4987 8.14242 21.5195 8.20117L21.7686 8.9668C21.8459 9.19921 21.9771 9.41079 22.1504 9.58398C22.3237 9.75703 22.5351 9.88761 22.7676 9.96484L23.5332 10.2129L23.5479 10.2168C23.6068 10.2376 23.6582 10.2762 23.6943 10.3271C23.7305 10.3782 23.75 10.4394 23.75 10.502C23.75 10.5645 23.7305 10.6257 23.6943 10.6768C23.6582 10.7276 23.6067 10.7664 23.5479 10.7871L22.7832 11.0352C22.5505 11.1124 22.3384 11.2428 22.165 11.416C21.9917 11.5892 21.8616 11.8008 21.7842 12.0332L21.5352 12.7988C21.5143 12.8575 21.4757 12.9083 21.4248 12.9443C21.3737 12.9804 21.3126 13 21.25 13C21.1874 13 21.1263 12.9804 21.0752 12.9443C21.0243 12.9083 20.9857 12.8575 20.9648 12.7988L20.7158 12.0332C20.639 11.8002 20.5092 11.5879 20.3359 11.4141C20.1625 11.2401 19.9499 11.1089 19.7168 11.0312L18.9521 10.7832C18.8932 10.7624 18.8418 10.7238 18.8057 10.6729C18.7695 10.6218 18.75 10.5606 18.75 10.498C18.75 10.4355 18.7695 10.3743 18.8057 10.3232C18.8418 10.2724 18.8933 10.2337 18.9521 10.2129L19.7168 9.96484C19.9466 9.88555 20.1556 9.75415 20.3262 9.58105C20.4968 9.40795 20.6253 9.19762 20.7012 8.9668L20.9492 8.20117C20.97 8.14249 21.0088 8.0917 21.0596 8.05566C21.1106 8.01962 21.1719 8.00006 21.2344 8ZM17.2227 0C17.3352 4.37205e-05 17.4452 0.0346543 17.5371 0.0996094C17.629 0.164603 17.6979 0.257194 17.7354 0.363281L18.1836 1.73926C18.3228 2.15781 18.558 2.5387 18.8701 2.85059C19.1822 3.16235 19.5627 3.39703 19.9814 3.53613L21.3594 3.9834L21.3867 3.99023C21.4929 4.02767 21.5853 4.0976 21.6504 4.18945C21.7153 4.28125 21.75 4.39149 21.75 4.50391C21.7499 4.61615 21.7152 4.72572 21.6504 4.81738C21.5853 4.90923 21.4929 4.97917 21.3867 5.0166L20.0088 5.46387C19.5901 5.603 19.2095 5.83765 18.8975 6.14941C18.5853 6.4613 18.3502 6.84219 18.2109 7.26074L17.7637 8.63672C17.7596 8.64816 17.7548 8.65981 17.75 8.6709C17.7105 8.7627 17.6465 8.84241 17.5645 8.90039C17.4725 8.96535 17.3626 9 17.25 9C17.1374 9 17.0275 8.96535 16.9355 8.90039C16.8436 8.83539 16.7738 8.74283 16.7363 8.63672L16.2891 7.26074C16.1879 6.95368 16.0348 6.66647 15.8379 6.41211C15.7657 6.3188 15.6873 6.22953 15.6035 6.14551C15.2915 5.83257 14.9106 5.59683 14.4912 5.45703L13.1133 5.00977C13.0071 4.97233 12.9147 4.9024 12.8496 4.81055C12.7847 4.71875 12.75 4.60851 12.75 4.49609C12.7501 4.38386 12.7848 4.27428 12.8496 4.18262C12.9147 4.09077 13.0071 4.02083 13.1133 3.9834L14.4912 3.53613C14.9048 3.39339 15.2799 3.15721 15.5869 2.8457C15.8856 2.54257 16.1123 2.17566 16.25 1.77344L16.2617 1.73926L16.709 0.363281C16.7464 0.257169 16.8163 0.164605 16.9082 0.0996094C17.0001 0.0347125 17.1101 0 17.2227 0Z" 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/desk_sparkle_24_regular.svg";

Details