Text Header 6 icon

Use the Text Header 6 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 { TextHeader624Regular, TextHeader624Filled } from "@fluentui/react-icons";

export function Example() {
  return <TextHeader624Regular aria-label="Text Header 6" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_text_header_6_24_regular.svg" width="24" height="24" alt="Text Header 6">

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="M18 4.5C19.7584 4.5 21.1138 5.30651 22.0293 6.58008L22.207 6.84082L22.2451 6.90723C22.4172 7.24612 22.308 7.66703 21.9814 7.87695C21.6547 8.0867 21.2259 8.0113 20.9893 7.71387L20.9443 7.65137L20.8154 7.46094C20.1534 6.53558 19.2282 6 18 6C16.6962 6 15.7337 6.60326 15.0654 7.63477C14.4452 8.5923 14.0781 9.93106 14.0117 11.4844C14.9246 10.2789 16.3713 9.5 18 9.5C20.7614 9.5 23 11.7386 23 14.5C23 17.2614 20.7614 19.5 18 19.5C17.9056 19.5 17.8119 19.4964 17.7188 19.4912L17.6484 19.4893C15.9203 19.3847 14.6218 18.5078 13.7715 17.1768C12.8875 15.793 12.5 13.9479 12.5 12C12.5 10.0447 12.9121 8.20037 13.8066 6.81934C14.721 5.40782 16.1343 4.5 18 4.5ZM10.25 5C10.6642 5 11 5.33579 11 5.75V18.25C11 18.6642 10.6642 19 10.25 19C9.83579 19 9.5 18.6642 9.5 18.25V12.5H3V18.25C3 18.6642 2.66421 19 2.25 19C1.83579 19 1.5 18.6642 1.5 18.25V5.75C1.5 5.33579 1.83579 5 2.25 5C2.66421 5 3 5.33579 3 5.75V11H9.5V5.75C9.5 5.33579 9.83579 5 10.25 5ZM18 11C16.067 11 14.5 12.567 14.5 14.5C14.5 16.3721 15.9698 17.8996 17.8184 17.9941L18 18C19.933 18 21.5 16.433 21.5 14.5C21.5 12.567 19.933 11 18 11Z" 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/text_header_6_24_regular.svg";

Details