Text Superscript icon
Used in general type creation and editing scenarios. The Text Superscript 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.
Use the Text Superscript 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 { TextSuperscript24Regular, TextSuperscript24Filled } from "@fluentui/react-icons";
export function Example() {
return <TextSuperscript24Regular aria-label="Text Superscript" />;
}Use it in HTML
Reference the SVG file directly:
<img src="https://fluenticons.co/icons/ic_fluent_text_superscript_24_regular.svg" width="24" height="24" alt="Text Superscript"> 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.7358 3.5C18.1935 3.5 17.75 3.99503 17.75 4.52273C17.75 4.93694 17.4142 5.27273 17 5.27273C16.5858 5.27273 16.25 4.93694 16.25 4.52273C16.25 3.27769 17.2582 2 18.7358 2C19.591 2 20.4204 2.39999 20.8865 3.11661C21.3753 3.86797 21.3858 4.84107 20.8289 5.789C20.5445 6.27315 20.1557 6.63637 19.7837 6.93019C19.5972 7.07753 19.4054 7.21448 19.2269 7.34071L19.1493 7.3955C18.996 7.50364 18.8541 7.60378 18.7166 7.70723C18.3606 7.97516 18.0984 8.21821 17.9377 8.5H20.4506C20.8648 8.5 21.2006 8.83579 21.2006 9.25C21.2006 9.66421 20.8648 10 20.4506 10H17.0164L17.0082 9.99996L17 10C16.5858 10 16.25 9.66421 16.25 9.25C16.25 7.85365 17.0711 7.06828 17.8147 6.50868C17.9721 6.39023 18.1351 6.27527 18.2873 6.16787L18.3611 6.11579C18.5385 5.99042 18.7016 5.87346 18.854 5.75305C19.16 5.51135 19.3861 5.28367 19.5356 5.02918C19.8466 4.49984 19.765 4.1434 19.6292 3.93452C19.4707 3.69092 19.1429 3.5 18.7358 3.5ZM15.26 4.71092C15.3199 5.27162 15.6447 5.75312 16.1068 6.02791L10.9879 11.9999L16.5696 18.5119C16.8392 18.8264 16.8028 19.2999 16.4883 19.5695C16.1738 19.839 15.7003 19.8026 15.4307 19.4881L10.0001 13.1524L4.56946 19.4881C4.29989 19.8026 3.82641 19.839 3.51192 19.5695C3.19743 19.2999 3.161 18.8264 3.43057 18.5119L9.01228 11.9999L3.43073 5.48811C3.16116 5.17361 3.19758 4.70014 3.51208 4.43057C3.82657 4.161 4.30005 4.19743 4.56961 4.51192L10.0001 10.8475L15.26 4.71092Z" 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_superscript_24_regular.svg";Details
| Name | Text Superscript |
|---|---|
| Styles | Regular (outlined), Filled |
| Size | 24 × 24 px (scalable SVG) |
| Regular (outlined) file | ic_fluent_text_superscript_24_regular.svg |
| Filled file | ic_fluent_text_superscript_24_filled.svg |
| React components | TextSuperscript24Regular, TextSuperscript24Filled |
| License | MIT (© Microsoft Corporation) |