Presence Available icon
These do not represent the guidelines and quality of the Fluent System iconography. They are included as a way to make it easier for products to pull in without needed a second process. The Presence Available icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Use the Presence Available icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { PresenceAvailable24Regular, PresenceAvailable24Filled } from "@fluentui/react-icons";
export function Example() {
return <PresenceAvailable24Regular aria-label="Presence Available" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_presence_available_24_regular.svg" width="24" height="24" alt="Presence Available"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 0C5.37258 0 0 5.37258 0 12C0 18.6274 5.37258 24 12 24C18.6274 24 24 18.6274 24 12C24 5.37258 18.6274 0 12 0ZM3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12ZM17.0607 8.43934C17.6464 9.02513 17.6464 9.97487 17.0607 10.5607L11.5607 16.0607C10.9749 16.6464 10.0251 16.6464 9.43934 16.0607L7.43934 14.0607C6.85355 13.4749 6.85355 12.5251 7.43934 11.9393C8.02513 11.3536 8.97487 11.3536 9.56066 11.9393L10.5 12.8787L14.9393 8.43934C15.5251 7.85355 16.4749 7.85355 17.0607 8.43934Z" fill="currentColor"/></svg>Use it from the SVG package
Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:
npm install @fluentui/svg-icons
import icon from "@fluentui/svg-icons/icons/presence_available_24_regular.svg";Details
| Name | Presence Available |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_presence_available_24_regular.svg |
| Filled file | ic_fluent_presence_available_24_filled.svg |
| React components | PresenceAvailable24Regular, PresenceAvailable24Filled |
| License | MIT (© Microsoft Corporation) |