arrow right end on rectangle icon

Common uses

• Export data to a file
• Submit a form
• Send a message

Use it in React

npm i @heroicons/react

import { ArrowRightEndOnRectangleIcon } from '@heroicons/react/24/outline';

<ArrowRightEndOnRectangleIcon className="size-6" />

Styles

Heroicons ships this icon in 4 styles — each its own import:

<ArrowRightEndOnRectangleIcon className="size-6" />

<ArrowRightEndOnRectangleIcon className="size-6" />

<ArrowRightEndOnRectangleIcon className="size-6" />

<ArrowRightEndOnRectangleIcon className="size-6" />

Details

Library

Heroicons (324 icons)

License

MIT

viewBox

0 0 24 24

Keywords

arrowrightendonrectangleexport iconsubmit iconsend iconupload icon

FAQ

What does the arrow-right-end-on-rectangle icon represent?

It visually represents an action of moving something into a container or destination, often used for export, submit, or send operations.

How do I use this icon in React?

Import it from Heroicons like this: import { ArrowRightEndOnRectangleIcon } from '@heroicons/react/24/outline'.

What is the license for this icon?

The Heroicons library, including this icon, is available under the MIT license.

Related icons

The same idea in other libraries, and near matches in Heroicons.