sphere icon
sphere from Material Design Icons by Pictogrammers · Filled · Shape · Apache-2.0 Free for personal and commercial use.
- Name
- sphere
- Set
- Material Design Icons
- Style
- Filled
- Category
- Shape
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
More shape icons from Material Design Icons
Use the sphere icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10s10-4.5 10-10S17.5 2 12 2m0 12c-4.42 0-8-.89-8-2c0-1.1 3.58-2 8-2s8 .9 8 2c0 1.11-3.58 2-8 2m0-10c3.37 0 6.25 2.09 7.43 5.05C17.93 8.43 15.61 8 12 8c-2.2 0-5.27.19-7.43 1.05C5.75 6.09 8.63 4 12 4m0 16c-3.37 0-6.25-2.09-7.43-5.05C6.07 15.57 8.39 16 12 16c2.2 0 5.27-.19 7.43-1.05C18.25 17.91 15.37 20 12 20"/></svg>
React
import type { SVGProps } from "react";
export function MdiSphere(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10s10-4.5 10-10S17.5 2 12 2m0 12c-4.42 0-8-.89-8-2c0-1.1 3.58-2 8-2s8 .9 8 2c0 1.11-3.58 2-8 2m0-10c3.37 0 6.25 2.09 7.43 5.05C17.93 8.43 15.61 8 12 8c-2.2 0-5.27.19-7.43 1.05C5.75 6.09 8.63 4 12 4m0 16c-3.37 0-6.25-2.09-7.43-5.05C6.07 15.57 8.39 16 12 16c2.2 0 5.27-.19 7.43-1.05C18.25 17.91 15.37 20 12 20"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10s10-4.5 10-10S17.5 2 12 2m0 12c-4.42 0-8-.89-8-2c0-1.1 3.58-2 8-2s8 .9 8 2c0 1.11-3.58 2-8 2m0-10c3.37 0 6.25 2.09 7.43 5.05C17.93 8.43 15.61 8 12 8c-2.2 0-5.27.19-7.43 1.05C5.75 6.09 8.63 4 12 4m0 16c-3.37 0-6.25-2.09-7.43-5.05C6.07 15.57 8.39 16 12 16c2.2 0 5.27-.19 7.43-1.05C18.25 17.91 15.37 20 12 20"/></svg> </template>
CSS
.icon-sphere {
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%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%202C6.5%202%202%206.5%202%2012s4.5%2010%2010%2010s10-4.5%2010-10S17.5%202%2012%202m0%2012c-4.42%200-8-.89-8-2c0-1.1%203.58-2%208-2s8%20.9%208%202c0%201.11-3.58%202-8%202m0-10c3.37%200%206.25%202.09%207.43%205.05C17.93%208.43%2015.61%208%2012%208c-2.2%200-5.27.19-7.43%201.05C5.75%206.09%208.63%204%2012%204m0%2016c-3.37%200-6.25-2.09-7.43-5.05C6.07%2015.57%208.39%2016%2012%2016c2.2%200%205.27-.19%207.43-1.05C18.25%2017.91%2015.37%2020%2012%2020%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%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12%202C6.5%202%202%206.5%202%2012s4.5%2010%2010%2010s10-4.5%2010-10S17.5%202%2012%202m0%2012c-4.42%200-8-.89-8-2c0-1.1%203.58-2%208-2s8%20.9%208%202c0%201.11-3.58%202-8%202m0-10c3.37%200%206.25%202.09%207.43%205.05C17.93%208.43%2015.61%208%2012%208c-2.2%200-5.27.19-7.43%201.05C5.75%206.09%208.63%204%2012%204m0%2016c-3.37%200-6.25-2.09-7.43-5.05C6.07%2015.57%208.39%2016%2012%2016c2.2%200%205.27-.19%207.43-1.05C18.25%2017.91%2015.37%2020%2012%2020%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mdi/sphere.svg?color=%231a73e8&size=48
