Text Number List RTL icon

Use the Text Number List RTL 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 { TextNumberListRtl24Regular, TextNumberListRtl24Filled } from "@fluentui/react-icons";

export function Example() {
  return <TextNumberListRtl24Regular aria-label="Text Number List RTL" />;
}

Use it in HTML

Reference the SVG file directly:

<img src="https://fluenticons.co/icons/ic_fluent_text_number_list_rtl_24_regular.svg" width="24" height="24" alt="Text Number List RTL">

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="M20.0001 2.75007C20.0001 2.39585 19.7523 2.08992 19.4058 2.0164C19.0601 1.94307 18.7103 2.12094 18.5658 2.44311L18.5643 2.44645C18.5623 2.45075 18.5584 2.45889 18.5528 2.47049C18.5414 2.49373 18.5228 2.53063 18.497 2.57815C18.4453 2.67364 18.3658 2.80953 18.2594 2.96255C18.0418 3.27544 17.7354 3.62496 17.3527 3.86399C17.0014 4.08344 16.8946 4.54613 17.114 4.89743C17.3335 5.24873 17.7962 5.35562 18.1475 5.13616C18.272 5.05833 18.3896 4.97481 18.5001 4.88772V7.25007C18.5001 7.66429 18.8359 8.00007 19.2501 8.00007C19.6643 8.00007 20.0001 7.66429 20.0001 7.25007V2.75007ZM14 18.7501C14 18.3359 13.6642 18.0001 13.25 18.0001H4.25C3.83579 18.0001 3.5 18.3359 3.5 18.7501C3.5 19.1643 3.83579 19.5001 4.25 19.5001H13.25C13.6642 19.5001 14 19.1643 14 18.7501ZM14 12.2437C14 11.8295 13.6642 11.4937 13.25 11.4937H4.25C3.83579 11.4937 3.5 11.8295 3.5 12.2437C3.5 12.658 3.83579 12.9937 4.25 12.9937H13.25C13.6642 12.9937 14 12.658 14 12.2437ZM14 5.75008C14 5.33586 13.6642 5.00008 13.25 5.00008H4.25C3.83579 5.00008 3.5 5.33586 3.5 5.75008C3.5 6.16429 3.83579 6.50008 4.25 6.50008H13.25C13.6642 6.50008 14 6.16429 14 5.75008ZM19.1509 10.52C18.8496 10.4668 18.4744 10.5864 18.2803 10.7805C17.9874 11.0733 17.5125 11.0733 17.2197 10.7804C16.9268 10.4875 16.9268 10.0127 17.2197 9.71977C17.7756 9.16393 18.6504 8.90848 19.4116 9.04278C19.809 9.11291 20.2173 9.29717 20.5272 9.64842C20.8426 10.0058 21 10.4727 21 11.0001C21 11.6195 20.729 12.0801 20.3941 12.4206C20.1163 12.7029 19.7632 12.9311 19.4883 13.1087L19.4087 13.1602C19.2135 13.2871 19.0543 13.3971 18.9269 13.5001H20.25C20.6642 13.5001 21 13.8359 21 14.2501C21 14.6643 20.6642 15.0001 20.25 15.0001H17.75C17.3358 15.0001 17 14.6643 17 14.2501C17 12.9365 17.9839 12.2972 18.5751 11.913L18.6352 11.8739C18.9526 11.6678 19.1684 11.5275 19.3247 11.3687C19.4585 11.2326 19.5 11.1307 19.5 11.0001C19.5 10.7775 19.4387 10.6819 19.4025 10.6409C19.3608 10.5937 19.2847 10.5436 19.1509 10.52ZM16.9697 21.2804C16.9697 21.2804 17.0625 21.3641 16.9743 21.2849L16.9796 21.2902L16.9929 21.3028C17.0029 21.3122 17.0151 21.3233 17.0296 21.336C17.0585 21.3613 17.0965 21.3928 17.1438 21.4282C17.2381 21.499 17.37 21.5861 17.5396 21.6709C17.8813 21.8418 18.3704 22.0001 19 22.0001C19.6392 22.0001 20.196 21.8187 20.6013 21.4606C21.0092 21.1001 21.2116 20.6032 21.1955 20.1011C21.1822 19.6847 21.029 19.3054 20.7699 19.0001C21.029 18.6948 21.1822 18.3155 21.1955 17.8991C21.2116 17.3969 21.0092 16.9 20.6013 16.5396C20.196 16.1814 19.6392 16.0001 19 16.0001C18.3704 16.0001 17.8813 16.1584 17.5396 16.3293C17.37 16.4141 17.2381 16.5012 17.1438 16.572C17.0965 16.6074 17.0585 16.6389 17.0296 16.6642C17.0151 16.6768 17.0029 16.688 16.9929 16.6973L16.9796 16.71L16.9742 16.7152L16.9719 16.7176L16.9709 16.7185L16.9697 16.7197C16.6768 17.0126 16.6768 17.4875 16.9697 17.7804C17.2586 18.0693 17.7246 18.0732 18.0183 17.7921C18.0217 17.7892 18.0302 17.7821 18.0437 17.772C18.0744 17.749 18.13 17.7111 18.2104 17.6709C18.3687 17.5918 18.6296 17.5001 19 17.5001C19.3608 17.5001 19.536 17.6 19.6081 17.6637C19.6777 17.7251 19.6982 17.7907 19.6963 17.8511C19.6942 17.9156 19.664 18.0028 19.5728 18.0819C19.4845 18.1585 19.3096 18.2501 19 18.2501C18.5858 18.2501 18.25 18.5859 18.25 19.0001C18.25 19.4143 18.5858 19.7501 19 19.7501C19.3096 19.7501 19.4845 19.8417 19.5728 19.9183C19.664 19.9974 19.6942 20.0845 19.6963 20.1491C19.6982 20.2094 19.6777 20.275 19.6081 20.3365C19.536 20.4002 19.3608 20.5001 19 20.5001C18.6296 20.5001 18.3687 20.4084 18.2104 20.3293C18.13 20.2891 18.0744 20.2512 18.0437 20.2282C18.0302 20.218 18.0217 20.2109 18.0183 20.208C17.7246 19.9269 17.2586 19.9308 16.9697 20.2197C16.6768 20.5126 16.6768 20.9875 16.9697 21.2804ZM16.9719 16.7176L16.9709 16.7185C16.9776 16.713 17.1718 16.5516 16.9719 16.7176Z" 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_number_list_rtl_24_regular.svg";

Details