Skip to content
Cuelark UI

Hover the icon or press Play. Suggested motion: nudge-right. Pick another to preview it and update the animated code:

Remix Icon · RiForward30Fill

Forward30 Fill icon

A free forward30 fill icon from Remix Icon, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.

License
Apache License Version 2.0
Project
github.com
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/remix/forward30-fill.json
components/icons/remix-forward30-fill.tsx
import * as React from "react";

/**
 * Forward30 Fill from Remix Icon (https://github.com/Remix-Design/RemixIcon), Apache License Version 2.0.
 * Via Cuelark UI: ui.cuelark.com/icons/remix/forward30-fill. Sized in em, colored by currentColor.
 */
export function RiForward30FillIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 24 24"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M2 12C2 6.47715 6.47715 2 12 2 15.0159 2 17.72 3.33509 19.5534 5.44648L22 3V9H16.7854C17.2274 9.45094 17.5 10.0686 17.5 10.75V13.25C17.5 14.6307 16.3807 15.75 15 15.75 13.6193 15.75 12.5 14.6307 12.5 13.25V10.75C12.5 9.36929 13.6193 8.25 15 8.25 15.4985 8.25 15.9629 8.39588 16.3528 8.64728L18.1351 6.86543C16.6676 5.11383 14.4639 4 12 4 7.58172 4 4 7.58172 4 12 4 16.4183 7.58172 20 12 20 16.4183 20 20 16.4183 20 12H22C22 17.5228 17.5228 22 12 22 6.47715 22 2 17.5228 2 12ZM15 9.75C14.4477 9.75 14 10.1977 14 10.75V13.25C14 13.8023 14.4477 14.25 15 14.25 15.5523 14.25 16 13.8023 16 13.25V10.75C16 10.1977 15.5523 9.75 15 9.75ZM9.99981 13.375C9.99981 13.0298 9.71999 12.75 9.37481 12.75H7.5V11.25H9.37481C9.71999 11.25 9.99981 10.9702 9.99981 10.625 9.99981 10.2798 9.71999 10 9.37481 10H6.75V8.5H9.37481C10.5484 8.5 11.4998 9.4514 11.4998 10.625 11.4998 11.1494 11.3099 11.6294 10.9951 12 11.3099 12.3706 11.4998 12.8506 11.4998 13.375 11.4998 14.5486 10.5484 15.5 9.37481 15.5H6.75V14H9.37481C9.71999 14 9.99981 13.7202 9.99981 13.375Z"
      />
    </svg>
  );
}
With react-icons
import { RiForward30Fill } from "react-icons/ri";

export function Example() {
  return <RiForward30Fill className="size-5" />;
}
forward30-fill.svg
<svg
  viewBox="0 0 24 24"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M2 12C2 6.47715 6.47715 2 12 2 15.0159 2 17.72 3.33509 19.5534 5.44648L22 3V9H16.7854C17.2274 9.45094 17.5 10.0686 17.5 10.75V13.25C17.5 14.6307 16.3807 15.75 15 15.75 13.6193 15.75 12.5 14.6307 12.5 13.25V10.75C12.5 9.36929 13.6193 8.25 15 8.25 15.4985 8.25 15.9629 8.39588 16.3528 8.64728L18.1351 6.86543C16.6676 5.11383 14.4639 4 12 4 7.58172 4 4 7.58172 4 12 4 16.4183 7.58172 20 12 20 16.4183 20 20 16.4183 20 12H22C22 17.5228 17.5228 22 12 22 6.47715 22 2 17.5228 2 12ZM15 9.75C14.4477 9.75 14 10.1977 14 10.75V13.25C14 13.8023 14.4477 14.25 15 14.25 15.5523 14.25 16 13.8023 16 13.25V10.75C16 10.1977 15.5523 9.75 15 9.75ZM9.99981 13.375C9.99981 13.0298 9.71999 12.75 9.37481 12.75H7.5V11.25H9.37481C9.71999 11.25 9.99981 10.9702 9.99981 10.625 9.99981 10.2798 9.71999 10 9.37481 10H6.75V8.5H9.37481C10.5484 8.5 11.4998 9.4514 11.4998 10.625 11.4998 11.1494 11.3099 11.6294 10.9951 12 11.3099 12.3706 11.4998 12.8506 11.4998 13.375 11.4998 14.5486 10.5484 15.5 9.37481 15.5H6.75V14H9.37481C9.71999 14 9.99981 13.7202 9.99981 13.375Z"
  />
</svg>
Attribution
"Forward30 Fill" icon from Remix Icon (https://github.com/Remix-Design/RemixIcon), licensed under Apache License Version 2.0.

Related icons: