orientation image landscape to potrait icon

orientation-image-landscape-to-potrait from Huge Icons by Hugeicons · Stroke · MIT Free for personal and commercial use.

Name
orientation-image-landscape-to-potrait
Set
Huge Icons
Style
Stroke
Viewbox
24×24
License
MIT

Related icons in Huge Icons

Use the orientation image landscape to potrait icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path d="M12 9V8c0-2.357 0-3.536-.732-4.268S9.357 3 7 3s-3.536 0-4.268.732S2 5.643 2 8v6c0 .464 0 .697.03.891a2.5 2.5 0 0 0 2.08 2.079c.193.03.425.03.89.03"/><path d="m2 12l3.146-3.146a1.207 1.207 0 0 1 1.708 0L7.5 9.5m1-3.01v.01m9.5 8.49V15m-5 7h4c2.357 0 3.535 0 4.268-.732C22 20.535 22 19.357 22 17s0-3.536-.732-4.268C20.535 12 19.357 12 17 12h-4c-2.357 0-3.536 0-4.268.732S8 14.643 8 17s0 3.535.732 4.268S10.643 22 13 22"/><path d="m8.5 19.5l3.646-3.646a1.207 1.207 0 0 1 1.708 0l3.396 3.396l1.573-1.573a.604.604 0 0 1 .854 0L21.5 19.5M16 4.5h.5c1.875 0 2.812 0 3.47.477a2.5 2.5 0 0 1 .553.554C21 6.188 21 7.125 21 9m-3.5-7L15 4.5L17.5 7"/></g></svg>

React

import type { SVGProps } from "react";

export function HugeiconsOrientationImageLandscapeToPotrait(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5"><path d="M12 9V8c0-2.357 0-3.536-.732-4.268S9.357 3 7 3s-3.536 0-4.268.732S2 5.643 2 8v6c0 .464 0 .697.03.891a2.5 2.5 0 0 0 2.08 2.079c.193.03.425.03.89.03"/><path d="m2 12l3.146-3.146a1.207 1.207 0 0 1 1.708 0L7.5 9.5m1-3.01v.01m9.5 8.49V15m-5 7h4c2.357 0 3.535 0 4.268-.732C22 20.535 22 19.357 22 17s0-3.536-.732-4.268C20.535 12 19.357 12 17 12h-4c-2.357 0-3.536 0-4.268.732S8 14.643 8 17s0 3.535.732 4.268S10.643 22 13 22"/><path d="m8.5 19.5l3.646-3.646a1.207 1.207 0 0 1 1.708 0l3.396 3.396l1.573-1.573a.604.604 0 0 1 .854 0L21.5 19.5M16 4.5h.5c1.875 0 2.812 0 3.47.477a2.5 2.5 0 0 1 .553.554C21 6.188 21 7.125 21 9m-3.5-7L15 4.5L17.5 7"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"><path d="M12 9V8c0-2.357 0-3.536-.732-4.268S9.357 3 7 3s-3.536 0-4.268.732S2 5.643 2 8v6c0 .464 0 .697.03.891a2.5 2.5 0 0 0 2.08 2.079c.193.03.425.03.89.03"/><path d="m2 12l3.146-3.146a1.207 1.207 0 0 1 1.708 0L7.5 9.5m1-3.01v.01m9.5 8.49V15m-5 7h4c2.357 0 3.535 0 4.268-.732C22 20.535 22 19.357 22 17s0-3.536-.732-4.268C20.535 12 19.357 12 17 12h-4c-2.357 0-3.536 0-4.268.732S8 14.643 8 17s0 3.535.732 4.268S10.643 22 13 22"/><path d="m8.5 19.5l3.646-3.646a1.207 1.207 0 0 1 1.708 0l3.396 3.396l1.573-1.573a.604.604 0 0 1 .854 0L21.5 19.5M16 4.5h.5c1.875 0 2.812 0 3.47.477a2.5 2.5 0 0 1 .553.554C21 6.188 21 7.125 21 9m-3.5-7L15 4.5L17.5 7"/></g></svg>
</template>

CSS

.icon-orientation-image-landscape-to-potrait {
  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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M12%209V8c0-2.357%200-3.536-.732-4.268S9.357%203%207%203s-3.536%200-4.268.732S2%205.643%202%208v6c0%20.464%200%20.697.03.891a2.5%202.5%200%200%200%202.08%202.079c.193.03.425.03.89.03%22%2F%3E%3Cpath%20d%3D%22m2%2012l3.146-3.146a1.207%201.207%200%200%201%201.708%200L7.5%209.5m1-3.01v.01m9.5%208.49V15m-5%207h4c2.357%200%203.535%200%204.268-.732C22%2020.535%2022%2019.357%2022%2017s0-3.536-.732-4.268C20.535%2012%2019.357%2012%2017%2012h-4c-2.357%200-3.536%200-4.268.732S8%2014.643%208%2017s0%203.535.732%204.268S10.643%2022%2013%2022%22%2F%3E%3Cpath%20d%3D%22m8.5%2019.5l3.646-3.646a1.207%201.207%200%200%201%201.708%200l3.396%203.396l1.573-1.573a.604.604%200%200%201%20.854%200L21.5%2019.5M16%204.5h.5c1.875%200%202.812%200%203.47.477a2.5%202.5%200%200%201%20.553.554C21%206.188%2021%207.125%2021%209m-3.5-7L15%204.5L17.5%207%22%2F%3E%3C%2Fg%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%2024%2024%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22currentColor%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%221.5%22%3E%3Cpath%20d%3D%22M12%209V8c0-2.357%200-3.536-.732-4.268S9.357%203%207%203s-3.536%200-4.268.732S2%205.643%202%208v6c0%20.464%200%20.697.03.891a2.5%202.5%200%200%200%202.08%202.079c.193.03.425.03.89.03%22%2F%3E%3Cpath%20d%3D%22m2%2012l3.146-3.146a1.207%201.207%200%200%201%201.708%200L7.5%209.5m1-3.01v.01m9.5%208.49V15m-5%207h4c2.357%200%203.535%200%204.268-.732C22%2020.535%2022%2019.357%2022%2017s0-3.536-.732-4.268C20.535%2012%2019.357%2012%2017%2012h-4c-2.357%200-3.536%200-4.268.732S8%2014.643%208%2017s0%203.535.732%204.268S10.643%2022%2013%2022%22%2F%3E%3Cpath%20d%3D%22m8.5%2019.5l3.646-3.646a1.207%201.207%200%200%201%201.708%200l3.396%203.396l1.573-1.573a.604.604%200%200%201%20.854%200L21.5%2019.5M16%204.5h.5c1.875%200%202.812%200%203.47.477a2.5%202.5%200%200%201%20.553.554C21%206.188%2021%207.125%2021%209m-3.5-7L15%204.5L17.5%207%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/hugeicons/orientation-image-landscape-to-potrait.svg?color=%231a73e8&size=48