Call Inbound icon
Used in call scenarios. The Call Inbound 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 Call Inbound 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 { CallInbound24Regular, CallInbound24Filled } from "@fluentui/react-icons";
export function Example() {
return <CallInbound24Regular aria-label="Call Inbound" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_call_inbound_24_regular.svg" width="24" height="24" alt="Call Inbound"> 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="M9.5258 3.5721L10.4275 5.57782C10.9102 6.65165 10.6558 7.91366 9.79476 8.71661L8.30046 10.1101C8.25678 10.1508 8.22913 10.2058 8.2225 10.2652C8.17814 10.6623 8.44737 11.4357 9.06763 12.51C9.51868 13.2913 9.92693 13.8391 10.2744 14.1473C10.5165 14.362 10.6498 14.4084 10.7065 14.3915L12.7169 13.7769C13.8425 13.4328 15.0623 13.8431 15.751 14.7976L17.0317 16.5726C17.8378 17.6898 17.6928 19.2311 16.6926 20.1784L15.8062 21.0178C14.8498 21.9236 13.4882 22.2611 12.2195 21.907C9.46539 21.1383 6.99608 18.8141 4.78421 14.9831C2.56926 11.1467 1.79207 7.84222 2.50852 5.07043C2.81817 3.87242 3.69714 2.90908 4.8506 2.4872L5.05694 2.41844L6.22394 2.06668C7.54645 1.66804 8.95945 2.31227 9.5258 3.5721ZM6.65684 3.50285L5.48984 3.85461L5.33128 3.90891C4.65633 4.16847 4.14346 4.73908 3.96079 5.44581C3.35814 7.77732 4.047 10.7062 6.08325 14.2331C8.11678 17.7552 10.3057 19.8155 12.6227 20.4622C13.384 20.6747 14.2009 20.4722 14.7748 19.9287L15.6611 19.0893C16.1158 18.6587 16.1817 17.9581 15.8153 17.4503L14.5346 15.6753C14.2215 15.2415 13.667 15.0549 13.1554 15.2114L11.1401 15.8275C9.97036 16.1762 8.90869 15.2347 7.7686 13.26C7.00029 11.9293 6.6422 10.9006 6.73177 10.0987C6.77817 9.68322 6.97174 9.29812 7.27746 9.01303L8.77176 7.61958C9.16315 7.2546 9.27878 6.68096 9.05936 6.19286L8.15769 4.18714C7.90026 3.61449 7.25798 3.32165 6.65684 3.50285ZM20.2504 10.9991L13.6967 10.9986L13.5974 10.9849L13.4954 10.9563L13.4476 10.9362C13.364 10.9008 13.2865 10.8487 13.2187 10.7809C13.1754 10.7376 13.1384 10.6904 13.1079 10.6403L13.0592 10.5446L13.0341 10.4783L13.0106 10.3829L12.9993 10.2778L12.9988 3.74523C12.9988 3.33102 13.3346 2.99523 13.7488 2.99523C14.1285 2.99523 14.4423 3.27739 14.492 3.64346L14.4988 3.74523L14.498 8.43922L20.7188 2.21592C20.985 1.94958 21.4017 1.92527 21.6954 2.14305L21.7795 2.21565C22.0458 2.48184 22.0701 2.8985 21.8524 3.19217L21.7798 3.27631L15.56 9.49822L20.2504 9.49912C20.6301 9.49912 20.9439 9.78128 20.9935 10.1474L21.0004 10.2491C21.0004 10.6288 20.7182 10.9426 20.3521 10.9923L20.2504 10.9991Z" 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/call_inbound_24_regular.svg";Details
| Name | Call Inbound |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_call_inbound_24_regular.svg |
| Filled file | ic_fluent_call_inbound_24_filled.svg |
| React components | CallInbound24Regular, CallInbound24Filled |
| License | MIT (© Microsoft Corporation) |