Skip to main content

icon-arrow-down-circle

Examples

Heading
Smaller heading

Inline text

Example link text

Icon Component

Using the Icon Component? Copy, paste, and go.

<s-icon name="icon-arrow-down-circle"></s-icon>

Icon font

Using the web font? Copy, paste, and go.

<span class="sf-main sf-icon-arrow-down-circle"></span>

Code point

  • Unicode: U+F102
  • CSS: \F102
  • JS: \uF102
  • HTML: &#xF102;

Copy HTML

Paste the SVG right into your project's code.

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="s-icon s-icon-icon-arrow-down-circle" viewBox="0 0 16 16">
  <path d="M8 15.334A7.312 7.312 0 0 1 .667 8 7.312 7.312 0 0 1 8 .667 7.312 7.312 0 0 1 15.333 8 7.312 7.312 0 0 1 8 15.334ZM8 2C4.667 2 2 4.667 2 8c0 3.334 2.667 6 6 6s6-2.666 6-6c0-3.333-2.667-6-6-6Zm.466 9.134 2.667-2.667a.645.645 0 0 0 0-.933.645.645 0 0 0-.933 0L8 9.734l-2.2-2.2a.644.644 0 0 0-.933 0 .644.644 0 0 0 0 .933l2.666 2.667a.72.72 0 0 0 .467.2.72.72 0 0 0 .466-.2Zm.2-.467V5.334c0-.4-.266-.667-.666-.667s-.667.267-.667.667v5.333c0 .4.267.667.667.667s.666-.267.666-.667Z"/>
</svg>