aperture icon

aperture from Phosphor by Phosphor Icons · Regular · MIT Free for personal and commercial use.

Name: aperture
Set: Phosphor
Style: Regular
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

aperture-bold aperture-duotone aperture-fill aperture-light aperture-thin

The same icon in other sets

apertureBoxIcons v2 apertureCarbon apertureFeather Icons apertureHuge Icons apertureIonIcons apertureJam Icons apertureLucide apertureTabler Icons

Use the aperture icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M201.54 54.46A104 104 0 0 0 54.46 201.54A104 104 0 0 0 201.54 54.46m-11.31 11.32a88 88 0 0 1 11 13.48L167.55 119l-27.92-78.22a87.34 87.34 0 0 1 50.6 25M155.59 133l-18.16 21.37l-27.59-5l-9.43-26.37l18.16-21.37l27.59 5ZM65.77 65.78a87.34 87.34 0 0 1 56.66-25.59l17.51 49L58.3 74.32a88 88 0 0 1 7.47-8.54m-19.12 95.76a88.4 88.4 0 0 1 2.53-72.62l51.21 9.35Zm19.12 28.68a88 88 0 0 1-11-13.48L88.45 137l27.92 78.18a87.34 87.34 0 0 1-50.6-24.96m124.46 0a87.34 87.34 0 0 1-56.66 25.59l-17.51-49l81.64 14.91a88 88 0 0 1-7.47 8.5m-34.62-32.49l53.74-63.27a88.4 88.4 0 0 1-2.53 72.62Z"/></svg>

React

import type { SVGProps } from "react";

export function PhAperture(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="M201.54 54.46A104 104 0 0 0 54.46 201.54A104 104 0 0 0 201.54 54.46m-11.31 11.32a88 88 0 0 1 11 13.48L167.55 119l-27.92-78.22a87.34 87.34 0 0 1 50.6 25M155.59 133l-18.16 21.37l-27.59-5l-9.43-26.37l18.16-21.37l27.59 5ZM65.77 65.78a87.34 87.34 0 0 1 56.66-25.59l17.51 49L58.3 74.32a88 88 0 0 1 7.47-8.54m-19.12 95.76a88.4 88.4 0 0 1 2.53-72.62l51.21 9.35Zm19.12 28.68a88 88 0 0 1-11-13.48L88.45 137l27.92 78.18a87.34 87.34 0 0 1-50.6-24.96m124.46 0a87.34 87.34 0 0 1-56.66 25.59l-17.51-49l81.64 14.91a88 88 0 0 1-7.47 8.5m-34.62-32.49l53.74-63.27a88.4 88.4 0 0 1-2.53 72.62Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M201.54 54.46A104 104 0 0 0 54.46 201.54A104 104 0 0 0 201.54 54.46m-11.31 11.32a88 88 0 0 1 11 13.48L167.55 119l-27.92-78.22a87.34 87.34 0 0 1 50.6 25M155.59 133l-18.16 21.37l-27.59-5l-9.43-26.37l18.16-21.37l27.59 5ZM65.77 65.78a87.34 87.34 0 0 1 56.66-25.59l17.51 49L58.3 74.32a88 88 0 0 1 7.47-8.54m-19.12 95.76a88.4 88.4 0 0 1 2.53-72.62l51.21 9.35Zm19.12 28.68a88 88 0 0 1-11-13.48L88.45 137l27.92 78.18a87.34 87.34 0 0 1-50.6-24.96m124.46 0a87.34 87.34 0 0 1-56.66 25.59l-17.51-49l81.64 14.91a88 88 0 0 1-7.47 8.5m-34.62-32.49l53.74-63.27a88.4 88.4 0 0 1-2.53 72.62Z"/></svg>
</template>

CSS

.icon-aperture {
  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%22M201.54%2054.46A104%20104%200%200%200%2054.46%20201.54A104%20104%200%200%200%20201.54%2054.46m-11.31%2011.32a88%2088%200%200%201%2011%2013.48L167.55%20119l-27.92-78.22a87.34%2087.34%200%200%201%2050.6%2025M155.59%20133l-18.16%2021.37l-27.59-5l-9.43-26.37l18.16-21.37l27.59%205ZM65.77%2065.78a87.34%2087.34%200%200%201%2056.66-25.59l17.51%2049L58.3%2074.32a88%2088%200%200%201%207.47-8.54m-19.12%2095.76a88.4%2088.4%200%200%201%202.53-72.62l51.21%209.35Zm19.12%2028.68a88%2088%200%200%201-11-13.48L88.45%20137l27.92%2078.18a87.34%2087.34%200%200%201-50.6-24.96m124.46%200a87.34%2087.34%200%200%201-56.66%2025.59l-17.51-49l81.64%2014.91a88%2088%200%200%201-7.47%208.5m-34.62-32.49l53.74-63.27a88.4%2088.4%200%200%201-2.53%2072.62Z%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%22M201.54%2054.46A104%20104%200%200%200%2054.46%20201.54A104%20104%200%200%200%20201.54%2054.46m-11.31%2011.32a88%2088%200%200%201%2011%2013.48L167.55%20119l-27.92-78.22a87.34%2087.34%200%200%201%2050.6%2025M155.59%20133l-18.16%2021.37l-27.59-5l-9.43-26.37l18.16-21.37l27.59%205ZM65.77%2065.78a87.34%2087.34%200%200%201%2056.66-25.59l17.51%2049L58.3%2074.32a88%2088%200%200%201%207.47-8.54m-19.12%2095.76a88.4%2088.4%200%200%201%202.53-72.62l51.21%209.35Zm19.12%2028.68a88%2088%200%200%201-11-13.48L88.45%20137l27.92%2078.18a87.34%2087.34%200%200%201-50.6-24.96m124.46%200a87.34%2087.34%200%200%201-56.66%2025.59l-17.51-49l81.64%2014.91a88%2088%200%200%201-7.47%208.5m-34.62-32.49l53.74-63.27a88.4%2088.4%200%200%201-2.53%2072.62Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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