Production icon

Use the Production 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 { Production24Regular, Production24Filled } from "@fluentui/react-icons";

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

Use it in HTML

Reference the SVG file directly:

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

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="M6.25 3.5C5.2835 3.5 4.5 4.2835 4.5 5.25V7.75C4.5 8.7165 5.2835 9.5 6.25 9.5H8.75C9.7165 9.5 10.5 8.7165 10.5 7.75V5.25C10.5 4.2835 9.7165 3.5 8.75 3.5H6.25ZM13.5 5.25C13.5 4.2835 14.2835 3.5 15.25 3.5H17.75C18.7165 3.5 19.5 4.2835 19.5 5.25V7.75C19.5 8.7165 18.7165 9.5 17.75 9.5H15.25C14.2835 9.5 13.5 8.7165 13.5 7.75V5.25ZM15.25 5C15.1119 5 15 5.11193 15 5.25V7.75C15 7.88807 15.1119 8 15.25 8H17.75C17.8881 8 18 7.88807 18 7.75V5.25C18 5.11193 17.8881 5 17.75 5H15.25ZM7 17.5C7.82843 17.5 8.5 16.8284 8.5 16C8.5 15.1716 7.82843 14.5 7 14.5C6.17157 14.5 5.5 15.1716 5.5 16C5.5 16.8284 6.17157 17.5 7 17.5ZM13.5 16C13.5 16.8284 12.8284 17.5 12 17.5C11.1716 17.5 10.5 16.8284 10.5 16C10.5 15.1716 11.1716 14.5 12 14.5C12.8284 14.5 13.5 15.1716 13.5 16ZM17 17.5C17.8284 17.5 18.5 16.8284 18.5 16C18.5 15.1716 17.8284 14.5 17 14.5C16.1716 14.5 15.5 15.1716 15.5 16C15.5 16.8284 16.1716 17.5 17 17.5ZM2 16C2 13.5147 4.01472 11.5 6.5 11.5H17.5C19.9853 11.5 22 13.5147 22 16C22 18.4853 19.9853 20.5 17.5 20.5H6.5C4.01472 20.5 2 18.4853 2 16ZM6.5 13C4.84315 13 3.5 14.3431 3.5 16C3.5 17.6569 4.84315 19 6.5 19H17.5C19.1569 19 20.5 17.6569 20.5 16C20.5 14.3431 19.1569 13 17.5 13H6.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/production_24_regular.svg";

Details

Keywords

businessmanufacturefactoryconstructionproductshipping