arrow down icon
arrow-down-bold from Solar by 480 Design · Bold · Arrows · CC-BY-4.0 Attribution required.
- Name
- arrow-down-bold
- Set
- Solar
- Style
- Bold
- Category
- Arrows
- Viewbox
- 24×24
- License
- CC BY 4.0
5 other variants in Solar
The same icon in other sets
arrow-downAkar Iconsarrow-down-outlinedAnt Design Iconsarrow-downBootstrap Iconsarrow-downCarbonarrow-downCodiconsarrow-downElement Plusarrow-down-fillEva Iconsarrow-downFramework7 Iconsarrow-downFont Awesome 6 Solidarrow-downFont Awesome Solidarrow-downFeather Iconsarrow-down-outlineFlowbite Iconsarrow-down-12-filledFluent UI System Iconsarrow-downcss.ggarrow-downHeroIconsarrow-downHumbleiconsarrow-downIconParkarrow-downIconPark Outlinearrow-downIconoirarrow-downIonIconsarrow-downJam Iconsarrow-downLine Awesomearrow-downMaterial Line Iconsarrow-downLucide
More arrows icons from Solar
alt-arrow-down-boldalt-arrow-left-boldalt-arrow-right-boldalt-arrow-up-boldarrow-left-boldarrow-left-down-boldarrow-left-up-boldarrow-right-boldarrow-right-down-boldarrow-right-up-boldarrow-up-bolddouble-alt-arrow-down-bolddouble-alt-arrow-left-bolddouble-alt-arrow-right-bolddouble-alt-arrow-up-boldrefresh-boldrefresh-circle-boldrefresh-square-boldrestart-boldrestart-circle-boldrestart-square-boldround-alt-arrow-down-boldround-alt-arrow-left-boldround-alt-arrow-right-bold
Use the arrow down icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.75 4C12.75 3.58579 12.4142 3.25 12 3.25C11.5858 3.25 11.25 3.58579 11.25 4L11.25 13.25H6.00002C5.69668 13.25 5.4232 13.4327 5.30711 13.713C5.19103 13.9932 5.25519 14.3158 5.46969 14.5303L11.4697 20.5303C11.6103 20.671 11.8011 20.75 12 20.75C12.1989 20.75 12.3897 20.671 12.5304 20.5303L18.5304 14.5303C18.7449 14.3158 18.809 13.9932 18.6929 13.713C18.5768 13.4327 18.3034 13.25 18 13.25H12.75L12.75 4Z"/></svg>
React
import type { SVGProps } from "react";
export function SolarArrowDownBold(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.75 4C12.75 3.58579 12.4142 3.25 12 3.25C11.5858 3.25 11.25 3.58579 11.25 4L11.25 13.25H6.00002C5.69668 13.25 5.4232 13.4327 5.30711 13.713C5.19103 13.9932 5.25519 14.3158 5.46969 14.5303L11.4697 20.5303C11.6103 20.671 11.8011 20.75 12 20.75C12.1989 20.75 12.3897 20.671 12.5304 20.5303L18.5304 14.5303C18.7449 14.3158 18.809 13.9932 18.6929 13.713C18.5768 13.4327 18.3034 13.25 18 13.25H12.75L12.75 4Z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12.75 4C12.75 3.58579 12.4142 3.25 12 3.25C11.5858 3.25 11.25 3.58579 11.25 4L11.25 13.25H6.00002C5.69668 13.25 5.4232 13.4327 5.30711 13.713C5.19103 13.9932 5.25519 14.3158 5.46969 14.5303L11.4697 20.5303C11.6103 20.671 11.8011 20.75 12 20.75C12.1989 20.75 12.3897 20.671 12.5304 20.5303L18.5304 14.5303C18.7449 14.3158 18.809 13.9932 18.6929 13.713C18.5768 13.4327 18.3034 13.25 18 13.25H12.75L12.75 4Z"/></svg> </template>
CSS
.icon-arrow-down-bold {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.75%204C12.75%203.58579%2012.4142%203.25%2012%203.25C11.5858%203.25%2011.25%203.58579%2011.25%204L11.25%2013.25H6.00002C5.69668%2013.25%205.4232%2013.4327%205.30711%2013.713C5.19103%2013.9932%205.25519%2014.3158%205.46969%2014.5303L11.4697%2020.5303C11.6103%2020.671%2011.8011%2020.75%2012%2020.75C12.1989%2020.75%2012.3897%2020.671%2012.5304%2020.5303L18.5304%2014.5303C18.7449%2014.3158%2018.809%2013.9932%2018.6929%2013.713C18.5768%2013.4327%2018.3034%2013.25%2018%2013.25H12.75L12.75%204Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M12.75%204C12.75%203.58579%2012.4142%203.25%2012%203.25C11.5858%203.25%2011.25%203.58579%2011.25%204L11.25%2013.25H6.00002C5.69668%2013.25%205.4232%2013.4327%205.30711%2013.713C5.19103%2013.9932%205.25519%2014.3158%205.46969%2014.5303L11.4697%2020.5303C11.6103%2020.671%2011.8011%2020.75%2012%2020.75C12.1989%2020.75%2012.3897%2020.671%2012.5304%2020.5303L18.5304%2014.5303C18.7449%2014.3158%2018.809%2013.9932%2018.6929%2013.713C18.5768%2013.4327%2018.3034%2013.25%2018%2013.25H12.75L12.75%204Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/solar/arrow-down-bold.svg?color=%231a73e8&size=48
