ICONYZ
English
Image icon from Phosphor

Image icon

ph:image

The Image icon (ph:image) is a free SVG icon from the Phosphor set by Phosphor Icons. It is drawn on a 256 × 256 grid. Phosphor 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
Phosphor
Author
Phosphor Icons
License
MIT
Size
256 × 256
Tags
updated, pictures, photographs, photography, wallpapers, gallery, landscape
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><path fill="currentColor" d="M216 40H40a16 16 0 0 0-16 16v144a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V56a16 16 0 0 0-16-16m0 16v102.75l-26.07-26.06a16 16 0 0 0-22.63 0l-20 20l-44-44a16 16 0 0 0-22.62 0L40 149.37V56ZM40 172l52-52l80 80H40Zm176 28h-21.37l-36-36l20-20L216 181.38zm-72-100a12 12 0 1 1 12 12a12 12 0 0 1-12-12"/></svg>

How to use the Image icon

React

import { Icon } from "@iconify/react";

<Icon icon="ph:image" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="ph:image" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="ph:image" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[ph--image]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/ph -->
<div class="i-ph:image"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="ph:image"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/ph/image.svg" alt="Image icon" width="24" height="24">

Related icons in Phosphor

image-bold icon
image-bold
 image-broken icon
image-broken
 image-broken-bold icon
image-broken-bold
 image-broken-duotone icon
image-broken-duotone
 image-broken-fill icon
image-broken-fill
 image-broken-light icon
image-broken-light
 image-broken-thin icon
image-broken-thin
 image-duotone icon
image-duotone
 image-fill icon
image-fill
 image-light icon
image-light
 image-square icon
image-square
 image-square-bold icon
image-square-bold
 image-square-duotone icon
image-square-duotone
 image-square-fill icon
image-square-fill
 image-square-light icon
image-square-light
 image-square-thin icon
image-square-thin
 image-thin icon
image-thin
 images icon
images
 images-bold icon
images-bold
 images-duotone icon
images-duotone
 images-fill icon
images-fill
 images-light icon
images-light
 images-square icon
images-square
 images-square-bold icon
images-square-bold

Image icon in other icon sets

Image icon from Material Design Icons
Material Design Icons
 Image icon from Lucide
Lucide
 Image icon from Font Awesome 6 Solid
Font Awesome 6 Solid
 Image icon from Material Symbols
Material Symbols
 Image icon from Bootstrap Icons
Bootstrap Icons
 Image icon from Carbon
Carbon
 Image icon from @icons
@icons
 Image icon from Akar Icons
Akar Icons
 Image icon from BoxIcons v2
BoxIcons v2
 Image icon from BoxIcons v2 Solid
BoxIcons v2 Solid
 Image icon from Boxicons
Boxicons
 Image icon from Catppuccin Icons
Catppuccin Icons

Image icon FAQ

Is the Image icon free for commercial use?

Yes. Phosphor icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Image icon in React?

Install @iconify/react and render <Icon icon="ph:image" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Image icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/ph/image.svg" alt="Image icon">, or paste the SVG code inline to style it with CSS.

Browse all Phosphor icons →