ring emoji
ring from Fluent Emoji High Contrast by Microsoft Corporation · Default · Objects · MIT Free for personal and commercial use.
- Name
- ring
- Set
- Fluent Emoji High Contrast
- Style
- Default
- Category
- Objects
- Viewbox
- 32×32
- License
- MIT
The same emoji in other sets
ringEmoji One (Colored)ringFont Awesome 6 SolidringFont Awesome SolidringFluent EmojiringFluent Emoji FlatringFirefox OS Emojiringcss.ggringIconParkringIconPark OutlineringIconPark SolidringIconPark TwoToneringLine AwesomeringMaterial Design IconsringNoto EmojiringOpenMojiringSimple IconsringWeb3 IconsringWeb3 Icons BrandedringTwitter Emoji
More objects icons from Fluent Emoji High Contrast
Use the ring emoji
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="currentColor"><path d="M8 19.5a7.5 7.5 0 1 1 15 0a7.5 7.5 0 0 1-15 0m7.5-5.5a5.5 5.5 0 1 0 0 11a5.5 5.5 0 0 0 0-11"/><path d="M15.509 31h-.2a11.5 11.5 0 0 1-4.6-21.956a.36.36 0 0 0 .209-.32v-.083l-1.33-2.95a1.7 1.7 0 0 1 .253-1.822l2.114-2.264A1.7 1.7 0 0 1 13.262 1h4.65a1.77 1.77 0 0 1 1.3.578l1.926 2.3a1.76 1.76 0 0 1 .248 1.806l-1.3 2.891v.151a.34.34 0 0 0 .2.31A11.56 11.56 0 0 1 27 19.5A11.517 11.517 0 0 1 15.509 31M12.823 8l.095.211v.515a2.36 2.36 0 0 1-1.375 2.138a9.492 9.492 0 1 0 7.905-.011a2.34 2.34 0 0 1-1.365-2.127v-.581L18.148 8zM11.52 5h7.949L17.8 3h-4.411z"/></g></svg>
React
import type { SVGProps } from "react";
export function FluentEmojiHighContrastRing(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="currentColor"><path d="M8 19.5a7.5 7.5 0 1 1 15 0a7.5 7.5 0 0 1-15 0m7.5-5.5a5.5 5.5 0 1 0 0 11a5.5 5.5 0 0 0 0-11"/><path d="M15.509 31h-.2a11.5 11.5 0 0 1-4.6-21.956a.36.36 0 0 0 .209-.32v-.083l-1.33-2.95a1.7 1.7 0 0 1 .253-1.822l2.114-2.264A1.7 1.7 0 0 1 13.262 1h4.65a1.77 1.77 0 0 1 1.3.578l1.926 2.3a1.76 1.76 0 0 1 .248 1.806l-1.3 2.891v.151a.34.34 0 0 0 .2.31A11.56 11.56 0 0 1 27 19.5A11.517 11.517 0 0 1 15.509 31M12.823 8l.095.211v.515a2.36 2.36 0 0 1-1.375 2.138a9.492 9.492 0 1 0 7.905-.011a2.34 2.34 0 0 1-1.365-2.127v-.581L18.148 8zM11.52 5h7.949L17.8 3h-4.411z"/></g></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><g fill="currentColor"><path d="M8 19.5a7.5 7.5 0 1 1 15 0a7.5 7.5 0 0 1-15 0m7.5-5.5a5.5 5.5 0 1 0 0 11a5.5 5.5 0 0 0 0-11"/><path d="M15.509 31h-.2a11.5 11.5 0 0 1-4.6-21.956a.36.36 0 0 0 .209-.32v-.083l-1.33-2.95a1.7 1.7 0 0 1 .253-1.822l2.114-2.264A1.7 1.7 0 0 1 13.262 1h4.65a1.77 1.77 0 0 1 1.3.578l1.926 2.3a1.76 1.76 0 0 1 .248 1.806l-1.3 2.891v.151a.34.34 0 0 0 .2.31A11.56 11.56 0 0 1 27 19.5A11.517 11.517 0 0 1 15.509 31M12.823 8l.095.211v.515a2.36 2.36 0 0 1-1.375 2.138a9.492 9.492 0 1 0 7.905-.011a2.34 2.34 0 0 1-1.365-2.127v-.581L18.148 8zM11.52 5h7.949L17.8 3h-4.411z"/></g></svg> </template>
CSS
.icon-ring {
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%2032%2032%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M8%2019.5a7.5%207.5%200%201%201%2015%200a7.5%207.5%200%200%201-15%200m7.5-5.5a5.5%205.5%200%201%200%200%2011a5.5%205.5%200%200%200%200-11%22%2F%3E%3Cpath%20d%3D%22M15.509%2031h-.2a11.5%2011.5%200%200%201-4.6-21.956a.36.36%200%200%200%20.209-.32v-.083l-1.33-2.95a1.7%201.7%200%200%201%20.253-1.822l2.114-2.264A1.7%201.7%200%200%201%2013.262%201h4.65a1.77%201.77%200%200%201%201.3.578l1.926%202.3a1.76%201.76%200%200%201%20.248%201.806l-1.3%202.891v.151a.34.34%200%200%200%20.2.31A11.56%2011.56%200%200%201%2027%2019.5A11.517%2011.517%200%200%201%2015.509%2031M12.823%208l.095.211v.515a2.36%202.36%200%200%201-1.375%202.138a9.492%209.492%200%201%200%207.905-.011a2.34%202.34%200%200%201-1.365-2.127v-.581L18.148%208zM11.52%205h7.949L17.8%203h-4.411z%22%2F%3E%3C%2Fg%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%2032%2032%22%3E%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M8%2019.5a7.5%207.5%200%201%201%2015%200a7.5%207.5%200%200%201-15%200m7.5-5.5a5.5%205.5%200%201%200%200%2011a5.5%205.5%200%200%200%200-11%22%2F%3E%3Cpath%20d%3D%22M15.509%2031h-.2a11.5%2011.5%200%200%201-4.6-21.956a.36.36%200%200%200%20.209-.32v-.083l-1.33-2.95a1.7%201.7%200%200%201%20.253-1.822l2.114-2.264A1.7%201.7%200%200%201%2013.262%201h4.65a1.77%201.77%200%200%201%201.3.578l1.926%202.3a1.76%201.76%200%200%201%20.248%201.806l-1.3%202.891v.151a.34.34%200%200%200%20.2.31A11.56%2011.56%200%200%201%2027%2019.5A11.517%2011.517%200%200%201%2015.509%2031M12.823%208l.095.211v.515a2.36%202.36%200%200%201-1.375%202.138a9.492%209.492%200%201%200%207.905-.011a2.34%202.34%200%200%201-1.365-2.127v-.581L18.148%208zM11.52%205h7.949L17.8%203h-4.411z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent-emoji-high-contrast/ring.svg?color=%231a73e8&size=48