send icon
send from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.
- Name
- send
- Set
- IonIcons
- Style
- Regular
- Viewbox
- 512×512
- License
- MIT
2 other variants in IonIcons
The same icon in other sets
sendAkar Iconssend-outlinedAnt Design IconssendBootstrap IconssendBoxIcons v2sendBoxIcons v2 SolidsendCarbonsendCodiconssendFeather Iconssend-16-filledFluent UI System Iconssend-16Fluent UI System Color IconssendHuge IconssendIconParksendIconPark OutlinesendIconoirsendLucidesendMajesticonssendMaterial SymbolssendMaterial Symbols LightsendMaterial Design Iconssend-fillMingCute IconsendMyna UI IconssendPixelarticonssendPrime IconssendTabler Icons
Use the send icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="m476.59 227.05l-.16-.07L49.35 49.84A23.56 23.56 0 0 0 27.14 52A24.65 24.65 0 0 0 16 72.59v113.29a24 24 0 0 0 19.52 23.57l232.93 43.07a4 4 0 0 1 0 7.86L35.53 303.45A24 24 0 0 0 16 327v113.31A23.57 23.57 0 0 0 26.59 460a23.94 23.94 0 0 0 13.22 4a24.55 24.55 0 0 0 9.52-1.93L476.4 285.94l.19-.09a32 32 0 0 0 0-58.8"/></svg>
React
import type { SVGProps } from "react";
export function IonSend(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="m476.59 227.05l-.16-.07L49.35 49.84A23.56 23.56 0 0 0 27.14 52A24.65 24.65 0 0 0 16 72.59v113.29a24 24 0 0 0 19.52 23.57l232.93 43.07a4 4 0 0 1 0 7.86L35.53 303.45A24 24 0 0 0 16 327v113.31A23.57 23.57 0 0 0 26.59 460a23.94 23.94 0 0 0 13.22 4a24.55 24.55 0 0 0 9.52-1.93L476.4 285.94l.19-.09a32 32 0 0 0 0-58.8"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="m476.59 227.05l-.16-.07L49.35 49.84A23.56 23.56 0 0 0 27.14 52A24.65 24.65 0 0 0 16 72.59v113.29a24 24 0 0 0 19.52 23.57l232.93 43.07a4 4 0 0 1 0 7.86L35.53 303.45A24 24 0 0 0 16 327v113.31A23.57 23.57 0 0 0 26.59 460a23.94 23.94 0 0 0 13.22 4a24.55 24.55 0 0 0 9.52-1.93L476.4 285.94l.19-.09a32 32 0 0 0 0-58.8"/></svg> </template>
CSS
.icon-send {
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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m476.59%20227.05l-.16-.07L49.35%2049.84A23.56%2023.56%200%200%200%2027.14%2052A24.65%2024.65%200%200%200%2016%2072.59v113.29a24%2024%200%200%200%2019.52%2023.57l232.93%2043.07a4%204%200%200%201%200%207.86L35.53%20303.45A24%2024%200%200%200%2016%20327v113.31A23.57%2023.57%200%200%200%2026.59%20460a23.94%2023.94%200%200%200%2013.22%204a24.55%2024.55%200%200%200%209.52-1.93L476.4%20285.94l.19-.09a32%2032%200%200%200%200-58.8%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%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m476.59%20227.05l-.16-.07L49.35%2049.84A23.56%2023.56%200%200%200%2027.14%2052A24.65%2024.65%200%200%200%2016%2072.59v113.29a24%2024%200%200%200%2019.52%2023.57l232.93%2043.07a4%204%200%200%201%200%207.86L35.53%20303.45A24%2024%200%200%200%2016%20327v113.31A23.57%2023.57%200%200%200%2026.59%20460a23.94%2023.94%200%200%200%2013.22%204a24.55%2024.55%200%200%200%209.52-1.93L476.4%20285.94l.19-.09a32%2032%200%200%200%200-58.8%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/send.svg?color=%231a73e8&size=48