Mold icon

Use the Mold 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 { Mold24Regular, Mold24Filled } from "@fluentui/react-icons";

export function Example() {
  return <Mold24Regular aria-label="Mold" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_mold_24_regular.svg" width="24" height="24" alt="Mold">

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="M16.25 2.25C16.25 1.83579 15.9142 1.5 15.5 1.5C15.0858 1.5 14.75 1.83579 14.75 2.25V4.07392C13.8969 4.23171 13.081 4.64053 12.4212 5.30038L11.6411 6.08045L10.2803 4.71967C9.98744 4.42678 9.51256 4.42678 9.21967 4.71967C8.92678 5.01256 8.92678 5.48744 9.21967 5.78033L10.5805 7.14111L7.14111 10.5805L5.78033 9.21967C5.48744 8.92678 5.01256 8.92678 4.71967 9.21967C4.42678 9.51256 4.42678 9.98744 4.71967 10.2803L6.08045 11.6411L5.30251 12.4191C4.6421 13.0795 4.23315 13.8961 4.07565 14.75H2.25C1.83579 14.75 1.5 15.0858 1.5 15.5C1.5 15.9142 1.83579 16.25 2.25 16.25H4.05535C4.15892 16.9117 4.41237 17.5545 4.81569 18.1236L3.21967 19.7197C2.92678 20.0126 2.92678 20.4874 3.21967 20.7803C3.51256 21.0732 3.98744 21.0732 4.28033 20.7803L5.87591 19.1847C6.44505 19.5888 7.08802 19.8428 7.75 19.9468V21.75C7.75 22.1642 8.08579 22.5 8.5 22.5C8.91421 22.5 9.25 22.1642 9.25 21.75V19.9274C10.1048 19.7703 10.9225 19.3612 11.5835 18.7001L12.3615 17.9221L13.7197 19.2803C14.0126 19.5732 14.4874 19.5732 14.7803 19.2803C15.0732 18.9874 15.0732 18.5126 14.7803 18.2197L13.4221 16.8615L16.8615 13.4221L18.2197 14.7803C18.5126 15.0732 18.9874 15.0732 19.2803 14.7803C19.5732 14.4874 19.5732 14.0126 19.2803 13.7197L17.9221 12.3615L18.7022 11.5814C19.3627 10.9209 19.7717 10.1041 19.9291 9.25H21.75C22.1642 9.25 22.5 8.91421 22.5 8.5C22.5 8.08579 22.1642 7.75 21.75 7.75H19.9493C19.8455 7.08727 19.5914 6.44354 19.1869 5.87379L20.7803 4.28033C21.0732 3.98744 21.0732 3.51256 20.7803 3.21967C20.4874 2.92678 20.0126 2.92678 19.7197 3.21967L18.1258 4.81357C17.556 4.40981 16.9125 4.15625 16.25 4.05289V2.25ZM6.36317 13.4797L13.4818 6.36104C14.6305 5.21237 16.4929 5.21237 17.6415 6.36104C18.7902 7.50971 18.7902 9.37208 17.6415 10.5207L10.5229 17.6394C9.3742 18.7881 7.51184 18.7881 6.36317 17.6394C5.2145 16.4908 5.2145 14.6284 6.36317 13.4797ZM9.5 15.5C9.5 16.0523 9.05228 16.5 8.5 16.5C7.94772 16.5 7.5 16.0523 7.5 15.5C7.5 14.9477 7.94772 14.5 8.5 14.5C9.05228 14.5 9.5 14.9477 9.5 15.5ZM15.5 9.5C16.0523 9.5 16.5 9.05228 16.5 8.5C16.5 7.94772 16.0523 7.5 15.5 7.5C14.9477 7.5 14.5 7.94772 14.5 8.5C14.5 9.05228 14.9477 9.5 15.5 9.5Z" 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/mold_24_regular.svg";

Details

Keywords

allergiesallergensmoldfungus