Clipboard Month icon

Use the Clipboard Month 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 { ClipboardMonth24Regular, ClipboardMonth24Filled } from "@fluentui/react-icons";

export function Example() {
  return <ClipboardMonth24Regular aria-label="Clipboard Month" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_clipboard_month_24_regular.svg" width="24" height="24" alt="Clipboard Month">

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="M8.25 12.5C8.94036 12.5 9.5 11.9404 9.5 11.25C9.5 10.5596 8.94036 10 8.25 10C7.55964 10 7 10.5596 7 11.25C7 11.9404 7.55964 12.5 8.25 12.5ZM8.25 16.5C8.94036 16.5 9.5 15.9404 9.5 15.25C9.5 14.5596 8.94036 14 8.25 14C7.55964 14 7 14.5596 7 15.25C7 15.9404 7.55964 16.5 8.25 16.5ZM17.5 11.25C17.5 11.9404 16.9404 12.5 16.25 12.5C15.5596 12.5 15 11.9404 15 11.25C15 10.5596 15.5596 10 16.25 10C16.9404 10 17.5 10.5596 17.5 11.25ZM12.25 12.5C12.9404 12.5 13.5 11.9404 13.5 11.25C13.5 10.5596 12.9404 10 12.25 10C11.5596 10 11 10.5596 11 11.25C11 11.9404 11.5596 12.5 12.25 12.5ZM13.5 15.25C13.5 15.9404 12.9404 16.5 12.25 16.5C11.5596 16.5 11 15.9404 11 15.25C11 14.5596 11.5596 14 12.25 14C12.9404 14 13.5 14.5596 13.5 15.25ZM15.994 4.08443C15.9092 2.9191 14.937 2 13.75 2H10.25C9.09205 2 8.13841 2.87472 8.01379 3.99944L6.25 4C5.00736 4 4 5.00736 4 6.25V19.75C4 20.9926 5.00736 22 6.25 22H17.75C18.9926 22 20 20.9926 20 19.75V6.25C20 5.00736 18.9926 4 17.75 4L15.9862 3.99944C15.9893 4.02761 15.9919 4.05595 15.994 4.08443ZM15.9948 4.09595L16 4.25C16 4.19823 15.9983 4.14685 15.9948 4.09595ZM10.25 6.5H13.75C14.53 6.5 15.2174 6.10307 15.621 5.50016L17.75 5.5C18.1642 5.5 18.5 5.83579 18.5 6.25V19.75C18.5 20.1642 18.1642 20.5 17.75 20.5H6.25C5.83579 20.5 5.5 20.1642 5.5 19.75V6.25C5.5 5.83579 5.83579 5.5 6.25 5.5L8.37902 5.5002C8.78267 6.1031 9.46997 6.5 10.25 6.5ZM10.25 3.5H13.75C14.1642 3.5 14.5 3.83579 14.5 4.25C14.5 4.66421 14.1642 5 13.75 5H10.25C9.83579 5 9.5 4.66421 9.5 4.25C9.5 3.83579 9.83579 3.5 10.25 3.5Z" fill="currentColor"/></svg>

Use it from the SVG package

Microsoft's @fluentui/svg-icons package contains the raw SVG files, which works well with bundlers that import SVGs:

npm install @fluentui/svg-icons

import icon from "@fluentui/svg-icons/icons/clipboard_month_24_regular.svg";

Details

Keywords

copymemoryanalog