accessible forward icon

accessible-forward from Material Symbols Light by Google · Regular · Actions · Apache-2.0 Free for personal and commercial use.

Name: accessible-forward
Set: Material Symbols Light
Style: Regular
Category: Actions
Viewbox: 24×24
License: Apache 2.0
Aliases: accessible-forward-outline

2 other variants in Material Symbols Light

accessible-forward-rounded accessible-forward-sharp

The same icon in other sets

accessible-forwardMaterial Symbols

More actions icons from Material Symbols Light

Use the accessible forward icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M8.192 21q-1.748 0-2.97-1.251T4 16.75t1.241-2.99q1.242-1.24 2.97-1.24v1.019q-1.326 0-2.269.942T5 16.75t.942 2.27t2.289.942t2.288-.943t.943-2.269h1q0 1.748-1.261 2.999T8.192 21m8.347-1v-3.75q0-.192-.106-.308t-.318-.115H11q-1.004 0-1.575-.87t-.14-1.8l2.042-4.484H8.802l-.696 1.839l-.944-.32l.661-1.8q.168-.44.488-.656t.785-.217h3.873q.875 0 1.328.644q.453.643.06 1.514l-2.207 4.785h3.927q.614 0 1.038.433q.424.434.424 1.047V20zM13.635 6.345q-.462-.462-.462-1.133t.463-1.134t1.133-.463t1.124.463q.453.462.453 1.133q0 .672-.453 1.134q-.452.463-1.124.463t-1.133-.463"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightAccessibleForward(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="M8.192 21q-1.748 0-2.97-1.251T4 16.75t1.241-2.99q1.242-1.24 2.97-1.24v1.019q-1.326 0-2.269.942T5 16.75t.942 2.27t2.289.942t2.288-.943t.943-2.269h1q0 1.748-1.261 2.999T8.192 21m8.347-1v-3.75q0-.192-.106-.308t-.318-.115H11q-1.004 0-1.575-.87t-.14-1.8l2.042-4.484H8.802l-.696 1.839l-.944-.32l.661-1.8q.168-.44.488-.656t.785-.217h3.873q.875 0 1.328.644q.453.643.06 1.514l-2.207 4.785h3.927q.614 0 1.038.433q.424.434.424 1.047V20zM13.635 6.345q-.462-.462-.462-1.133t.463-1.134t1.133-.463t1.124.463q.453.462.453 1.133q0 .672-.453 1.134q-.452.463-1.124.463t-1.133-.463"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M8.192 21q-1.748 0-2.97-1.251T4 16.75t1.241-2.99q1.242-1.24 2.97-1.24v1.019q-1.326 0-2.269.942T5 16.75t.942 2.27t2.289.942t2.288-.943t.943-2.269h1q0 1.748-1.261 2.999T8.192 21m8.347-1v-3.75q0-.192-.106-.308t-.318-.115H11q-1.004 0-1.575-.87t-.14-1.8l2.042-4.484H8.802l-.696 1.839l-.944-.32l.661-1.8q.168-.44.488-.656t.785-.217h3.873q.875 0 1.328.644q.453.643.06 1.514l-2.207 4.785h3.927q.614 0 1.038.433q.424.434.424 1.047V20zM13.635 6.345q-.462-.462-.462-1.133t.463-1.134t1.133-.463t1.124.463q.453.462.453 1.133q0 .672-.453 1.134q-.452.463-1.124.463t-1.133-.463"/></svg>
</template>

CSS

.icon-accessible-forward {
  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%22M8.192%2021q-1.748%200-2.97-1.251T4%2016.75t1.241-2.99q1.242-1.24%202.97-1.24v1.019q-1.326%200-2.269.942T5%2016.75t.942%202.27t2.289.942t2.288-.943t.943-2.269h1q0%201.748-1.261%202.999T8.192%2021m8.347-1v-3.75q0-.192-.106-.308t-.318-.115H11q-1.004%200-1.575-.87t-.14-1.8l2.042-4.484H8.802l-.696%201.839l-.944-.32l.661-1.8q.168-.44.488-.656t.785-.217h3.873q.875%200%201.328.644q.453.643.06%201.514l-2.207%204.785h3.927q.614%200%201.038.433q.424.434.424%201.047V20zM13.635%206.345q-.462-.462-.462-1.133t.463-1.134t1.133-.463t1.124.463q.453.462.453%201.133q0%20.672-.453%201.134q-.452.463-1.124.463t-1.133-.463%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%22M8.192%2021q-1.748%200-2.97-1.251T4%2016.75t1.241-2.99q1.242-1.24%202.97-1.24v1.019q-1.326%200-2.269.942T5%2016.75t.942%202.27t2.289.942t2.288-.943t.943-2.269h1q0%201.748-1.261%202.999T8.192%2021m8.347-1v-3.75q0-.192-.106-.308t-.318-.115H11q-1.004%200-1.575-.87t-.14-1.8l2.042-4.484H8.802l-.696%201.839l-.944-.32l.661-1.8q.168-.44.488-.656t.785-.217h3.873q.875%200%201.328.644q.453.643.06%201.514l-2.207%204.785h3.927q.614%200%201.038.433q.424.434.424%201.047V20zM13.635%206.345q-.462-.462-.462-1.133t.463-1.134t1.133-.463t1.124.463q.453.462.453%201.133q0%20.672-.453%201.134q-.452.463-1.124.463t-1.133-.463%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/accessible-forward.svg?color=%231a73e8&size=48