Print icon
Used to represent a physical or digital printer. The Print icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Print 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 { Print24Regular, Print24Filled } from "@fluentui/react-icons";
export function Example() {
return <Print24Regular aria-label="Print" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_print_24_regular.svg" width="24" height="24" alt="Print"> 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="M15.7525 3C16.9951 3 18.0025 4.00736 18.0025 5.25L18.002 6.003L18.7525 6.00358C20.5469 6.00533 22.0011 7.45877 22.0038 9.25244L22.0071 15.2497C22.009 16.4918 21.0021 17.5002 19.7591 17.5009L18 17.5V18.75C18 19.9926 16.9926 21 15.75 21H8.25C7.00736 21 6 19.9926 6 18.75L6.00091 17.5L4.25 17.5001C3.00736 17.5001 2 16.4927 2 15.2501V9.25358C2 7.45865 3.45507 6.00358 5.25 6.00358L5.999 6.003L6 5.25C6 4.00736 7.00736 3 8.25 3H15.7525ZM15.75 13.5H8.25C7.83579 13.5 7.5 13.8358 7.5 14.25V18.75C7.5 19.1642 7.83579 19.5 8.25 19.5H15.75C16.1642 19.5 16.5 19.1642 16.5 18.75V14.25C16.5 13.8358 16.1642 13.5 15.75 13.5ZM18.7518 7.50358H5.25C4.2835 7.50358 3.5 8.28708 3.5 9.25358V15.2501C3.5 15.6643 3.83579 16.0001 4.25 16.0001L6 16V14.25C6 13.0074 7.00736 12 8.25 12H15.75C16.9926 12 18 13.0074 18 14.25L18.0009 16.0001L19.7827 16.0005C20.1855 15.9874 20.5077 15.6567 20.5071 15.2512L20.5038 9.25398C20.5024 8.28801 19.7185 7.50452 18.7518 7.50358ZM15.7525 4.5H8.25C7.83579 4.5 7.5 4.83579 7.5 5.25L7.499 6.003H16.502L16.5025 5.25C16.5025 4.83579 16.1667 4.5 15.7525 4.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/print_24_regular.svg";Details
| Name | |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_print_24_regular.svg |
| Filled file | ic_fluent_print_24_filled.svg |
| React components | Print24Regular, Print24Filled |
| License | MIT (© Microsoft Corporation) |