attach email icon

attach-email-outline-rounded from Material Symbols Light by Google · Outline Rounded · Communicate · Apache-2.0 Free for personal and commercial use.

Name: attach-email-outline-rounded
Set: Material Symbols Light
Style: Outline Rounded
Category: Communicate
Viewbox: 24×24
License: Apache 2.0

5 other variants in Material Symbols Light

attach-email attach-email-outline attach-email-outline-sharp attach-email-rounded attach-email-sharp

The same icon in other sets

attach-emailMaterial Symbols

More communicate icons from Material Symbols Light

Use the attach email icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.48 17q-.665 0-1.14-.475t-.475-1.14V4.615q0-.666.475-1.14T3.48 3h14.77q.666 0 1.14.475q.476.474.476 1.14v4.27q0 .212-.144.356t-.357.143t-.356-.143t-.144-.357v-4l-7.55 4.946q-.106.055-.215.093q-.108.037-.233.037t-.234-.037t-.215-.093L2.866 4.884v10.5q0 .27.173.443T3.48 16h9.615q.213 0 .357.144t.143.357t-.143.356t-.357.143zm7.386-8l7.692-5H3.173zm-8-4.115v.211v-.778v.001V4v.32v-.016v.792zV16zm16 16.077q-1.362 0-2.316-.954t-.954-2.316v-4.5q0-.791.547-1.338t1.338-.546t1.338.546q.547.547.547 1.338v4q0 .213-.144.357t-.357.143t-.356-.143t-.144-.357v-4q0-.373-.255-.628q-.256-.256-.63-.256t-.628.256t-.256.628v4.5q0 .936.668 1.603q.667.667 1.605.667t1.601-.667q.665-.667.665-1.603v-3.5q0-.212.143-.356t.357-.144t.356.144t.144.356v3.5q0 1.362-.954 2.316t-2.316.954"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightAttachEmailOutlineRounded(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="M3.48 17q-.665 0-1.14-.475t-.475-1.14V4.615q0-.666.475-1.14T3.48 3h14.77q.666 0 1.14.475q.476.474.476 1.14v4.27q0 .212-.144.356t-.357.143t-.356-.143t-.144-.357v-4l-7.55 4.946q-.106.055-.215.093q-.108.037-.233.037t-.234-.037t-.215-.093L2.866 4.884v10.5q0 .27.173.443T3.48 16h9.615q.213 0 .357.144t.143.357t-.143.356t-.357.143zm7.386-8l7.692-5H3.173zm-8-4.115v.211v-.778v.001V4v.32v-.016v.792zV16zm16 16.077q-1.362 0-2.316-.954t-.954-2.316v-4.5q0-.791.547-1.338t1.338-.546t1.338.546q.547.547.547 1.338v4q0 .213-.144.357t-.357.143t-.356-.143t-.144-.357v-4q0-.373-.255-.628q-.256-.256-.63-.256t-.628.256t-.256.628v4.5q0 .936.668 1.603q.667.667 1.605.667t1.601-.667q.665-.667.665-1.603v-3.5q0-.212.143-.356t.357-.144t.356.144t.144.356v3.5q0 1.362-.954 2.316t-2.316.954"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.48 17q-.665 0-1.14-.475t-.475-1.14V4.615q0-.666.475-1.14T3.48 3h14.77q.666 0 1.14.475q.476.474.476 1.14v4.27q0 .212-.144.356t-.357.143t-.356-.143t-.144-.357v-4l-7.55 4.946q-.106.055-.215.093q-.108.037-.233.037t-.234-.037t-.215-.093L2.866 4.884v10.5q0 .27.173.443T3.48 16h9.615q.213 0 .357.144t.143.357t-.143.356t-.357.143zm7.386-8l7.692-5H3.173zm-8-4.115v.211v-.778v.001V4v.32v-.016v.792zV16zm16 16.077q-1.362 0-2.316-.954t-.954-2.316v-4.5q0-.791.547-1.338t1.338-.546t1.338.546q.547.547.547 1.338v4q0 .213-.144.357t-.357.143t-.356-.143t-.144-.357v-4q0-.373-.255-.628q-.256-.256-.63-.256t-.628.256t-.256.628v4.5q0 .936.668 1.603q.667.667 1.605.667t1.601-.667q.665-.667.665-1.603v-3.5q0-.212.143-.356t.357-.144t.356.144t.144.356v3.5q0 1.362-.954 2.316t-2.316.954"/></svg>
</template>

CSS

.icon-attach-email-outline-rounded {
  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%22M3.48%2017q-.665%200-1.14-.475t-.475-1.14V4.615q0-.666.475-1.14T3.48%203h14.77q.666%200%201.14.475q.476.474.476%201.14v4.27q0%20.212-.144.356t-.357.143t-.356-.143t-.144-.357v-4l-7.55%204.946q-.106.055-.215.093q-.108.037-.233.037t-.234-.037t-.215-.093L2.866%204.884v10.5q0%20.27.173.443T3.48%2016h9.615q.213%200%20.357.144t.143.357t-.143.356t-.357.143zm7.386-8l7.692-5H3.173zm-8-4.115v.211v-.778v.001V4v.32v-.016v.792zV16zm16%2016.077q-1.362%200-2.316-.954t-.954-2.316v-4.5q0-.791.547-1.338t1.338-.546t1.338.546q.547.547.547%201.338v4q0%20.213-.144.357t-.357.143t-.356-.143t-.144-.357v-4q0-.373-.255-.628q-.256-.256-.63-.256t-.628.256t-.256.628v4.5q0%20.936.668%201.603q.667.667%201.605.667t1.601-.667q.665-.667.665-1.603v-3.5q0-.212.143-.356t.357-.144t.356.144t.144.356v3.5q0%201.362-.954%202.316t-2.316.954%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%22M3.48%2017q-.665%200-1.14-.475t-.475-1.14V4.615q0-.666.475-1.14T3.48%203h14.77q.666%200%201.14.475q.476.474.476%201.14v4.27q0%20.212-.144.356t-.357.143t-.356-.143t-.144-.357v-4l-7.55%204.946q-.106.055-.215.093q-.108.037-.233.037t-.234-.037t-.215-.093L2.866%204.884v10.5q0%20.27.173.443T3.48%2016h9.615q.213%200%20.357.144t.143.357t-.143.356t-.357.143zm7.386-8l7.692-5H3.173zm-8-4.115v.211v-.778v.001V4v.32v-.016v.792zV16zm16%2016.077q-1.362%200-2.316-.954t-.954-2.316v-4.5q0-.791.547-1.338t1.338-.546t1.338.546q.547.547.547%201.338v4q0%20.213-.144.357t-.357.143t-.356-.143t-.144-.357v-4q0-.373-.255-.628q-.256-.256-.63-.256t-.628.256t-.256.628v4.5q0%20.936.668%201.603q.667.667%201.605.667t1.601-.667q.665-.667.665-1.603v-3.5q0-.212.143-.356t.357-.144t.356.144t.144.356v3.5q0%201.362-.954%202.316t-2.316.954%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/attach-email-outline-rounded.svg?color=%231a73e8&size=48