Chevron Icons
Chevrons are the understated sibling of the full arrow — just the angled line, no stem, no arrowhead. That restraint is exactly why they're everywhere: accordion toggles, dropdown indicators, pagination controls, carousel navigation, breadcrumb separators. This page collects chevron variants across Pathwork's libraries in every direction and stroke weight, so you can find one subtle enough to sit quietly next to text, or bold enough to work as a standalone button.
Showing top 100·42 icon packs·Free & open source
Showing top 100 results — many more icons available
Search all chevron iconsSource libraries
| Library | Icons | Total in pack |
|---|---|---|
| Akar Icons | 4 | 458 |
| Bootstrap Icons | 4 | 2,084 |
| Boxicons | 4 | 3,768 |
| BoxIcons v2 | 4 | 1,609 |
| BoxIcons v2 Solid | 4 | 665 |
| Carbon | 4 | 2,733 |
| Charm Icons | 4 | 262 |
| coolicons | 4 | 715 |
| CodeX Icons | 4 | 78 |
| Codicons | 4 | 649 |
| Evil Icons | 4 | 70 |
| Elusive Icons | 4 | 304 |
| Entypo+ | 4 | 321 |
| Framework7 Icons | 4 | 1,253 |
| Font Awesome 5 Solid | 4 | 1,023 |
| Font Awesome 6 Solid | 4 | 1,407 |
| Font Awesome Solid | 4 | 2,000 |
| Font Awesome 4 | 3 | 649 |
| Feather Icons | 3 | 286 |
| Bytesize Icons | 2 | 102 |
| CoreUI Free | 2 | 562 |
| Famicons | 2 | 1,342 |
| Fluent UI MDL2 | 1 | 1,735 |
| css.gg | 1 | 704 |
| Glyphs Poly | 1 | 863 |
| Glyphs | 1 | 3,452 |
| Gravity UI Icons | 1 | 799 |
| Griddy Icons | 1 | 2,010 |
| Gridicons | 1 | 207 |
| HeroIcons v1 Outline | 1 | 385 |
| HeroIcons v1 Solid | 1 | 387 |
| HeroIcons | 1 | 1,288 |
| Humbleicons | 1 | 287 |
| Icons8 Windows 10 Icons | 1 | 234 |
| IonIcons | 1 | 2,361 |
| Siemens Industrial Experience Icons | 1 | 1,490 |
| Jam Icons | 1 | 940 |
| Line Awesome | 1 | 1,544 |
| Material Line Icons | 1 | 1,233 |
| Lineicons | 1 | 962 |
| Lucide | 1 | 1,836 |
| Mage Icons | 1 | 1,042 |
Frequently Asked Questions
A chevron is just the angled line — like a '<', '>', '^', or 'v' shape — with no stem or arrowhead. An arrow includes a line (the stem) plus a triangular or angled head. Chevrons read as more subtle directional indicators, while full arrows communicate a stronger sense of movement or action.
Chevrons work well for passive UI indicators — showing that something can expand, that there's more content in a carousel, or marking a breadcrumb separator — where you don't want to draw much attention. Full arrows are better suited to actions the user actively triggers, like 'next step' or 'download', where a clearer directional cue helps.
You can generally use a single chevron and rotate it with CSS ('transform: rotate()') to get all four directions, since chevrons are typically simple and symmetric. This is especially useful for dropdown toggles, where the same chevron rotates 180 degrees between closed and open states.
A medium-weight down-facing chevron is the most common default, since it clearly signals 'more content below' without feeling heavy. Thinner chevrons suit minimal or text-dense interfaces, while bolder ones stand out better in touch-friendly mobile UIs.
Directional chevrons used for navigation (like 'next' or 'back') should flip horizontally in RTL layouts, similar to full arrows. Chevrons used for non-directional purposes, like an accordion's expand/collapse indicator, generally don't need to flip since they're not tied to reading direction.
Each icon keeps the license from its source library attached to it, and terms can differ depending on which library a specific icon comes from. Check the license shown on the individual icon's page before using it commercially.
For most chevrons built with SVG strokes rather than filled shapes, yes — you can override 'stroke-width' with CSS to adjust thickness, though extreme changes may affect how proportional the angle looks against the icon's original design.