josemi/icons

grid-horizontal

Download

Download the icon as SVG image.

Download Icon

Customize icon

Set your custom size or color and download the icon as SVG or PNG image.

Width

Height

Color

Get SVG

Get PNG

Using as SVG

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="M3 7C3 7 3 6 4 6L6 6C7 6 7 7 7 7L7 9C7 9 7 10 6 10L4 10C3 10 3 9 3 9L3 7ZM3 15C3 15 3 14 4 14L6 14C7 14 7 15 7 15L7 17C7 17 7 18 6 18L4 18C3 18 3 17 3 17L3 15ZM10 7C10 7 10 6 11 6L13 6C14 6 14 7 14 7L14 9C14 9 14 10 13 10L11 10C10 10 10 9 10 9L10 7ZM10 15C10 15 10 14 11 14L13 14C14 14 14 15 14 15L14 17C14 17 14 18 13 18L11 18C10 18 10 17 10 17L10 15ZM17 7C17 7 17 6 18 6L20 6C21 6 21 7 21 7L21 9C21 9 21 10 20 10L18 10C17 10 17 9 17 9L17 7ZM17 15C17 15 17 14 18 14L20 14C21 14 21 15 21 15L21 17C21 17 21 18 20 18L18 18C17 18 17 17 17 17L17 15Z" />
</svg>

Using with React

Install @josemi-icons/react and import the icon component in your React application:

import {GridHorizontalIcon} from "@josemi-icons/react";

const MyComponent = () => {
    return (
        <GridHorizontalIcon />
    );
};

Using with CSS

Install @josemi-icons/css and include the icon as a CSS class:

<i class="ji-grid-horizontal"></i>