skip forward icon

skip-forward from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.

Name
skip-forward
Set
IonIcons
Style
Regular
Viewbox
512×512
License
MIT

The same icon in other sets

skip-forwardBootstrap Iconsskip-forwardCarbonskip-forward-fillEva Iconsskip-forwardFeather Iconsskip-forwardHuge Iconsskip-forwardHumbleiconsskip-forwardLucideskip-forwardMaterial Design Iconsskip-forward-fillMingCute Iconskip-forwardMyna UI Iconsskip-forwardPhosphorskip-forward-fillRemix Iconskip-forwardTabler Iconsskip-forwardUnicons

Related icons in IonIcons

skip-backward

Use the skip forward icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M436.3 96h-8.1c-6.7 0-12.2 5-12.2 11.7v113.5L228.9 98.7c-2.5-1.7-5.1-2.3-8.1-2.3-8.3 0-15.4 7-15.4 17v63.1L86.9 98.3c-2.5-1.7-5.1-2.3-8.1-2.3-8.3 0-14.9 7.4-14.9 17.4v286c0 10 6.7 16.5 15 16.5 3.1 0 5.4-1.2 8.2-2.9l118.3-77.6v64c0 10 7.2 16.5 15.5 16.5 3.1 0 5.5-1.2 8.2-2.9L416 290.8v113c0 6.7 5.4 12.2 12.2 12.2h8.1c6.7 0 11.7-5.5 11.7-12.2V107.7c0-6.7-4.9-11.7-11.7-11.7z" fill="currentColor"/></svg>

React

import type { SVGProps } from "react";

export function IonSkipForward(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M436.3 96h-8.1c-6.7 0-12.2 5-12.2 11.7v113.5L228.9 98.7c-2.5-1.7-5.1-2.3-8.1-2.3-8.3 0-15.4 7-15.4 17v63.1L86.9 98.3c-2.5-1.7-5.1-2.3-8.1-2.3-8.3 0-14.9 7.4-14.9 17.4v286c0 10 6.7 16.5 15 16.5 3.1 0 5.4-1.2 8.2-2.9l118.3-77.6v64c0 10 7.2 16.5 15.5 16.5 3.1 0 5.5-1.2 8.2-2.9L416 290.8v113c0 6.7 5.4 12.2 12.2 12.2h8.1c6.7 0 11.7-5.5 11.7-12.2V107.7c0-6.7-4.9-11.7-11.7-11.7z" fill="currentColor"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M436.3 96h-8.1c-6.7 0-12.2 5-12.2 11.7v113.5L228.9 98.7c-2.5-1.7-5.1-2.3-8.1-2.3-8.3 0-15.4 7-15.4 17v63.1L86.9 98.3c-2.5-1.7-5.1-2.3-8.1-2.3-8.3 0-14.9 7.4-14.9 17.4v286c0 10 6.7 16.5 15 16.5 3.1 0 5.4-1.2 8.2-2.9l118.3-77.6v64c0 10 7.2 16.5 15.5 16.5 3.1 0 5.5-1.2 8.2-2.9L416 290.8v113c0 6.7 5.4 12.2 12.2 12.2h8.1c6.7 0 11.7-5.5 11.7-12.2V107.7c0-6.7-4.9-11.7-11.7-11.7z" fill="currentColor"/></svg>
</template>

CSS

.icon-skip-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%20512%20512%22%3E%3Cpath%20d%3D%22M436.3%2096h-8.1c-6.7%200-12.2%205-12.2%2011.7v113.5L228.9%2098.7c-2.5-1.7-5.1-2.3-8.1-2.3-8.3%200-15.4%207-15.4%2017v63.1L86.9%2098.3c-2.5-1.7-5.1-2.3-8.1-2.3-8.3%200-14.9%207.4-14.9%2017.4v286c0%2010%206.7%2016.5%2015%2016.5%203.1%200%205.4-1.2%208.2-2.9l118.3-77.6v64c0%2010%207.2%2016.5%2015.5%2016.5%203.1%200%205.5-1.2%208.2-2.9L416%20290.8v113c0%206.7%205.4%2012.2%2012.2%2012.2h8.1c6.7%200%2011.7-5.5%2011.7-12.2V107.7c0-6.7-4.9-11.7-11.7-11.7z%22%20fill%3D%22currentColor%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%20512%20512%22%3E%3Cpath%20d%3D%22M436.3%2096h-8.1c-6.7%200-12.2%205-12.2%2011.7v113.5L228.9%2098.7c-2.5-1.7-5.1-2.3-8.1-2.3-8.3%200-15.4%207-15.4%2017v63.1L86.9%2098.3c-2.5-1.7-5.1-2.3-8.1-2.3-8.3%200-14.9%207.4-14.9%2017.4v286c0%2010%206.7%2016.5%2015%2016.5%203.1%200%205.4-1.2%208.2-2.9l118.3-77.6v64c0%2010%207.2%2016.5%2015.5%2016.5%203.1%200%205.5-1.2%208.2-2.9L416%20290.8v113c0%206.7%205.4%2012.2%2012.2%2012.2h8.1c6.7%200%2011.7-5.5%2011.7-12.2V107.7c0-6.7-4.9-11.7-11.7-11.7z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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