Copy and paste the following SVG code into your HTML file where you want the icon to appear. Then, you can customize the SVG attributes, such as size or color, using inline styling or CSS classes.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em">
<path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 4L20 20M16 7C16 5 14 5 14 5L6 5C6 5 4 5 4 7L4 8C4 10 6 10 6 10L14 10C14 10 16 10 16 8L16 7ZM14 14C14 14 16 14 16 16L16 17C16 19 14 19 14 19L10 19C10 19 8 19 8 17L8 16C8 14 10 14 10 14L14 14Z" />
</svg>
You can integrate this icon in your React application using our React icons components. First install the package using YARN or NPM:
$ yarn add @josemi-icons/react
Now you can import this icon in your React application
import {AlignRightIcon} from "@josemi-icons/react";
Alternatively, if you only need this icon jou can just copy and paste the following component into your React application:
const AlignRightIcon = () => (
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1em" height="1em">
<path fill="none" stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M20 4L20 20M16 7C16 5 14 5 14 5L6 5C6 5 4 5 4 7L4 8C4 10 6 10 6 10L14 10C14 10 16 10 16 8L16 7ZM14 14C14 14 16 14 16 16L16 17C16 19 14 19 14 19L10 19C10 19 8 19 8 17L8 16C8 14 10 14 10 14L14 14Z" />
</svg>
);
You can now use the icon component in your React application like any other React component.