Walkie Talkie icon
Used to represent short wave communication devices. The Walkie Talkie 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 Walkie Talkie 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 { WalkieTalkie24Regular, WalkieTalkie24Filled } from "@fluentui/react-icons";
export function Example() {
return <WalkieTalkie24Regular aria-label="Walkie Talkie" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_walkie_talkie_24_regular.svg" width="24" height="24" alt="Walkie Talkie"> 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="M10.25 14C9.83579 14 9.5 14.3358 9.5 14.75C9.5 15.1642 9.83579 15.5 10.25 15.5H13.75C14.1642 15.5 14.5 15.1642 14.5 14.75C14.5 14.3358 14.1642 14 13.75 14H10.25ZM8.75 6C8.33579 6 8 6.33579 8 6.75V11.2506C8 11.6648 8.33579 12.0006 8.75 12.0006H15.25C15.6642 12.0006 16 11.6648 16 11.2506V6.75C16 6.33579 15.6642 6 15.25 6H8.75ZM9.5 10.5006V7.5H14.5V10.5006H9.5ZM8.75 1C9.16421 1 9.5 1.33579 9.5 1.75V3H16.75C17.9926 3 19 4.00736 19 5.25V14C19 14.1885 18.929 14.3702 18.8011 14.5087L17.5 15.9182V19.75C17.5 20.9926 16.4926 22 15.25 22H8.75109C7.50845 22 6.50109 20.9926 6.50109 19.75V15.9184L5.19908 14.5089C5.07108 14.3703 5 14.1886 5 14V5.25C5 4.00736 6.00736 3 7.25 3H8V1.75C8 1.33579 8.33579 1 8.75 1ZM6.5 5.25V13.7066L7.80201 15.1161C7.93001 15.2547 8.00109 15.4364 8.00109 15.625V19.75C8.00109 20.1642 8.33688 20.5 8.75109 20.5H15.25C15.6642 20.5 16 20.1642 16 19.75V15.625C16 15.4365 16.071 15.2548 16.1989 15.1163L17.5 13.7068V5.25C17.5 4.83579 17.1642 4.5 16.75 4.5H7.25C6.83579 4.5 6.5 4.83579 6.5 5.25Z" 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/walkie_talkie_24_regular.svg";Details
| Name | Walkie Talkie |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_walkie_talkie_24_regular.svg |
| Filled file | ic_fluent_walkie_talkie_24_filled.svg |
| React components | WalkieTalkie24Regular, WalkieTalkie24Filled |
| License | MIT (© Microsoft Corporation) |