Image Copy icon
Used to represent images in content and photo editing scenarios. The Image Copy 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 Image Copy 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 { ImageCopy24Regular, ImageCopy24Filled } from "@fluentui/react-icons";
export function Example() {
return <ImageCopy24Regular aria-label="Image Copy" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_image_copy_24_regular.svg" width="24" height="24" alt="Image Copy"> 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="M4.50678 6.00782C3.60124 6.58285 3 7.59621 3 8.75V15.25C3 18.1495 5.3505 20.5 8.25 20.5H14.75C15.9038 20.5 16.9172 19.8988 17.4939 18.9925L17.3717 18.9982L17.25 19H8.25C6.17893 19 4.5 17.3211 4.5 15.25V6.25C4.5 6.16872 4.50228 6.08798 4.50678 6.00782ZM8.75 3C6.95507 3 5.5 4.45507 5.5 6.25V14.75C5.5 16.5449 6.95507 18 8.75 18H17.25C19.0449 18 20.5 16.5449 20.5 14.75V6.25C20.5 4.45507 19.0449 3 17.25 3H8.75ZM13.4309 12.1373L13.523 12.2137L17.8295 16.4018C17.6481 16.4654 17.4531 16.5 17.25 16.5H8.75C8.54688 16.5 8.35185 16.4654 8.17047 16.4018L12.4774 12.2137C12.7394 11.959 13.141 11.9335 13.4309 12.1373ZM8.75 4.5H17.25C18.2165 4.5 19 5.2835 19 6.25V14.75C19 14.9588 18.9634 15.159 18.8964 15.3447L14.5687 11.1382C13.739 10.3316 12.4428 10.2913 11.5665 11.0172L11.4318 11.1382L7.10399 15.3457C7.03669 15.1597 7 14.9592 7 14.75V6.25C7 5.2835 7.7835 4.5 8.75 4.5ZM15.4996 6.75116C14.8096 6.75116 14.2503 7.31048 14.2503 8.00045C14.2503 8.69041 14.8096 9.24974 15.4996 9.24974C16.1895 9.24974 16.7488 8.69041 16.7488 8.00045C16.7488 7.31048 16.1895 6.75116 15.4996 6.75116Z" 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/image_copy_24_regular.svg";Details
| Name | Image Copy |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_image_copy_24_regular.svg |
| Filled file | ic_fluent_image_copy_24_filled.svg |
| React components | ImageCopy24Regular, ImageCopy24Filled |
| License | MIT (© Microsoft Corporation) |