Skip to content
Cuelark UI

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

VS Code Icons · VscSymbolEvent

Symbol Event icon

A free symbol event 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 ascalendar icondate iconschedule iconplanner iconday iconmonth 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/symbol-event.json
components/icons/vscode-codicons-symbol-event.tsx
import * as React from "react";

/**
 * Symbol Event from VS Code Icons (https://github.com/microsoft/vscode-codicons), CC BY 4.0.
 * Via Cuelark UI: ui.cuelark.com/icons/vscode-codicons/symbol-event. Sized in em, colored by currentColor.
 */
export function VscSymbolEventIcon(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="M4.91447 1.71442C5.04078 1.29055 5.43053 1 5.87282 1H10.2786C10.9768 1 11.4601 1.69737 11.2149 2.35112L10.2216 5H12.2511C12.8791 5 13.229 5.72572 12.8379 6.21709L6.23096 14.5173C5.37726 15.5898 3.66907 14.7047 4.05299 13.3888L5.33338 9H3.74951C3.24769 9 2.88743 8.51673 3.03074 8.03581L4.91447 1.71442ZM10.2786 2H5.87282L4.08487 8H6.00009C6.15748 8 6.30568 8.0741 6.4001 8.20001C6.49453 8.32593 6.52416 8.48895 6.48008 8.64003L5.01297 13.6688C4.98941 13.7496 5.00096 13.8045 5.0195 13.8434C5.04067 13.888 5.08121 13.9314 5.13794 13.9608C5.19467 13.9902 5.25354 13.9983 5.30213 13.9899C5.34467 13.9826 5.39618 13.9603 5.44856 13.8945L11.7326 6H9.50009C9.3361 6 9.18254 5.91958 9.08913 5.7848C8.99572 5.65001 8.97435 5.47799 9.03193 5.32444L10.2786 2Z"
      />
    </svg>
  );
}
With react-icons
import { VscSymbolEvent } from "react-icons/vsc";

export function Example() {
  return <VscSymbolEvent className="size-5" />;
}
symbol-event.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="M4.91447 1.71442C5.04078 1.29055 5.43053 1 5.87282 1H10.2786C10.9768 1 11.4601 1.69737 11.2149 2.35112L10.2216 5H12.2511C12.8791 5 13.229 5.72572 12.8379 6.21709L6.23096 14.5173C5.37726 15.5898 3.66907 14.7047 4.05299 13.3888L5.33338 9H3.74951C3.24769 9 2.88743 8.51673 3.03074 8.03581L4.91447 1.71442ZM10.2786 2H5.87282L4.08487 8H6.00009C6.15748 8 6.30568 8.0741 6.4001 8.20001C6.49453 8.32593 6.52416 8.48895 6.48008 8.64003L5.01297 13.6688C4.98941 13.7496 5.00096 13.8045 5.0195 13.8434C5.04067 13.888 5.08121 13.9314 5.13794 13.9608C5.19467 13.9902 5.25354 13.9983 5.30213 13.9899C5.34467 13.9826 5.39618 13.9603 5.44856 13.8945L11.7326 6H9.50009C9.3361 6 9.18254 5.91958 9.08913 5.7848C8.99572 5.65001 8.97435 5.47799 9.03193 5.32444L10.2786 2Z"
  />
</svg>
Attribution
"Symbol Event" icon from VS Code Icons (https://github.com/microsoft/vscode-codicons), licensed under CC BY 4.0 license.

Related icons: calendar, date, schedule, planner