spinner ball icon

spinner-ball-thin from Phosphor by Phosphor Icons · Thin · MIT Free for personal and commercial use.

Name
spinner-ball-thin
Set
Phosphor
Style
Thin
Viewbox
256×256
License
MIT

5 other variants in Phosphor

spinner-ballspinner-ball-boldspinner-ball-duotonespinner-ball-fillspinner-ball-light

Related icons in Phosphor

spinner-gap

Use the spinner ball icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M128 28a100 100 0 1 0 100 100A100.11 100.11 0 0 0 128 28m91.92 96.44c-33.69 24.71-58.55 15.45-83.94 3c23.54-15.86 45.85-33.95 43.34-75.81a92 92 0 0 1 40.6 72.81m-49.06-77.83C175.4 88.13 155 105 131.55 120.83c-2-28.32-6.47-56.69-44-75.45a91.87 91.87 0 0 1 83.3 1.23ZM79 50.18c38.22 16.83 42.63 43 44.58 71.16c-25.5-12.46-52.33-22.75-87.34.38A92.07 92.07 0 0 1 79 50.18m-42.9 81.38c33.69-24.71 58.55-15.45 83.94-3.05c-23.54 15.86-45.85 34-43.34 75.81a92 92 0 0 1-40.62-72.76Zm49.06 77.83C80.6 167.87 101 151 124.45 135.17c2 28.32 6.47 56.69 44 75.45a91.87 91.87 0 0 1-83.3-1.23Zm91.84-3.57c-38.22-16.83-42.63-43-44.58-71.16c14.43 7.05 29.29 13.41 45.81 13.41c12.67 0 26.33-3.74 41.53-13.78A92.06 92.06 0 0 1 177 205.82"/></svg>

React

import type { SVGProps } from "react";

export function PhSpinnerBallThin(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 28a100 100 0 1 0 100 100A100.11 100.11 0 0 0 128 28m91.92 96.44c-33.69 24.71-58.55 15.45-83.94 3c23.54-15.86 45.85-33.95 43.34-75.81a92 92 0 0 1 40.6 72.81m-49.06-77.83C175.4 88.13 155 105 131.55 120.83c-2-28.32-6.47-56.69-44-75.45a91.87 91.87 0 0 1 83.3 1.23ZM79 50.18c38.22 16.83 42.63 43 44.58 71.16c-25.5-12.46-52.33-22.75-87.34.38A92.07 92.07 0 0 1 79 50.18m-42.9 81.38c33.69-24.71 58.55-15.45 83.94-3.05c-23.54 15.86-45.85 34-43.34 75.81a92 92 0 0 1-40.62-72.76Zm49.06 77.83C80.6 167.87 101 151 124.45 135.17c2 28.32 6.47 56.69 44 75.45a91.87 91.87 0 0 1-83.3-1.23Zm91.84-3.57c-38.22-16.83-42.63-43-44.58-71.16c14.43 7.05 29.29 13.41 45.81 13.41c12.67 0 26.33-3.74 41.53-13.78A92.06 92.06 0 0 1 177 205.82"/></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 28a100 100 0 1 0 100 100A100.11 100.11 0 0 0 128 28m91.92 96.44c-33.69 24.71-58.55 15.45-83.94 3c23.54-15.86 45.85-33.95 43.34-75.81a92 92 0 0 1 40.6 72.81m-49.06-77.83C175.4 88.13 155 105 131.55 120.83c-2-28.32-6.47-56.69-44-75.45a91.87 91.87 0 0 1 83.3 1.23ZM79 50.18c38.22 16.83 42.63 43 44.58 71.16c-25.5-12.46-52.33-22.75-87.34.38A92.07 92.07 0 0 1 79 50.18m-42.9 81.38c33.69-24.71 58.55-15.45 83.94-3.05c-23.54 15.86-45.85 34-43.34 75.81a92 92 0 0 1-40.62-72.76Zm49.06 77.83C80.6 167.87 101 151 124.45 135.17c2 28.32 6.47 56.69 44 75.45a91.87 91.87 0 0 1-83.3-1.23Zm91.84-3.57c-38.22-16.83-42.63-43-44.58-71.16c14.43 7.05 29.29 13.41 45.81 13.41c12.67 0 26.33-3.74 41.53-13.78A92.06 92.06 0 0 1 177 205.82"/></svg>
</template>

CSS

.icon-spinner-ball-thin {
  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%2028a100%20100%200%201%200%20100%20100A100.11%20100.11%200%200%200%20128%2028m91.92%2096.44c-33.69%2024.71-58.55%2015.45-83.94%203c23.54-15.86%2045.85-33.95%2043.34-75.81a92%2092%200%200%201%2040.6%2072.81m-49.06-77.83C175.4%2088.13%20155%20105%20131.55%20120.83c-2-28.32-6.47-56.69-44-75.45a91.87%2091.87%200%200%201%2083.3%201.23ZM79%2050.18c38.22%2016.83%2042.63%2043%2044.58%2071.16c-25.5-12.46-52.33-22.75-87.34.38A92.07%2092.07%200%200%201%2079%2050.18m-42.9%2081.38c33.69-24.71%2058.55-15.45%2083.94-3.05c-23.54%2015.86-45.85%2034-43.34%2075.81a92%2092%200%200%201-40.62-72.76Zm49.06%2077.83C80.6%20167.87%20101%20151%20124.45%20135.17c2%2028.32%206.47%2056.69%2044%2075.45a91.87%2091.87%200%200%201-83.3-1.23Zm91.84-3.57c-38.22-16.83-42.63-43-44.58-71.16c14.43%207.05%2029.29%2013.41%2045.81%2013.41c12.67%200%2026.33-3.74%2041.53-13.78A92.06%2092.06%200%200%201%20177%20205.82%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%2028a100%20100%200%201%200%20100%20100A100.11%20100.11%200%200%200%20128%2028m91.92%2096.44c-33.69%2024.71-58.55%2015.45-83.94%203c23.54-15.86%2045.85-33.95%2043.34-75.81a92%2092%200%200%201%2040.6%2072.81m-49.06-77.83C175.4%2088.13%20155%20105%20131.55%20120.83c-2-28.32-6.47-56.69-44-75.45a91.87%2091.87%200%200%201%2083.3%201.23ZM79%2050.18c38.22%2016.83%2042.63%2043%2044.58%2071.16c-25.5-12.46-52.33-22.75-87.34.38A92.07%2092.07%200%200%201%2079%2050.18m-42.9%2081.38c33.69-24.71%2058.55-15.45%2083.94-3.05c-23.54%2015.86-45.85%2034-43.34%2075.81a92%2092%200%200%201-40.62-72.76Zm49.06%2077.83C80.6%20167.87%20101%20151%20124.45%20135.17c2%2028.32%206.47%2056.69%2044%2075.45a91.87%2091.87%200%200%201-83.3-1.23Zm91.84-3.57c-38.22-16.83-42.63-43-44.58-71.16c14.43%207.05%2029.29%2013.41%2045.81%2013.41c12.67%200%2026.33-3.74%2041.53-13.78A92.06%2092.06%200%200%201%20177%20205.82%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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