ICONYZ
English
Image Duotone icon from Phosphor

Image Duotone icon

ph:image-duotone

The Image Duotone icon (ph:image-duotone) 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, imageduotone
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><g fill="currentColor"><path d="M224 56v122.06l-39.72-39.72a8 8 0 0 0-11.31 0L147.31 164l-49.65-49.66a8 8 0 0 0-11.32 0L32 168.69V56a8 8 0 0 1 8-8h176a8 8 0 0 1 8 8" opacity=".2"/><path 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"/></g></svg>

How to use the Image Duotone icon

React

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

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

Vue

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

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

Svelte

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

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

Tailwind CSS

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

UnoCSS

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

Web component

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

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

HTML image

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

Related icons in Phosphor

image icon
image
 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-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 Duotone icon in other icon sets

Image Duotone icon from Keyline Icons
Keyline Icons
 Image Duotone icon from Lucide Extended
Lucide Extended
 Image Duotone icon from Stash Icons
Stash Icons

Image Duotone icon FAQ

Is the Image Duotone 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 Duotone icon in React?

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

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

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

Browse all Phosphor icons →