Mail All Read icon
Used in general mail scenarios. The Mail All Read 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 Mail All Read 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 { MailAllRead24Regular, MailAllRead24Filled } from "@fluentui/react-icons";
export function Example() {
return <MailAllRead24Regular aria-label="Mail All Read" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_mail_all_read_24_regular.svg" width="24" height="24" alt="Mail All Read"> 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="M11.3591 1.84158C11.1353 1.71947 10.8647 1.71947 10.6409 1.84158L2.82981 6.10215C2.31828 6.38117 2 6.91732 2 7.5V15.75C2 17.5449 3.45507 19 5.25 19H16.75C18.5449 19 20 17.5449 20 15.75V7.5C20 6.91732 19.6817 6.38117 19.1702 6.10215L11.3591 1.84158ZM11 11.1457L3.85791 7.25L11 3.35432L18.1421 7.25L11 11.1457ZM11.3591 12.6584L18.5 8.76341V15.75C18.5 16.7165 17.7165 17.5 16.75 17.5H5.25C4.2835 17.5 3.5 16.7165 3.5 15.75V8.76341L10.6409 12.6584C10.8647 12.7805 11.1353 12.7805 11.3591 12.6584ZM21.001 7.51126C21.9028 8.08885 22.5005 9.09963 22.5005 10.25V16.25C22.5005 19.1495 20.15 21.5 17.2505 21.5H8.25046C7.10009 21.5 6.08931 20.9023 5.51172 20.0005L17.2505 20C19.3215 20 21.0005 18.3211 21.0005 16.25L21.001 7.51126Z" 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/mail_all_read_24_regular.svg";Details
| Name | Mail All Read |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_mail_all_read_24_regular.svg |
| Filled file | ic_fluent_mail_all_read_24_filled.svg |
| React components | MailAllRead24Regular, MailAllRead24Filled |
| License | MIT (© Microsoft Corporation) |