ICONYZ
English
Chevron Down icon from Font Awesome 4

Chevron Down icon

fa:chevron-down

The Chevron Down icon (fa:chevron-down) is a free SVG icon from the Font Awesome 4 set by Dave Gandy. It is drawn on a 1664 × 1312 grid. Font Awesome 4 icons are released under the Open Font License, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set
Font Awesome 4
Author
Dave Gandy
License
OFL-1.1
Size
1664 × 1312
Tags
chevrondown
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="1664" height="1312" viewBox="0 0 1664 1312"><path fill="currentColor" d="m1619 552l-742 741q-19 19-45 19t-45-19L45 552q-19-19-19-45.5T45 461l166-165q19-19 45-19t45 19l531 531l531-531q19-19 45-19t45 19l166 165q19 19 19 45.5t-19 45.5"/></svg>

How to use the Chevron Down icon

React

import { Icon } from "@iconify/react";

<Icon icon="fa:chevron-down" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="fa:chevron-down" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="fa:chevron-down" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fa--chevron-down]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fa -->
<div class="i-fa:chevron-down"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="fa:chevron-down"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/fa/chevron-down.svg" alt="Chevron Down icon" width="24" height="24">

Related icons in Font Awesome 4

Chevron Down icon in other icon sets

Chevron Down icon FAQ

Is the Chevron Down icon free for commercial use?

Yes. Font Awesome 4 icons are released under the Open Font License, which allows use in personal and commercial projects.

How do I use the Chevron Down icon in React?

Install @iconify/react and render <Icon icon="fa:chevron-down" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Chevron Down icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/fa/chevron-down.svg" alt="Chevron Down icon">, or paste the SVG code inline to style it with CSS.

Browse all Font Awesome 4 icons →