sphere icon

sphere-light from Phosphor by Phosphor Icons · Light · MIT Free for personal and commercial use.

Name: sphere-light
Set: Phosphor
Style: Light
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

sphere sphere-bold sphere-duotone sphere-fill sphere-thin

The same icon in other sets

sphereHuge Icons sphereIconPark sphereIconPark Outline sphereIconoir sphereMaterial Design Icons sphereTabler Icons sphereWeb3 Icons sphereWeb3 Icons Branded

Use the sphere icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M128 26a102 102 0 1 0 102 102A102.12 102.12 0 0 0 128 26m90 102c0 6.59-12.94 13.24-24 16.94a168 168 0 0 1-28.92 6.53c.62-7.6.94-15.46.94-23.47c0-26.27-3.44-51-9.68-69.78a85.6 85.6 0 0 0-8-17.91A90.16 90.16 0 0 1 218 128m-90-90c6.59 0 13.24 12.94 16.94 24c5.84 17.53 9.06 41 9.06 66c0 8.83-.4 17.15-1.11 24.89c-8 .73-16.35 1.11-24.89 1.11c-54.94 0-90-15.4-90-26a90.1 90.1 0 0 1 90-90M40.31 148.3a85.6 85.6 0 0 0 17.91 8C77 162.56 101.73 166 128 166c8 0 15.86-.32 23.45-.94C146.64 198.2 136 218 128 218a90.16 90.16 0 0 1-87.69-69.7m108 67.39a85.6 85.6 0 0 0 8-17.91a184 184 0 0 0 7.43-34a184 184 0 0 0 34-7.43a85.6 85.6 0 0 0 17.91-8a90.3 90.3 0 0 1-67.35 67.34Z"/></svg>

React

import type { SVGProps } from "react";

export function PhSphereLight(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="M128 26a102 102 0 1 0 102 102A102.12 102.12 0 0 0 128 26m90 102c0 6.59-12.94 13.24-24 16.94a168 168 0 0 1-28.92 6.53c.62-7.6.94-15.46.94-23.47c0-26.27-3.44-51-9.68-69.78a85.6 85.6 0 0 0-8-17.91A90.16 90.16 0 0 1 218 128m-90-90c6.59 0 13.24 12.94 16.94 24c5.84 17.53 9.06 41 9.06 66c0 8.83-.4 17.15-1.11 24.89c-8 .73-16.35 1.11-24.89 1.11c-54.94 0-90-15.4-90-26a90.1 90.1 0 0 1 90-90M40.31 148.3a85.6 85.6 0 0 0 17.91 8C77 162.56 101.73 166 128 166c8 0 15.86-.32 23.45-.94C146.64 198.2 136 218 128 218a90.16 90.16 0 0 1-87.69-69.7m108 67.39a85.6 85.6 0 0 0 8-17.91a184 184 0 0 0 7.43-34a184 184 0 0 0 34-7.43a85.6 85.6 0 0 0 17.91-8a90.3 90.3 0 0 1-67.35 67.34Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M128 26a102 102 0 1 0 102 102A102.12 102.12 0 0 0 128 26m90 102c0 6.59-12.94 13.24-24 16.94a168 168 0 0 1-28.92 6.53c.62-7.6.94-15.46.94-23.47c0-26.27-3.44-51-9.68-69.78a85.6 85.6 0 0 0-8-17.91A90.16 90.16 0 0 1 218 128m-90-90c6.59 0 13.24 12.94 16.94 24c5.84 17.53 9.06 41 9.06 66c0 8.83-.4 17.15-1.11 24.89c-8 .73-16.35 1.11-24.89 1.11c-54.94 0-90-15.4-90-26a90.1 90.1 0 0 1 90-90M40.31 148.3a85.6 85.6 0 0 0 17.91 8C77 162.56 101.73 166 128 166c8 0 15.86-.32 23.45-.94C146.64 198.2 136 218 128 218a90.16 90.16 0 0 1-87.69-69.7m108 67.39a85.6 85.6 0 0 0 8-17.91a184 184 0 0 0 7.43-34a184 184 0 0 0 34-7.43a85.6 85.6 0 0 0 17.91-8a90.3 90.3 0 0 1-67.35 67.34Z"/></svg>
</template>

CSS

.icon-sphere-light {
  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%22M128%2026a102%20102%200%201%200%20102%20102A102.12%20102.12%200%200%200%20128%2026m90%20102c0%206.59-12.94%2013.24-24%2016.94a168%20168%200%200%201-28.92%206.53c.62-7.6.94-15.46.94-23.47c0-26.27-3.44-51-9.68-69.78a85.6%2085.6%200%200%200-8-17.91A90.16%2090.16%200%200%201%20218%20128m-90-90c6.59%200%2013.24%2012.94%2016.94%2024c5.84%2017.53%209.06%2041%209.06%2066c0%208.83-.4%2017.15-1.11%2024.89c-8%20.73-16.35%201.11-24.89%201.11c-54.94%200-90-15.4-90-26a90.1%2090.1%200%200%201%2090-90M40.31%20148.3a85.6%2085.6%200%200%200%2017.91%208C77%20162.56%20101.73%20166%20128%20166c8%200%2015.86-.32%2023.45-.94C146.64%20198.2%20136%20218%20128%20218a90.16%2090.16%200%200%201-87.69-69.7m108%2067.39a85.6%2085.6%200%200%200%208-17.91a184%20184%200%200%200%207.43-34a184%20184%200%200%200%2034-7.43a85.6%2085.6%200%200%200%2017.91-8a90.3%2090.3%200%200%201-67.35%2067.34Z%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%22M128%2026a102%20102%200%201%200%20102%20102A102.12%20102.12%200%200%200%20128%2026m90%20102c0%206.59-12.94%2013.24-24%2016.94a168%20168%200%200%201-28.92%206.53c.62-7.6.94-15.46.94-23.47c0-26.27-3.44-51-9.68-69.78a85.6%2085.6%200%200%200-8-17.91A90.16%2090.16%200%200%201%20218%20128m-90-90c6.59%200%2013.24%2012.94%2016.94%2024c5.84%2017.53%209.06%2041%209.06%2066c0%208.83-.4%2017.15-1.11%2024.89c-8%20.73-16.35%201.11-24.89%201.11c-54.94%200-90-15.4-90-26a90.1%2090.1%200%200%201%2090-90M40.31%20148.3a85.6%2085.6%200%200%200%2017.91%208C77%20162.56%20101.73%20166%20128%20166c8%200%2015.86-.32%2023.45-.94C146.64%20198.2%20136%20218%20128%20218a90.16%2090.16%200%200%201-87.69-69.7m108%2067.39a85.6%2085.6%200%200%200%208-17.91a184%20184%200%200%200%207.43-34a184%20184%200%200%200%2034-7.43a85.6%2085.6%200%200%200%2017.91-8a90.3%2090.3%200%200%201-67.35%2067.34Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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