Arrow Down Circle icon - Free SVG for React, Vue, Svelte, Angular, Solid & Preact - Customizable navigation vector icon

Install with shadcn CLI

npx shadcn@latest add https://www.shadcn.io/registry/heroicons-arrow-down-circle.json
npx shadcn@latest add https://www.shadcn.io/registry/heroicons-arrow-down-circle.json
pnpm dlx shadcn@latest add https://www.shadcn.io/registry/heroicons-arrow-down-circle.json
bunx shadcn@latest add https://www.shadcn.io/registry/heroicons-arrow-down-circle.json
Category:navigation
Tags:arrowdowncircledownloadbuttonnavigateenclosed

The arrow-down-circle icon represents downward navigation within a circular button design, combining directional guidance with contained visual styling.

The encircled downward arrow has become a standard pattern for download buttons, scroll-to-bottom functionality, and enclosed expansion controls in modern interfaces.

Frequently Asked Questions

Common questions about the Arrow Down Circle icon

Similar Icons

Arrow Down On Square Stack 16 Solid - actions icon from HeroIcons
arrow down on square stack 16 solid
Arrow Uturn Left 20 Solid - actions icon from HeroIcons
arrow uturn left 20 solid
Magnifying Glass - actions icon from HeroIcons
magnifying glass
Bars 3 Bottom Left Solid - interface icon from HeroIcons
bars 3 bottom left solid
Hashtag - communication icon from HeroIcons
hashtag
Face Smile Solid - interface icon from HeroIcons
face smile solid
Folder Plus Solid - actions icon from HeroIcons
folder plus solid
Arrow Down Circle 20 Solid - navigation icon from HeroIcons
arrow down circle 20 solid
Play 20 Solid - media icon from HeroIcons
play 20 solid