The Tabler circle number 4 icon depicts the digit '4' enclosed within a circle, commonly used to represent numerical order, quantity, or specific numerical values in user interfaces.
Common uses
- Displaying the fourth item in a list or sequence.
- Indicating a quantity of four for a product or option.
- As a step indicator in a multi-step process (e.g., Step 4 of 5).
Use it in React
Install
npm i @tabler/icons-reactImport & render
import { IconCircleNumber4 } from '@tabler/icons-react';
<IconCircleNumber4 size={24} stroke={2} />Styles
Tabler ships this icon in 2 styles — each its own import:
outline
<IconCircleNumber4 size={24} stroke={2} />filled
<IconCircleNumber4Filled size={24} stroke={2} />Details
- Library
- Tabler (5,093 icons)
- License
- MIT
- viewBox
0 0 24 24- Category
- Numbers
- Keywords
- fourzeronumberdigitquantityamountordermathssumtotalnumberscircle4number 4digit 4circled 4
FAQ
- What is the circle number 4 icon used for?
- It's used to visually represent the number four, often for ordering, counting, or labeling in UI elements.
- How do I use the circle number 4 icon in React?
- Import it from '@tabler/icons-react' like this: import { IconCircleNumber4 } from '@tabler/icons-react'.
- What is the license for this icon?
- This icon is part of the Tabler icon library and is distributed under the MIT license.
Related icons
The same idea in other libraries, and near matches in Tabler.
Looking for something else? Search Tabler and 4 more libraries by description →
The search behind these pages runs as a Claude Code skill. What skills are and how I ship them →