Text T icon

Use the Text T 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 { TextT24Regular, TextT24Filled } from "@fluentui/react-icons";

export function Example() {
  return <TextT24Regular aria-label="Text T" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_text_t_24_regular.svg" width="24" height="24" alt="Text T">

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="M5 4.75C5 4.33579 5.33579 4 5.75 4H18.25C18.6642 4 19 4.33579 19 4.75V6.75C19 7.16421 18.6642 7.5 18.25 7.5C17.8358 7.5 17.5 7.16421 17.5 6.75V5.5H12.75L12.75 18.5H14.25C14.6642 18.5 15 18.8358 15 19.25C15 19.6642 14.6642 20 14.25 20H9.75C9.33579 20 9 19.6642 9 19.25C9 18.8358 9.33579 18.5 9.75 18.5H11.25L11.25 5.5H6.5V6.75C6.5 7.16421 6.16421 7.5 5.75 7.5C5.33579 7.5 5 7.16421 5 6.75V4.75Z" 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_t_24_regular.svg";

Details

Keywords

typetextttypographyeditcreate