Hover the icon or press Play. Suggested motion: nudge-right. Pick another to preview it and update the animated code:
Forward icon
A free forward icon from VS Code Icons, 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
- CC BY 4.0 license
- Project
- github.com
npx shadcn@latest add https://ui.cuelark.com/r/icons/vscode-codicons/forward.jsonimport * as React from "react";
/**
* Forward from VS Code Icons (https://github.com/microsoft/vscode-codicons), CC BY 4.0.
* Via Cuelark UI: ui.cuelark.com/icons/vscode-codicons/forward. Sized in em, colored by currentColor.
*/
export function VscForwardIcon(props: React.SVGProps<SVGSVGElement>) {
return (
<svg
aria-hidden="true"
viewBox="0 0 16 16"
stroke="currentColor"
fill="currentColor"
strokeWidth="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
{...props}
>
<path
d="M12.293 7.99984L9.61091 10.6824C9.41565 10.8776 9.41565 11.1942 9.61091 11.3895C9.78448 11.563 10.0539 11.5823 10.2488 11.4473L10.318 11.3895L13.884 7.82067L13.9336 7.74953L13.9612 7.69372L13.984 7.62609L13.9889 7.60536C13.9962 7.57168 14 7.53647 14 7.50038L13.9945 7.5743L13.9982 7.54286V7.45786L13.9832 7.37155L13.9622 7.30934L13.9228 7.23337L13.8683 7.16222L10.318 3.61129C10.1228 3.41603 9.80617 3.41603 9.61091 3.61129C9.43735 3.78486 9.41806 4.05428 9.55306 4.24915L9.61091 4.3184L12.293 6.99984L8 7.00038C4.47823 7.00038 2.11461 8.97618 2.00405 11.7928L2 12.0004C2 12.2765 2.22386 12.5004 2.5 12.5004C2.77614 12.5004 3 12.2765 3 12.0004C3 9.72721 4.80747 8.09579 7.73848 8.00442L8 8.00038L12.293 7.99984Z"
/>
</svg>
);
}import { VscForward } from "react-icons/vsc";
export function Example() {
return <VscForward className="size-5" />;
}<svg
viewBox="0 0 16 16"
stroke="currentColor"
fill="currentColor"
stroke-width="0"
width="1em"
height="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12.293 7.99984L9.61091 10.6824C9.41565 10.8776 9.41565 11.1942 9.61091 11.3895C9.78448 11.563 10.0539 11.5823 10.2488 11.4473L10.318 11.3895L13.884 7.82067L13.9336 7.74953L13.9612 7.69372L13.984 7.62609L13.9889 7.60536C13.9962 7.57168 14 7.53647 14 7.50038L13.9945 7.5743L13.9982 7.54286V7.45786L13.9832 7.37155L13.9622 7.30934L13.9228 7.23337L13.8683 7.16222L10.318 3.61129C10.1228 3.41603 9.80617 3.41603 9.61091 3.61129C9.43735 3.78486 9.41806 4.05428 9.55306 4.24915L9.61091 4.3184L12.293 6.99984L8 7.00038C4.47823 7.00038 2.11461 8.97618 2.00405 11.7928L2 12.0004C2 12.2765 2.22386 12.5004 2.5 12.5004C2.77614 12.5004 3 12.2765 3 12.0004C3 9.72721 4.80747 8.09579 7.73848 8.00442L8 8.00038L12.293 7.99984Z"
/>
</svg>"Forward" icon from VS Code Icons (https://github.com/microsoft/vscode-codicons), licensed under CC BY 4.0 license.