Text Header 2 icon

Used in general type creation and editing scenarios. Global readiness notes universal enough to not need locale specific variants. The Text Header 2 icon is part of Microsoft's Fluent UI System Icons, available here in filled and regular (outlined) styles on a 24 px grid. Download it as SVG or PNG, or copy it as code — it's free to use under the MIT License.

Regular (outlined)

SVG

Filled

SVG

Use the Text Header 2 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 { TextHeader224Regular, TextHeader224Filled } from "@fluentui/react-icons";

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

Use it in HTML

Reference the SVG file directly:

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

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="M10.75 5C11.1642 5 11.5 5.33579 11.5 5.75V18.25C11.5 18.6642 11.1642 19 10.75 19C10.3358 19 10 18.6642 10 18.25V12.5H3.5V18.25C3.5 18.6642 3.16421 19 2.75 19C2.33579 19 2 18.6642 2 18.25V5.75C2 5.33579 2.33579 5 2.75 5C3.16421 5 3.5 5.33579 3.5 5.75V11H10V5.75C10 5.33579 10.3358 5 10.75 5ZM17.75 4.5C20.0972 4.5 22 6.40279 22 8.75C22 10.0489 21.4547 11.0496 20.71 11.8652C19.9884 12.6555 19.0371 13.3146 18.1855 13.9229C16.6318 15.0327 15.3875 16.0074 15.0762 17.5H21.25C21.6642 17.5 22 17.8358 22 18.25C22 18.6642 21.6642 19 21.25 19H14.25C13.8358 19 13.5 18.6642 13.5 18.25C13.5 15.4379 15.6143 13.9166 17.3145 12.7021C18.2127 12.0605 19.0117 11.5006 19.6025 10.8535C20.1702 10.2317 20.5 9.576 20.5 8.75C20.5 7.23122 19.2688 6 17.75 6C16.3649 6 15.2175 7.02502 15.0273 8.35742C14.9686 8.76716 14.5895 9.05149 14.1797 8.99316C13.7697 8.93466 13.4847 8.55543 13.543 8.14551C13.8371 6.08455 15.6078 4.5 17.75 4.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/text_header_2_24_regular.svg";

Details

NameText Header 2
StylesRegular (outlined), Filled
Size24 × 24 px (scalable SVG)
Regular (outlined) fileic_fluent_text_header_2_24_regular.svg
Filled fileic_fluent_text_header_2_24_filled.svg
React componentsTextHeader224Regular, TextHeader224Filled
LicenseMIT (© Microsoft Corporation)

Keywords

typetexttypographyeditcreateheaderh1h2h3numberletter

Related icons