The Tabler caret down icon depicts a downward-pointing triangle, commonly used to indicate a collapsed state, a dropdown menu, or to signify 'more' content below.
Common uses
- Dropdown menu trigger
- Expand/collapse section indicator
- Show more content button
Use it in React
Install
npm i @tabler/icons-reactImport & render
import { IconCaretDown } from '@tabler/icons-react';
<IconCaretDown size={24} stroke={2} />Styles
Tabler ships this icon in 2 styles — each its own import:
outline
<IconCaretDown size={24} stroke={2} />filled
<IconCaretDownFilled size={24} stroke={2} />Details
- Library
- Tabler (5,093 icons)
- License
- MIT
- viewBox
0 0 24 24- Category
- Arrows
- Keywords
- nextbottomdropdownshowmorecaretdowndecreasenavigationflowarrowsdropdown arrowcollapse iconarrow downchevron down
FAQ
- What is the caret down icon used for?
- It visually signals that an element can be expanded or collapsed, or that a menu is available below. It's often used for dropdowns or to indicate more content.
- How do I use the caret down icon in React?
- You can import and use it directly in your React components like this: import { IconCaretDown } from '@tabler/icons-react'.
- What is the license for the Tabler caret down icon?
- The Tabler icons, including the caret down icon, are 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 →