Calendar Icon
Free SVG icon from the IcoFont collection. Download or copy for use in any project.
The Calendar icon is commonly used in booking systems, scheduling apps and event listings. Available as a free SVG - copy the code or download directly.
img tag
<img src="https://proicons.com/icon/305311.svg" alt="Calendar icon" width="24" height="24">
React JSX
<img src="https://proicons.com/icon/305311.svg" alt="Calendar icon" width={24} height={24} />
Vue template
<img src="https://proicons.com/icon/305311.svg" alt="Calendar icon" :width="24" :height="24" />
CSS background
.icon-calendar {
background-image: url('https://proicons.com/icon/305311.svg');
background-size: contain;
background-repeat: no-repeat;
width: 24px;
height: 24px;
display: inline-block;
}
SVG markup
<svg width="64" height="64" viewBox="0 0 1000 1000" xmlns="http://www.w3.org/2000/svg"><path d="M739 153v-37c-1-23-15-43-38-51-23-7-48 1-62 19-8 11-12 23-12 36v33c0 5-4 9-9 9h-59c-5 0-10-4-10-9 0-11 1-22 0-33 0-26-13-46-35-54-37-13-75 12-76 50v37c0 5-4 9-10 9h-60c-5 0-10-4-10-9 1-16 2-31 0-45-2-21-16-36-36-43-20-6-39-2-55 11-15 12-19 28-19 46v31c0 6-4 10-10 10H74c-6 0-10 4-10 9v756c0 5 5 9 10 9h852c5 0 10-4 10-9V172c0-5-5-9-10-9H748c-5 0-9-4-9-10zM326 900H112c-6 0-10-4-10-9V741c0-5 5-9 10-9h214c5 0 9 4 9 9v150c0 5-4 9-9 9zm0-207H112c-6 0-10-4-10-9V526c0-5 5-9 10-9h214c5 0 9 4 9 9v158c0 5-4 9-9 9zm0-215H112c-6 0-10-4-10-9V317c0-5 5-9 10-9h214c5 0 9 4 9 9v152c0 5-4 9-9 9zm285 422H384c-5 0-9-4-9-9V742c0-5 4-10 9-10h227c5 0 9 5 9 10v149c0 5-4 9-9 9zm10-212c-1 3-5 6-10 6H384c-5 0-9-5-9-10V526c0-5 2-9 5-10h229c9 0 12 2 12 11v161zm0-215c0 3-4 5-10 5H384c-5 0-9-4-9-9V317c0-5 2-10 5-10h229c9 0 12 2 12 12v154zm48 44h219c5 0 9 4 9 9v158c0 5-4 10-9 10H669c-6 0-10-5-10-10V526c0-5 4-9 10-9zm219 383H669c-6 0-10-4-10-9V742c0-6 4-10 10-10h219c5 0 9 4 9 10v149c1 5-4 9-9 9zm0-422H669c-6 0-10-4-10-9V317c0-5 4-9 10-9h219c5 0 9 4 9 9v152c1 5-4 9-9 9z"/></svg>
More from IcoFont
View all
Calendar in other icon packs
Copied!