Embed this icon within HTML

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="M5 16C4 16 4 17 4 17L4 19C4 19 4 20 5 20L9 20C10 20 10 19 10 19L10 17C10 17 10 16 9 16L5 16ZM15 12C14 12 14 13 14 13L14 19C14 19 14 20 15 20L19 20C20 20 20 19 20 19L20 13C20 13 20 12 19 12L15 12ZM15 4C14 4 14 5 14 5L14 7C14 7 14 8 15 8L19 8C20 8 20 7 20 7L20 5C20 5 20 4 19 4L15 4ZM5 4C4 4 4 5 4 5L4 11C4 11 4 12 5 12L9 12C10 12 10 11 10 11L10 5C10 5 10 4 9 4L5 4Z" />
</svg>

Using as a React Component

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 {LayoutIcon} 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 LayoutIcon = () => (
    <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="M5 16C4 16 4 17 4 17L4 19C4 19 4 20 5 20L9 20C10 20 10 19 10 19L10 17C10 17 10 16 9 16L5 16ZM15 12C14 12 14 13 14 13L14 19C14 19 14 20 15 20L19 20C20 20 20 19 20 19L20 13C20 13 20 12 19 12L15 12ZM15 4C14 4 14 5 14 5L14 7C14 7 14 8 15 8L19 8C20 8 20 7 20 7L20 5C20 5 20 4 19 4L15 4ZM5 4C4 4 4 5 4 5L4 11C4 11 4 12 5 12L9 12C10 12 10 11 10 11L10 5C10 5 10 4 9 4L5 4Z" />
    </svg>
);

You can now use the icon component in your React application like any other React component.