Share Multiple icon
Used in sharing information scenarios. The Share Multiple 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 Share Multiple 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 { ShareMultiple24Regular, ShareMultiple24Filled } from "@fluentui/react-icons";
export function Example() {
return <ShareMultiple24Regular aria-label="Share Multiple" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_share_multiple_24_regular.svg" width="24" height="24" alt="Share Multiple"> 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="M8.97 13.9499C9.06 13.9799 9.16 13.9999 9.25 13.9999C9.45 13.9999 9.65 13.9199 9.79 13.7699L9.7915 13.7684C9.86126 13.6973 12.1573 11.3564 15.49 11.0399V13.2499C15.49 13.5499 15.66 13.8199 15.94 13.9399C16.21 14.0499 16.53 13.9999 16.75 13.7899L21.75 9.03994C21.9 8.89994 21.98 8.69994 21.98 8.49994C21.98 8.29994 21.9 8.09994 21.75 7.95994L16.75 3.20994C16.53 2.99994 16.21 2.93994 15.94 3.05994C15.67 3.17994 15.49 3.44994 15.49 3.74994V6.02994C13.47 6.15994 11.83 6.83994 10.62 8.05994C8.51 10.1699 8.5 13.1299 8.5 13.2499C8.5 13.5599 8.69 13.8299 8.97 13.9499ZM17 10.2499C17 9.83994 16.66 9.49994 16.25 9.49994C13.73 9.49994 11.66 10.5199 10.33 11.4199C10.87 9.72994 12.33 7.49994 16.25 7.49994C16.66 7.49994 17 7.15994 17 6.74994V5.49994L20.16 8.49994L17 11.4999V10.2499ZM12 4.75C12 4.33579 11.6642 4 11.25 4H8.75C6.95507 4 5.5 5.45507 5.5 7.25V15.25C5.5 17.0449 6.95507 18.5 8.75 18.5H16.75C18.5449 18.5 20 17.0449 20 15.25V14.75C20 14.3358 19.6642 14 19.25 14C18.8358 14 18.5 14.3358 18.5 14.75V15.25C18.5 16.2165 17.7165 17 16.75 17H8.75C7.7835 17 7 16.2165 7 15.25V7.25C7 6.2835 7.7835 5.5 8.75 5.5H11.25C11.6642 5.5 12 5.16421 12 4.75ZM4.5 7.25006C4.5 7.16835 4.50231 7.08717 4.50686 7.00659C3.60095 7.58339 3 8.59654 3 9.75006V15.2501C3 18.4257 5.57436 21.0001 8.75 21.0001H14.25C15.4035 21.0001 16.4167 20.3991 16.9935 19.4932C16.9129 19.4978 16.8317 19.5001 16.75 19.5001H8.75C6.40279 19.5001 4.5 17.5973 4.5 15.2501V7.25006Z" 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/share_multiple_24_regular.svg";Details
| Name | Share Multiple |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_share_multiple_24_regular.svg |
| Filled file | ic_fluent_share_multiple_24_filled.svg |
| React components | ShareMultiple24Regular, ShareMultiple24Filled |
| License | MIT (© Microsoft Corporation) |