globe surface icon
globe-surface-20-filled from Fluent UI System Icons by Microsoft Corporation · 20 Filled · MIT Free for personal and commercial use.
- Name
- globe-surface-20-filled
- Set
- Fluent UI System Icons
- Style
- 20 Filled
- Viewbox
- 20×20
- License
- MIT
5 other variants in Fluent UI System Icons
Related icons in Fluent UI System Icons
globe-add-20-filledglobe-arrow-forward-16-filledglobe-arrow-up-16-filledglobe-clock-16-filledglobe-desktop-20-filledglobe-error-16-filledglobe-location-20-filledglobe-off-12-filledglobe-person-20-filledglobe-prohibited-16-filledglobe-search-20-filledglobe-shield-20-filledglobe-stand-20-filledglobe-star-16-filledglobe-sync-16-filledglobe-video-20-filledglobe-warning-16-filled
Use the globe surface icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M8.125 7c.12-.93.32-1.755.574-2.417c.213-.554.455-.969.698-1.236S9.844 3 10 3s.36.08.603.347s.485.682.698 1.236c.255.662.455 1.487.574 2.417zm-.36-2.776c.135-.349.287-.672.458-.957A6.02 6.02 0 0 0 4.341 7h2.776c.126-1.05.35-1.999.649-2.776m4.47 0a6 6 0 0 0-.458-.957A6.02 6.02 0 0 1 15.659 7h-2.776c-.126-1.05-.35-1.999-.649-2.776M12.97 8h2.946a6 6 0 0 1 0 2H12.97a17 17 0 0 0 0-2m-.088 3h2.776a6.02 6.02 0 0 1-3.882 3.733c.17-.285.323-.608.457-.957c.3-.777.523-1.726.65-2.776m-2.28 3.653c-.243.267-.447.347-.603.347s-.36-.08-.603-.347s-.485-.682-.698-1.236c-.255-.662-.455-1.486-.574-2.417h3.75c-.12.93-.32 1.755-.574 2.417c-.213.554-.455.969-.698 1.236M4.341 11a6.02 6.02 0 0 0 3.882 3.733a6 6 0 0 1-.457-.957c-.3-.777-.523-1.726-.65-2.776zm2.688-1H4.083a6 6 0 0 1 0-2h2.946a17 17 0 0 0 0 2M8.03 8a16 16 0 0 0 0 2h3.94a16 16 0 0 0 0-2zM3.5 13h.755q.373.535.837.992A.5.5 0 0 1 5 14H3.89l-.75 3h13.72l-.75-3H15a.5.5 0 0 1-.092-.008a7 7 0 0 0 .837-.992h.755a.5.5 0 0 1 .485.379l1 4A.5.5 0 0 1 17.5 18h-15a.5.5 0 0 1-.485-.621l1-4A.5.5 0 0 1 3.5 13"/></svg>
React
import type { SVGProps } from "react";
export function FluentGlobeSurface20Filled(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M8.125 7c.12-.93.32-1.755.574-2.417c.213-.554.455-.969.698-1.236S9.844 3 10 3s.36.08.603.347s.485.682.698 1.236c.255.662.455 1.487.574 2.417zm-.36-2.776c.135-.349.287-.672.458-.957A6.02 6.02 0 0 0 4.341 7h2.776c.126-1.05.35-1.999.649-2.776m4.47 0a6 6 0 0 0-.458-.957A6.02 6.02 0 0 1 15.659 7h-2.776c-.126-1.05-.35-1.999-.649-2.776M12.97 8h2.946a6 6 0 0 1 0 2H12.97a17 17 0 0 0 0-2m-.088 3h2.776a6.02 6.02 0 0 1-3.882 3.733c.17-.285.323-.608.457-.957c.3-.777.523-1.726.65-2.776m-2.28 3.653c-.243.267-.447.347-.603.347s-.36-.08-.603-.347s-.485-.682-.698-1.236c-.255-.662-.455-1.486-.574-2.417h3.75c-.12.93-.32 1.755-.574 2.417c-.213.554-.455.969-.698 1.236M4.341 11a6.02 6.02 0 0 0 3.882 3.733a6 6 0 0 1-.457-.957c-.3-.777-.523-1.726-.65-2.776zm2.688-1H4.083a6 6 0 0 1 0-2h2.946a17 17 0 0 0 0 2M8.03 8a16 16 0 0 0 0 2h3.94a16 16 0 0 0 0-2zM3.5 13h.755q.373.535.837.992A.5.5 0 0 1 5 14H3.89l-.75 3h13.72l-.75-3H15a.5.5 0 0 1-.092-.008a7 7 0 0 0 .837-.992h.755a.5.5 0 0 1 .485.379l1 4A.5.5 0 0 1 17.5 18h-15a.5.5 0 0 1-.485-.621l1-4A.5.5 0 0 1 3.5 13"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 20 20"><path fill="currentColor" d="M8.125 7c.12-.93.32-1.755.574-2.417c.213-.554.455-.969.698-1.236S9.844 3 10 3s.36.08.603.347s.485.682.698 1.236c.255.662.455 1.487.574 2.417zm-.36-2.776c.135-.349.287-.672.458-.957A6.02 6.02 0 0 0 4.341 7h2.776c.126-1.05.35-1.999.649-2.776m4.47 0a6 6 0 0 0-.458-.957A6.02 6.02 0 0 1 15.659 7h-2.776c-.126-1.05-.35-1.999-.649-2.776M12.97 8h2.946a6 6 0 0 1 0 2H12.97a17 17 0 0 0 0-2m-.088 3h2.776a6.02 6.02 0 0 1-3.882 3.733c.17-.285.323-.608.457-.957c.3-.777.523-1.726.65-2.776m-2.28 3.653c-.243.267-.447.347-.603.347s-.36-.08-.603-.347s-.485-.682-.698-1.236c-.255-.662-.455-1.486-.574-2.417h3.75c-.12.93-.32 1.755-.574 2.417c-.213.554-.455.969-.698 1.236M4.341 11a6.02 6.02 0 0 0 3.882 3.733a6 6 0 0 1-.457-.957c-.3-.777-.523-1.726-.65-2.776zm2.688-1H4.083a6 6 0 0 1 0-2h2.946a17 17 0 0 0 0 2M8.03 8a16 16 0 0 0 0 2h3.94a16 16 0 0 0 0-2zM3.5 13h.755q.373.535.837.992A.5.5 0 0 1 5 14H3.89l-.75 3h13.72l-.75-3H15a.5.5 0 0 1-.092-.008a7 7 0 0 0 .837-.992h.755a.5.5 0 0 1 .485.379l1 4A.5.5 0 0 1 17.5 18h-15a.5.5 0 0 1-.485-.621l1-4A.5.5 0 0 1 3.5 13"/></svg> </template>
CSS
.icon-globe-surface-20-filled {
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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8.125%207c.12-.93.32-1.755.574-2.417c.213-.554.455-.969.698-1.236S9.844%203%2010%203s.36.08.603.347s.485.682.698%201.236c.255.662.455%201.487.574%202.417zm-.36-2.776c.135-.349.287-.672.458-.957A6.02%206.02%200%200%200%204.341%207h2.776c.126-1.05.35-1.999.649-2.776m4.47%200a6%206%200%200%200-.458-.957A6.02%206.02%200%200%201%2015.659%207h-2.776c-.126-1.05-.35-1.999-.649-2.776M12.97%208h2.946a6%206%200%200%201%200%202H12.97a17%2017%200%200%200%200-2m-.088%203h2.776a6.02%206.02%200%200%201-3.882%203.733c.17-.285.323-.608.457-.957c.3-.777.523-1.726.65-2.776m-2.28%203.653c-.243.267-.447.347-.603.347s-.36-.08-.603-.347s-.485-.682-.698-1.236c-.255-.662-.455-1.486-.574-2.417h3.75c-.12.93-.32%201.755-.574%202.417c-.213.554-.455.969-.698%201.236M4.341%2011a6.02%206.02%200%200%200%203.882%203.733a6%206%200%200%201-.457-.957c-.3-.777-.523-1.726-.65-2.776zm2.688-1H4.083a6%206%200%200%201%200-2h2.946a17%2017%200%200%200%200%202M8.03%208a16%2016%200%200%200%200%202h3.94a16%2016%200%200%200%200-2zM3.5%2013h.755q.373.535.837.992A.5.5%200%200%201%205%2014H3.89l-.75%203h13.72l-.75-3H15a.5.5%200%200%201-.092-.008a7%207%200%200%200%20.837-.992h.755a.5.5%200%200%201%20.485.379l1%204A.5.5%200%200%201%2017.5%2018h-15a.5.5%200%200%201-.485-.621l1-4A.5.5%200%200%201%203.5%2013%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%2020%2020%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8.125%207c.12-.93.32-1.755.574-2.417c.213-.554.455-.969.698-1.236S9.844%203%2010%203s.36.08.603.347s.485.682.698%201.236c.255.662.455%201.487.574%202.417zm-.36-2.776c.135-.349.287-.672.458-.957A6.02%206.02%200%200%200%204.341%207h2.776c.126-1.05.35-1.999.649-2.776m4.47%200a6%206%200%200%200-.458-.957A6.02%206.02%200%200%201%2015.659%207h-2.776c-.126-1.05-.35-1.999-.649-2.776M12.97%208h2.946a6%206%200%200%201%200%202H12.97a17%2017%200%200%200%200-2m-.088%203h2.776a6.02%206.02%200%200%201-3.882%203.733c.17-.285.323-.608.457-.957c.3-.777.523-1.726.65-2.776m-2.28%203.653c-.243.267-.447.347-.603.347s-.36-.08-.603-.347s-.485-.682-.698-1.236c-.255-.662-.455-1.486-.574-2.417h3.75c-.12.93-.32%201.755-.574%202.417c-.213.554-.455.969-.698%201.236M4.341%2011a6.02%206.02%200%200%200%203.882%203.733a6%206%200%200%201-.457-.957c-.3-.777-.523-1.726-.65-2.776zm2.688-1H4.083a6%206%200%200%201%200-2h2.946a17%2017%200%200%200%200%202M8.03%208a16%2016%200%200%200%200%202h3.94a16%2016%200%200%200%200-2zM3.5%2013h.755q.373.535.837.992A.5.5%200%200%201%205%2014H3.89l-.75%203h13.72l-.75-3H15a.5.5%200%200%201-.092-.008a7%207%200%200%200%20.837-.992h.755a.5.5%200%200%201%20.485.379l1%204A.5.5%200%200%201%2017.5%2018h-15a.5.5%200%200%201-.485-.621l1-4A.5.5%200%200%201%203.5%2013%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/globe-surface-20-filled.svg?color=%231a73e8&size=48
