Calendar Today icon
Used to change view to today. The Calendar Today icon is part of Microsoft's Fluent UI System Icons, available here in regular and filled styles in 4 sizes from 16 to 28 px. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.
Every size and style
Microsoft draws each size separately so icons stay crisp, rather than scaling one drawing. Pick a style and size to preview it, download it, or copy the code for your platform.
Regular, 24 px
ic_fluent_calendar_today_24_regular.svg
Calendar Today icon in React
npm install @fluentui/react-icons
import { CalendarToday24Regular } from "@fluentui/react-icons";
export function Example() {
return <CalendarToday24Regular aria-label="Calendar Today" />;
}Use the Calendar Today icon in React
Install Microsoft's @fluentui/react-icons package, then import the component. Icons inherit the current text color, and you can size them with CSS.
npm install @fluentui/react-icons
import { CalendarToday24Regular, CalendarToday24Filled } from "@fluentui/react-icons";
export function Example() {
return <CalendarToday24Regular aria-label="Calendar Today" />;
}Coding agents can look up this component through the Fluent Icons MCP server.
Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_calendar_today_24_regular.svg" width="24" height="24" alt="Calendar Today"> Or paste the SVG markup inline. Setting fill="currentColor" makes the icon follow the text color of its parent:
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M21 6.25C21 4.45507 19.5449 3 17.75 3H6.25C4.45507 3 3 4.45507 3 6.25V17.75C3 19.5449 4.45507 21 6.25 21H10.25C10.25 21 10.25 20.5184 10.25 20.25V19.5H6.25C5.2835 19.5 4.5 18.7165 4.5 17.75V8.5H19.5V17.75C19.5 18.7165 18.7165 19.5 17.75 19.5H13.75V20.25C13.75 20.5184 13.75 21 13.75 21H17.75C19.5449 21 21 19.5449 21 17.75V6.25ZM6.25 4.5H17.75C18.7165 4.5 19.5 5.2835 19.5 6.25V7H4.5V6.25C4.5 5.2835 5.2835 4.5 6.25 4.5ZM13.25 11.75C13.25 12.4404 12.6904 13 12 13C11.3096 13 10.75 12.4404 10.75 11.75C10.75 11.0596 11.3096 10.5 12 10.5C12.6904 10.5 13.25 11.0596 13.25 11.75ZM13.7517 18.3106C14.0613 18.5857 14.5353 18.5579 14.8105 18.2483C15.0857 17.9387 15.0578 17.4646 14.7482 17.1894L12.4982 15.1894C12.2141 14.9369 11.7858 14.9369 11.5017 15.1894L9.25167 17.1894C8.94209 17.4646 8.9142 17.9387 9.18939 18.2483C9.46458 18.5579 9.93863 18.5857 10.2482 18.3106L11.25 17.4201V21.25C11.25 21.6642 11.5857 22 12 22C12.4142 22 12.75 21.6642 12.75 21.25V17.4201L13.7517 18.3106Z" fill="currentColor"/></svg>Details
| Name | Calendar Today |
|---|---|
| Styles | Regular (outlined), Filled |
| Sizes | 16 px, 20 px, 24 px, 28 px |
| Regular (outlined) file | ic_fluent_calendar_today_24_regular.svg |
| Filled file | ic_fluent_calendar_today_24_filled.svg |
| React (Regular) | CalendarToday16Regular, CalendarToday20Regular, CalendarToday24Regular, CalendarToday28Regular |
| React (Filled) | CalendarToday16Filled, CalendarToday20Filled, CalendarToday24Filled, CalendarToday28Filled |
| License | MIT (© Microsoft Corporation) |