calendar add icon

calendar-add-duotone from Reicon by REICON · Duotone · Time · MIT Free for personal and commercial use.

Name
calendar-add-duotone
Set
Reicon
Style
Duotone
Category
Time
Viewbox
24×24
License
MIT

2 other variants in Reicon

The same icon in other sets

All calendar add icons →

More time icons from Reicon

Use the calendar add icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M6.96 2c.418 0 .756.31.756.692V4.09c.67-.012 1.422-.012 2.268-.012h4.032c.846 0 1.597 0 2.268.012V2.692c0-.382.338-.692.756-.692s.756.31.756.692V4.15c1.45.106 2.403.368 3.103 1.008c.7.641.985 1.513 1.101 2.842v1H2V8c.116-1.329.401-2.2 1.101-2.842c.7-.64 1.652-.902 3.103-1.008V2.692c0-.382.339-.692.756-.692"/><path d="M22 14v-2c0-.839-.013-2.335-.026-3H2.006c-.013.665 0 2.161 0 3v2c0 3.771 0 5.657 1.17 6.828C4.349 22 6.234 22 10.004 22h4c3.77 0 5.654 0 6.826-1.172S22 17.771 22 14" opacity=".5"/><path fill-rule="evenodd" d="M16 13.25a.75.75 0 0 1 .75.75v1.25H18a.75.75 0 0 1 0 1.5h-1.25V18a.75.75 0 0 1-1.5 0v-1.25H14a.75.75 0 0 1 0-1.5h1.25V14a.75.75 0 0 1 .75-.75" clip-rule="evenodd"/></g></svg>

React

import type { SVGProps } from "react";

export function ReiconCalendarAddDuotone(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M6.96 2c.418 0 .756.31.756.692V4.09c.67-.012 1.422-.012 2.268-.012h4.032c.846 0 1.597 0 2.268.012V2.692c0-.382.338-.692.756-.692s.756.31.756.692V4.15c1.45.106 2.403.368 3.103 1.008c.7.641.985 1.513 1.101 2.842v1H2V8c.116-1.329.401-2.2 1.101-2.842c.7-.64 1.652-.902 3.103-1.008V2.692c0-.382.339-.692.756-.692"/><path d="M22 14v-2c0-.839-.013-2.335-.026-3H2.006c-.013.665 0 2.161 0 3v2c0 3.771 0 5.657 1.17 6.828C4.349 22 6.234 22 10.004 22h4c3.77 0 5.654 0 6.826-1.172S22 17.771 22 14" opacity=".5"/><path fillRule="evenodd" d="M16 13.25a.75.75 0 0 1 .75.75v1.25H18a.75.75 0 0 1 0 1.5h-1.25V18a.75.75 0 0 1-1.5 0v-1.25H14a.75.75 0 0 1 0-1.5h1.25V14a.75.75 0 0 1 .75-.75" clipRule="evenodd"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><g fill="currentColor"><path d="M6.96 2c.418 0 .756.31.756.692V4.09c.67-.012 1.422-.012 2.268-.012h4.032c.846 0 1.597 0 2.268.012V2.692c0-.382.338-.692.756-.692s.756.31.756.692V4.15c1.45.106 2.403.368 3.103 1.008c.7.641.985 1.513 1.101 2.842v1H2V8c.116-1.329.401-2.2 1.101-2.842c.7-.64 1.652-.902 3.103-1.008V2.692c0-.382.339-.692.756-.692"/><path d="M22 14v-2c0-.839-.013-2.335-.026-3H2.006c-.013.665 0 2.161 0 3v2c0 3.771 0 5.657 1.17 6.828C4.349 22 6.234 22 10.004 22h4c3.77 0 5.654 0 6.826-1.172S22 17.771 22 14" opacity=".5"/><path fill-rule="evenodd" d="M16 13.25a.75.75 0 0 1 .75.75v1.25H18a.75.75 0 0 1 0 1.5h-1.25V18a.75.75 0 0 1-1.5 0v-1.25H14a.75.75 0 0 1 0-1.5h1.25V14a.75.75 0 0 1 .75-.75" clip-rule="evenodd"/></g></svg>
</template>

CSS

.icon-calendar-add-duotone {
  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%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M6.96%202c.418%200%20.756.31.756.692V4.09c.67-.012%201.422-.012%202.268-.012h4.032c.846%200%201.597%200%202.268.012V2.692c0-.382.338-.692.756-.692s.756.31.756.692V4.15c1.45.106%202.403.368%203.103%201.008c.7.641.985%201.513%201.101%202.842v1H2V8c.116-1.329.401-2.2%201.101-2.842c.7-.64%201.652-.902%203.103-1.008V2.692c0-.382.339-.692.756-.692%22%2F%3E%3Cpath%20d%3D%22M22%2014v-2c0-.839-.013-2.335-.026-3H2.006c-.013.665%200%202.161%200%203v2c0%203.771%200%205.657%201.17%206.828C4.349%2022%206.234%2022%2010.004%2022h4c3.77%200%205.654%200%206.826-1.172S22%2017.771%2022%2014%22%20opacity%3D%22.5%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M16%2013.25a.75.75%200%200%201%20.75.75v1.25H18a.75.75%200%200%201%200%201.5h-1.25V18a.75.75%200%200%201-1.5%200v-1.25H14a.75.75%200%200%201%200-1.5h1.25V14a.75.75%200%200%201%20.75-.75%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%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%3Cg%20fill%3D%22currentColor%22%3E%3Cpath%20d%3D%22M6.96%202c.418%200%20.756.31.756.692V4.09c.67-.012%201.422-.012%202.268-.012h4.032c.846%200%201.597%200%202.268.012V2.692c0-.382.338-.692.756-.692s.756.31.756.692V4.15c1.45.106%202.403.368%203.103%201.008c.7.641.985%201.513%201.101%202.842v1H2V8c.116-1.329.401-2.2%201.101-2.842c.7-.64%201.652-.902%203.103-1.008V2.692c0-.382.339-.692.756-.692%22%2F%3E%3Cpath%20d%3D%22M22%2014v-2c0-.839-.013-2.335-.026-3H2.006c-.013.665%200%202.161%200%203v2c0%203.771%200%205.657%201.17%206.828C4.349%2022%206.234%2022%2010.004%2022h4c3.77%200%205.654%200%206.826-1.172S22%2017.771%2022%2014%22%20opacity%3D%22.5%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M16%2013.25a.75.75%200%200%201%20.75.75v1.25H18a.75.75%200%200%201%200%201.5h-1.25V18a.75.75%200%200%201-1.5%200v-1.25H14a.75.75%200%200%201%200-1.5h1.25V14a.75.75%200%200%201%20.75-.75%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/reicon/calendar-add-duotone.svg?color=%231a73e8&size=48

Calendar Add duotone icon — Reicon · IconsDB