skip forward icon

skip-forward-fill from Bootstrap Icons by The Bootstrap Authors · Fill · MIT Free for personal and commercial use.

Name: skip-forward-fill
Set: Bootstrap Icons
Style: Fill
Viewbox: 16×16
License: MIT

1 other variant in Bootstrap Icons

The same icon in other sets

skip-forwardCarbon skip-forward-fillEva Icons skip-forwardFeather Icons skip-forwardHuge Icons skip-forwardHumbleicons skip-forwardIonIcons skip-forwardLucide skip-forwardMaterial Design Icons skip-forward-fillMingCute Icon skip-forwardMyna UI Icons skip-forwardPhosphor skip-forward-fillRemix Icon skip-forwardTabler Icons skip-forwardUnicons

Related icons in Bootstrap Icons

skip-backward skip-backward-btn skip-backward-circle skip-end skip-end-btn skip-end-circle skip-forward-btn skip-forward-circle skip-start skip-start-btn skip-start-circle

Use the skip forward icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M15.5 3.5a.5.5 0 0 1 .5.5v8a.5.5 0 0 1-1 0V8.753l-6.267 3.636c-.54.313-1.233-.066-1.233-.697v-2.94l-6.267 3.636C.693 12.703 0 12.324 0 11.693V4.308c0-.63.693-1.01 1.233-.696L7.5 7.248v-2.94c0-.63.693-1.01 1.233-.696L15 7.248V4a.5.5 0 0 1 .5-.5"/></svg>

React

import type { SVGProps } from "react";

export function BiSkipForwardFill(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M15.5 3.5a.5.5 0 0 1 .5.5v8a.5.5 0 0 1-1 0V8.753l-6.267 3.636c-.54.313-1.233-.066-1.233-.697v-2.94l-6.267 3.636C.693 12.703 0 12.324 0 11.693V4.308c0-.63.693-1.01 1.233-.696L7.5 7.248v-2.94c0-.63.693-1.01 1.233-.696L15 7.248V4a.5.5 0 0 1 .5-.5"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="currentColor" d="M15.5 3.5a.5.5 0 0 1 .5.5v8a.5.5 0 0 1-1 0V8.753l-6.267 3.636c-.54.313-1.233-.066-1.233-.697v-2.94l-6.267 3.636C.693 12.703 0 12.324 0 11.693V4.308c0-.63.693-1.01 1.233-.696L7.5 7.248v-2.94c0-.63.693-1.01 1.233-.696L15 7.248V4a.5.5 0 0 1 .5-.5"/></svg>
</template>

CSS

.icon-skip-forward-fill {
  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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M15.5%203.5a.5.5%200%200%201%20.5.5v8a.5.5%200%200%201-1%200V8.753l-6.267%203.636c-.54.313-1.233-.066-1.233-.697v-2.94l-6.267%203.636C.693%2012.703%200%2012.324%200%2011.693V4.308c0-.63.693-1.01%201.233-.696L7.5%207.248v-2.94c0-.63.693-1.01%201.233-.696L15%207.248V4a.5.5%200%200%201%20.5-.5%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%2016%2016%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M15.5%203.5a.5.5%200%200%201%20.5.5v8a.5.5%200%200%201-1%200V8.753l-6.267%203.636c-.54.313-1.233-.066-1.233-.697v-2.94l-6.267%203.636C.693%2012.703%200%2012.324%200%2011.693V4.308c0-.63.693-1.01%201.233-.696L7.5%207.248v-2.94c0-.63.693-1.01%201.233-.696L15%207.248V4a.5.5%200%200%201%20.5-.5%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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