read aloud icon
read-aloud-24-filled from Fluent UI System Icons by Microsoft Corporation · 24 Filled · MIT Free for personal and commercial use.
- Name
- read-aloud-24-filled
- Set
- Fluent UI System Icons
- Style
- 24 Filled
- Viewbox
- 24×24
- License
- MIT
8 other variants in Fluent UI System Icons
Use the read aloud icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M14.592 2.081a1 1 0 0 1 1.327-.489c.264.134.001 0 .001 0l.001.001l.003.002l.007.003l.022.01a5 5 0 0 1 .306.16c.199.109.474.27.799.488a12.3 12.3 0 0 1 2.315 2.017c1.652 1.859 3.164 4.765 2.618 8.86a1 1 0 0 1-1.982-.265c.454-3.406-.783-5.75-2.131-7.266a10.3 10.3 0 0 0-1.935-1.686a9 9 0 0 0-.82-.487l-.038-.019l-.006-.003a1 1 0 0 1-.487-1.326M9.931 4.635a1 1 0 0 0-1.861 0l-5.5 14a1 1 0 0 0 1.861.73L6.146 15h5.708l1.716 4.365a1 1 0 0 0 1.861-.73zM11.069 13H6.932L9 7.735zm4.378-7.394a1 1 0 0 0-.894 1.789c.29.145.792.576 1.227 1.263c.422.669.72 1.486.72 2.342a1 1 0 0 0 2 0c0-1.314-.452-2.496-1.03-3.41c-.565-.895-1.313-1.63-2.023-1.984"/></svg>
React
import type { SVGProps } from "react";
export function FluentReadAloud24Filled(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M14.592 2.081a1 1 0 0 1 1.327-.489c.264.134.001 0 .001 0l.001.001l.003.002l.007.003l.022.01a5 5 0 0 1 .306.16c.199.109.474.27.799.488a12.3 12.3 0 0 1 2.315 2.017c1.652 1.859 3.164 4.765 2.618 8.86a1 1 0 0 1-1.982-.265c.454-3.406-.783-5.75-2.131-7.266a10.3 10.3 0 0 0-1.935-1.686a9 9 0 0 0-.82-.487l-.038-.019l-.006-.003a1 1 0 0 1-.487-1.326M9.931 4.635a1 1 0 0 0-1.861 0l-5.5 14a1 1 0 0 0 1.861.73L6.146 15h5.708l1.716 4.365a1 1 0 0 0 1.861-.73zM11.069 13H6.932L9 7.735zm4.378-7.394a1 1 0 0 0-.894 1.789c.29.145.792.576 1.227 1.263c.422.669.72 1.486.72 2.342a1 1 0 0 0 2 0c0-1.314-.452-2.496-1.03-3.41c-.565-.895-1.313-1.63-2.023-1.984"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M14.592 2.081a1 1 0 0 1 1.327-.489c.264.134.001 0 .001 0l.001.001l.003.002l.007.003l.022.01a5 5 0 0 1 .306.16c.199.109.474.27.799.488a12.3 12.3 0 0 1 2.315 2.017c1.652 1.859 3.164 4.765 2.618 8.86a1 1 0 0 1-1.982-.265c.454-3.406-.783-5.75-2.131-7.266a10.3 10.3 0 0 0-1.935-1.686a9 9 0 0 0-.82-.487l-.038-.019l-.006-.003a1 1 0 0 1-.487-1.326M9.931 4.635a1 1 0 0 0-1.861 0l-5.5 14a1 1 0 0 0 1.861.73L6.146 15h5.708l1.716 4.365a1 1 0 0 0 1.861-.73zM11.069 13H6.932L9 7.735zm4.378-7.394a1 1 0 0 0-.894 1.789c.29.145.792.576 1.227 1.263c.422.669.72 1.486.72 2.342a1 1 0 0 0 2 0c0-1.314-.452-2.496-1.03-3.41c-.565-.895-1.313-1.63-2.023-1.984"/></svg> </template>
CSS
.icon-read-aloud-24-filled {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M14.592%202.081a1%201%200%200%201%201.327-.489c.264.134.001%200%20.001%200l.001.001l.003.002l.007.003l.022.01a5%205%200%200%201%20.306.16c.199.109.474.27.799.488a12.3%2012.3%200%200%201%202.315%202.017c1.652%201.859%203.164%204.765%202.618%208.86a1%201%200%200%201-1.982-.265c.454-3.406-.783-5.75-2.131-7.266a10.3%2010.3%200%200%200-1.935-1.686a9%209%200%200%200-.82-.487l-.038-.019l-.006-.003a1%201%200%200%201-.487-1.326M9.931%204.635a1%201%200%200%200-1.861%200l-5.5%2014a1%201%200%200%200%201.861.73L6.146%2015h5.708l1.716%204.365a1%201%200%200%200%201.861-.73zM11.069%2013H6.932L9%207.735zm4.378-7.394a1%201%200%200%200-.894%201.789c.29.145.792.576%201.227%201.263c.422.669.72%201.486.72%202.342a1%201%200%200%200%202%200c0-1.314-.452-2.496-1.03-3.41c-.565-.895-1.313-1.63-2.023-1.984%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M14.592%202.081a1%201%200%200%201%201.327-.489c.264.134.001%200%20.001%200l.001.001l.003.002l.007.003l.022.01a5%205%200%200%201%20.306.16c.199.109.474.27.799.488a12.3%2012.3%200%200%201%202.315%202.017c1.652%201.859%203.164%204.765%202.618%208.86a1%201%200%200%201-1.982-.265c.454-3.406-.783-5.75-2.131-7.266a10.3%2010.3%200%200%200-1.935-1.686a9%209%200%200%200-.82-.487l-.038-.019l-.006-.003a1%201%200%200%201-.487-1.326M9.931%204.635a1%201%200%200%200-1.861%200l-5.5%2014a1%201%200%200%200%201.861.73L6.146%2015h5.708l1.716%204.365a1%201%200%200%200%201.861-.73zM11.069%2013H6.932L9%207.735zm4.378-7.394a1%201%200%200%200-.894%201.789c.29.145.792.576%201.227%201.263c.422.669.72%201.486.72%202.342a1%201%200%200%200%202%200c0-1.314-.452-2.496-1.03-3.41c-.565-.895-1.313-1.63-2.023-1.984%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/read-aloud-24-filled.svg?color=%231a73e8&size=48
