Edit Image icon
flat-color-icons:edit-image
The Edit Image icon (flat-color-icons:edit-image) is a free SVG icon from the Flat Color Icons set by Icons8. It is drawn on a 48 × 48 grid. Flat Color Icons are released under the MIT license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.
- Icon set
- Flat Color Icons
- Author
- Icons8
- License
- MIT
- Size
- 48 × 48
- Tags
- editimage
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><path fill="#8CBCD6" d="M31 41H8c-2.2 0-4-1.8-4-4V11c0-2.2 1.8-4 4-4h32c2.2 0 4 1.8 4 4v17c0 7.2-5.8 13-13 13"/><circle cx="35" cy="16" r="3" fill="#B3DDF5"/><path fill="#9AC9E3" d="M20 16L9 32h22z"/><path fill="#B3DDF5" d="m31 22l-8 10h16z"/><path fill="#E57373" d="m47.7 29.1l-2.8-2.8c-.4-.4-1.1-.4-1.6 0L42 27.6l4.4 4.4l1.3-1.3c.4-.4.4-1.1 0-1.6"/><path fill="#FF9800" d="M27.467 42.167L39.77 29.865l4.384 4.384L31.85 46.55z"/><path fill="#B0BEC5" d="m46.4 32.038l-2.192 2.192l-4.383-4.384l2.192-2.191z"/><path fill="#FFC107" d="M27.5 42.2L26 48l5.8-1.5z"/><path fill="#37474F" d="m26.7 45l-.7 3l3-.7z"/></svg>How to use the Edit Image icon
React
import { Icon } from "@iconify/react";
<Icon icon="flat-color-icons:edit-image" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="flat-color-icons:edit-image" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="flat-color-icons:edit-image" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[flat-color-icons--edit-image]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/flat-color-icons -->
<div class="i-flat-color-icons:edit-image"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="flat-color-icons:edit-image"></iconify-icon>HTML image
<img src="https://iconyz.com/api/public/svg/flat-color-icons/edit-image.svg" alt="Edit Image icon" width="24" height="24">Edit Image icon in other icon sets
Edit Image icon FAQ
Is the Edit Image icon free for commercial use?
Yes. Flat Color Icons are released under the MIT license, which allows use in personal and commercial projects.
How do I use the Edit Image icon in React?
Install @iconify/react and render <Icon icon="flat-color-icons:edit-image" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Edit Image icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/flat-color-icons/edit-image.svg" alt="Edit Image icon">, or paste the SVG code inline to style it with CSS.