orange slice icon

orange-slice from Phosphor by Phosphor Icons · Regular · MIT Free for personal and commercial use.

Name: orange-slice
Set: Phosphor
Style: Regular
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

orange-slice-bold orange-slice-duotone orange-slice-fill orange-slice-light orange-slice-thin

The same icon in other sets

Use the orange slice icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M248 80H8a8 8 0 0 0-8 8a128 128 0 0 0 256 0a8 8 0 0 0-8-8M77.4 149.91l42.6-42.6v60.29a79.6 79.6 0 0 1-42.6-17.69M66.09 138.6A79.6 79.6 0 0 1 48.4 96h60.29ZM136 107.31l42.6 42.6A79.6 79.6 0 0 1 136 167.6Zm53.91 31.29L147.31 96h60.29a79.6 79.6 0 0 1-17.69 42.6M128 200A112.15 112.15 0 0 1 16.28 96h16.06a96 96 0 0 0 191.32 0h16.06A112.15 112.15 0 0 1 128 200"/></svg>

React

import type { SVGProps } from "react";

export function PhOrangeSlice(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M248 80H8a8 8 0 0 0-8 8a128 128 0 0 0 256 0a8 8 0 0 0-8-8M77.4 149.91l42.6-42.6v60.29a79.6 79.6 0 0 1-42.6-17.69M66.09 138.6A79.6 79.6 0 0 1 48.4 96h60.29ZM136 107.31l42.6 42.6A79.6 79.6 0 0 1 136 167.6Zm53.91 31.29L147.31 96h60.29a79.6 79.6 0 0 1-17.69 42.6M128 200A112.15 112.15 0 0 1 16.28 96h16.06a96 96 0 0 0 191.32 0h16.06A112.15 112.15 0 0 1 128 200"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M248 80H8a8 8 0 0 0-8 8a128 128 0 0 0 256 0a8 8 0 0 0-8-8M77.4 149.91l42.6-42.6v60.29a79.6 79.6 0 0 1-42.6-17.69M66.09 138.6A79.6 79.6 0 0 1 48.4 96h60.29ZM136 107.31l42.6 42.6A79.6 79.6 0 0 1 136 167.6Zm53.91 31.29L147.31 96h60.29a79.6 79.6 0 0 1-17.69 42.6M128 200A112.15 112.15 0 0 1 16.28 96h16.06a96 96 0 0 0 191.32 0h16.06A112.15 112.15 0 0 1 128 200"/></svg>
</template>

CSS

.icon-orange-slice {
  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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M248%2080H8a8%208%200%200%200-8%208a128%20128%200%200%200%20256%200a8%208%200%200%200-8-8M77.4%20149.91l42.6-42.6v60.29a79.6%2079.6%200%200%201-42.6-17.69M66.09%20138.6A79.6%2079.6%200%200%201%2048.4%2096h60.29ZM136%20107.31l42.6%2042.6A79.6%2079.6%200%200%201%20136%20167.6Zm53.91%2031.29L147.31%2096h60.29a79.6%2079.6%200%200%201-17.69%2042.6M128%20200A112.15%20112.15%200%200%201%2016.28%2096h16.06a96%2096%200%200%200%20191.32%200h16.06A112.15%20112.15%200%200%201%20128%20200%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M248%2080H8a8%208%200%200%200-8%208a128%20128%200%200%200%20256%200a8%208%200%200%200-8-8M77.4%20149.91l42.6-42.6v60.29a79.6%2079.6%200%200%201-42.6-17.69M66.09%20138.6A79.6%2079.6%200%200%201%2048.4%2096h60.29ZM136%20107.31l42.6%2042.6A79.6%2079.6%200%200%201%20136%20167.6Zm53.91%2031.29L147.31%2096h60.29a79.6%2079.6%200%200%201-17.69%2042.6M128%20200A112.15%20112.15%200%200%201%2016.28%2096h16.06a96%2096%200%200%200%20191.32%200h16.06A112.15%20112.15%200%200%201%20128%20200%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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