framed picture emoji

framed-picture from Emoji One (Colored) by Emoji One · Default · Objects · CC-BY-4.0 Attribution required.

Name
framed-picture
Set
Emoji One (Colored)
Style
Default
Category
Objects
Viewbox
64×64
License
CC BY 4.0

The same emoji in other sets

More objects icons from Emoji One (Colored)

Use the framed picture emoji

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#333" d="M2 4v56l30-28z"/><path fill="#697277" d="M62 4H2l30 28z"/><path fill="#333" d="M2 60h60L32 32z"/><path fill="#697277" d="m32 32l30 28V4z"/><path fill="#52595e" d="M5 7h54v50H5z"/><path fill="#697277" d="M9 11v42l23-21z"/><path fill="#333" d="M55 11H9l23 21z"/><path fill="#697277" d="M9 53h46L32 32z"/><path fill="#333" d="m32 32l23 21V11z"/><path fill="#42ade2" d="M16 18h32v18H16z"/><path fill="#fed0ac" d="M16 34.7h32V46H16z"/><circle cx="40.5" cy="24.5" r="3.8" fill="#ffce31"/><path fill="#89664c" d="M21.3 37.9L32 41V28.4z"/><path fill="#d3976e" d="M42.7 37.9L32 41V28.4z"/><path fill="#fff" d="M11 13v38h42V13zm36 32H17V19h30z"/><path fill="#bfb3a4" d="M12 14v36h40V14zm36.2 32.2H15.8V17.8h32.3v28.4z"/></svg>

React

import type { SVGProps } from "react";

export function EmojioneFramedPicture(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#333" d="M2 4v56l30-28z"/><path fill="#697277" d="M62 4H2l30 28z"/><path fill="#333" d="M2 60h60L32 32z"/><path fill="#697277" d="m32 32l30 28V4z"/><path fill="#52595e" d="M5 7h54v50H5z"/><path fill="#697277" d="M9 11v42l23-21z"/><path fill="#333" d="M55 11H9l23 21z"/><path fill="#697277" d="M9 53h46L32 32z"/><path fill="#333" d="m32 32l23 21V11z"/><path fill="#42ade2" d="M16 18h32v18H16z"/><path fill="#fed0ac" d="M16 34.7h32V46H16z"/><circle cx="40.5" cy="24.5" r="3.8" fill="#ffce31"/><path fill="#89664c" d="M21.3 37.9L32 41V28.4z"/><path fill="#d3976e" d="M42.7 37.9L32 41V28.4z"/><path fill="#fff" d="M11 13v38h42V13zm36 32H17V19h30z"/><path fill="#bfb3a4" d="M12 14v36h40V14zm36.2 32.2H15.8V17.8h32.3v28.4z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 64 64"><path fill="#333" d="M2 4v56l30-28z"/><path fill="#697277" d="M62 4H2l30 28z"/><path fill="#333" d="M2 60h60L32 32z"/><path fill="#697277" d="m32 32l30 28V4z"/><path fill="#52595e" d="M5 7h54v50H5z"/><path fill="#697277" d="M9 11v42l23-21z"/><path fill="#333" d="M55 11H9l23 21z"/><path fill="#697277" d="M9 53h46L32 32z"/><path fill="#333" d="m32 32l23 21V11z"/><path fill="#42ade2" d="M16 18h32v18H16z"/><path fill="#fed0ac" d="M16 34.7h32V46H16z"/><circle cx="40.5" cy="24.5" r="3.8" fill="#ffce31"/><path fill="#89664c" d="M21.3 37.9L32 41V28.4z"/><path fill="#d3976e" d="M42.7 37.9L32 41V28.4z"/><path fill="#fff" d="M11 13v38h42V13zm36 32H17V19h30z"/><path fill="#bfb3a4" d="M12 14v36h40V14zm36.2 32.2H15.8V17.8h32.3v28.4z"/></svg>
</template>

CSS

.icon-framed-picture {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2064%2064%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M2%204v56l30-28z%22%2F%3E%3Cpath%20fill%3D%22%23697277%22%20d%3D%22M62%204H2l30%2028z%22%2F%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M2%2060h60L32%2032z%22%2F%3E%3Cpath%20fill%3D%22%23697277%22%20d%3D%22m32%2032l30%2028V4z%22%2F%3E%3Cpath%20fill%3D%22%2352595e%22%20d%3D%22M5%207h54v50H5z%22%2F%3E%3Cpath%20fill%3D%22%23697277%22%20d%3D%22M9%2011v42l23-21z%22%2F%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M55%2011H9l23%2021z%22%2F%3E%3Cpath%20fill%3D%22%23697277%22%20d%3D%22M9%2053h46L32%2032z%22%2F%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22m32%2032l23%2021V11z%22%2F%3E%3Cpath%20fill%3D%22%2342ade2%22%20d%3D%22M16%2018h32v18H16z%22%2F%3E%3Cpath%20fill%3D%22%23fed0ac%22%20d%3D%22M16%2034.7h32V46H16z%22%2F%3E%3Ccircle%20cx%3D%2240.5%22%20cy%3D%2224.5%22%20r%3D%223.8%22%20fill%3D%22%23ffce31%22%2F%3E%3Cpath%20fill%3D%22%2389664c%22%20d%3D%22M21.3%2037.9L32%2041V28.4z%22%2F%3E%3Cpath%20fill%3D%22%23d3976e%22%20d%3D%22M42.7%2037.9L32%2041V28.4z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M11%2013v38h42V13zm36%2032H17V19h30z%22%2F%3E%3Cpath%20fill%3D%22%23bfb3a4%22%20d%3D%22M12%2014v36h40V14zm36.2%2032.2H15.8V17.8h32.3v28.4z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2064%2064%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M2%204v56l30-28z%22%2F%3E%3Cpath%20fill%3D%22%23697277%22%20d%3D%22M62%204H2l30%2028z%22%2F%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M2%2060h60L32%2032z%22%2F%3E%3Cpath%20fill%3D%22%23697277%22%20d%3D%22m32%2032l30%2028V4z%22%2F%3E%3Cpath%20fill%3D%22%2352595e%22%20d%3D%22M5%207h54v50H5z%22%2F%3E%3Cpath%20fill%3D%22%23697277%22%20d%3D%22M9%2011v42l23-21z%22%2F%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M55%2011H9l23%2021z%22%2F%3E%3Cpath%20fill%3D%22%23697277%22%20d%3D%22M9%2053h46L32%2032z%22%2F%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22m32%2032l23%2021V11z%22%2F%3E%3Cpath%20fill%3D%22%2342ade2%22%20d%3D%22M16%2018h32v18H16z%22%2F%3E%3Cpath%20fill%3D%22%23fed0ac%22%20d%3D%22M16%2034.7h32V46H16z%22%2F%3E%3Ccircle%20cx%3D%2240.5%22%20cy%3D%2224.5%22%20r%3D%223.8%22%20fill%3D%22%23ffce31%22%2F%3E%3Cpath%20fill%3D%22%2389664c%22%20d%3D%22M21.3%2037.9L32%2041V28.4z%22%2F%3E%3Cpath%20fill%3D%22%23d3976e%22%20d%3D%22M42.7%2037.9L32%2041V28.4z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M11%2013v38h42V13zm36%2032H17V19h30z%22%2F%3E%3Cpath%20fill%3D%22%23bfb3a4%22%20d%3D%22M12%2014v36h40V14zm36.2%2032.2H15.8V17.8h32.3v28.4z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/emojione/framed-picture.svg?color=%231a73e8&size=48