Skip to content
Cuelark UI

Hover the icon or press Play. Suggested motion: tada. Pick another to preview it and update the animated code:

VS Code Icons · VscMailRead

Mail Read icon

A free mail read icon from VS Code Icons, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.

Also known asemail iconenvelope iconinbox iconletter iconmessage icontray iconmessages iconbook icon
License
CC BY 4.0 license
Project
github.com
Download SVG
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/vscode-codicons/mail-read.json
components/icons/vscode-codicons-mail-read.tsx
import * as React from "react";

/**
 * Mail Read from VS Code Icons (https://github.com/microsoft/vscode-codicons), CC BY 4.0.
 * Via Cuelark UI: ui.cuelark.com/icons/vscode-codicons/mail-read. Sized in em, colored by currentColor.
 */
export function VscMailReadIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 16 16"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M13.839 3.64402L8.419 1.14302C8.153 1.02002 7.848 1.02102 7.58 1.14302L2.161 3.64402C1.456 3.97002 1 4.68302 1 5.46002V11C1 12.103 1.897 13 3 13H13C14.103 13 15 12.103 15 11V5.46002C15 4.68202 14.544 3.96902 13.839 3.64402ZM2.581 4.55202L8 2.05102L13.419 4.55202C13.697 4.68002 13.897 4.92802 13.969 5.21802L8 8.43302L2.031 5.21802C2.104 4.92802 2.303 4.68002 2.581 4.55202ZM13 12H3C2.448 12 2 11.552 2 11V6.33702L7.763 9.44002C7.837 9.48002 7.919 9.50002 8 9.50002C8.081 9.50002 8.163 9.48002 8.237 9.44002L14 6.33702V11C14 11.552 13.552 12 13 12Z"
      />
    </svg>
  );
}
With react-icons
import { VscMailRead } from "react-icons/vsc";

export function Example() {
  return <VscMailRead className="size-5" />;
}
mail-read.svg
<svg
  viewBox="0 0 16 16"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M13.839 3.64402L8.419 1.14302C8.153 1.02002 7.848 1.02102 7.58 1.14302L2.161 3.64402C1.456 3.97002 1 4.68302 1 5.46002V11C1 12.103 1.897 13 3 13H13C14.103 13 15 12.103 15 11V5.46002C15 4.68202 14.544 3.96902 13.839 3.64402ZM2.581 4.55202L8 2.05102L13.419 4.55202C13.697 4.68002 13.897 4.92802 13.969 5.21802L8 8.43302L2.031 5.21802C2.104 4.92802 2.303 4.68002 2.581 4.55202ZM13 12H3C2.448 12 2 11.552 2 11V6.33702L7.763 9.44002C7.837 9.48002 7.919 9.50002 8 9.50002C8.081 9.50002 8.163 9.48002 8.237 9.44002L14 6.33702V11C14 11.552 13.552 12 13 12Z"
  />
</svg>
Attribution
"Mail Read" icon from VS Code Icons (https://github.com/microsoft/vscode-codicons), licensed under CC BY 4.0 license.

Related icons: email, envelope, inbox, letter