i3 logo

i3 from Simple Icons by Simple Icons Collaborators · Brand · CC0-1.0 Free for personal and commercial use.

Name
i3
Set
Simple Icons
Style
Brand
Viewbox
24×24
License
CC0 1.0

Use the i3 logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M8.933 9.09a1.34 1.34 0 0 0 .031 1.896l6.973 6.945a1.342 1.342 0 1 0 1.893-1.901l-6.973-6.945a1.344 1.344 0 0 0-1.924.005m-1.66 7.176a426 426 0 0 0-1.338-1.339c-.377-.369-.829-.843-1.401-.856a1.7 1.7 0 0 0-.615.132c-.123.05-.383.276-.383.276a1.34 1.34 0 0 0-.394 1.122c.051.414.364.728.653.993c.066.063.142.132.262.25c.305.298.755.751 1.312 1.312c1.114 1.123 2.658 2.688 4.39 4.414c1.508 1.501 3.668 1.701 5.549 1.149s3.66-1.757 5.148-3.25s2.685-3.278 3.229-5.162s.335-4.042-1.173-5.544l-6.22-6.194a1.34 1.34 0 0 0-1.923.005a1.34 1.34 0 0 0 .03 1.896l6.22 6.194c.739.736.858 1.619.488 2.898c-.369 1.28-1.325 2.781-2.552 4.013c-1.228 1.233-2.725 2.195-4.002 2.57c-1.278.374-2.162.259-2.9-.476c-1.723-1.716-3.261-3.275-4.38-4.403m-4.946-4.947c.522.52.524 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.35 1.35 0 0 1-.004-1.897a1.35 1.35 0 0 1 1.897-.004m5.364-5.386c.522.519.524 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.35 1.35 0 0 1-.004-1.897a1.347 1.347 0 0 1 1.897-.004M13.213.388c.521.52.523 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.347 1.347 0 0 1-.004-1.897a1.35 1.35 0 0 1 1.897-.004"/></svg>

React

import type { SVGProps } from "react";

export function SimpleIconsI3(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M8.933 9.09a1.34 1.34 0 0 0 .031 1.896l6.973 6.945a1.342 1.342 0 1 0 1.893-1.901l-6.973-6.945a1.344 1.344 0 0 0-1.924.005m-1.66 7.176a426 426 0 0 0-1.338-1.339c-.377-.369-.829-.843-1.401-.856a1.7 1.7 0 0 0-.615.132c-.123.05-.383.276-.383.276a1.34 1.34 0 0 0-.394 1.122c.051.414.364.728.653.993c.066.063.142.132.262.25c.305.298.755.751 1.312 1.312c1.114 1.123 2.658 2.688 4.39 4.414c1.508 1.501 3.668 1.701 5.549 1.149s3.66-1.757 5.148-3.25s2.685-3.278 3.229-5.162s.335-4.042-1.173-5.544l-6.22-6.194a1.34 1.34 0 0 0-1.923.005a1.34 1.34 0 0 0 .03 1.896l6.22 6.194c.739.736.858 1.619.488 2.898c-.369 1.28-1.325 2.781-2.552 4.013c-1.228 1.233-2.725 2.195-4.002 2.57c-1.278.374-2.162.259-2.9-.476c-1.723-1.716-3.261-3.275-4.38-4.403m-4.946-4.947c.522.52.524 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.35 1.35 0 0 1-.004-1.897a1.35 1.35 0 0 1 1.897-.004m5.364-5.386c.522.519.524 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.35 1.35 0 0 1-.004-1.897a1.347 1.347 0 0 1 1.897-.004M13.213.388c.521.52.523 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.347 1.347 0 0 1-.004-1.897a1.35 1.35 0 0 1 1.897-.004"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M8.933 9.09a1.34 1.34 0 0 0 .031 1.896l6.973 6.945a1.342 1.342 0 1 0 1.893-1.901l-6.973-6.945a1.344 1.344 0 0 0-1.924.005m-1.66 7.176a426 426 0 0 0-1.338-1.339c-.377-.369-.829-.843-1.401-.856a1.7 1.7 0 0 0-.615.132c-.123.05-.383.276-.383.276a1.34 1.34 0 0 0-.394 1.122c.051.414.364.728.653.993c.066.063.142.132.262.25c.305.298.755.751 1.312 1.312c1.114 1.123 2.658 2.688 4.39 4.414c1.508 1.501 3.668 1.701 5.549 1.149s3.66-1.757 5.148-3.25s2.685-3.278 3.229-5.162s.335-4.042-1.173-5.544l-6.22-6.194a1.34 1.34 0 0 0-1.923.005a1.34 1.34 0 0 0 .03 1.896l6.22 6.194c.739.736.858 1.619.488 2.898c-.369 1.28-1.325 2.781-2.552 4.013c-1.228 1.233-2.725 2.195-4.002 2.57c-1.278.374-2.162.259-2.9-.476c-1.723-1.716-3.261-3.275-4.38-4.403m-4.946-4.947c.522.52.524 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.35 1.35 0 0 1-.004-1.897a1.35 1.35 0 0 1 1.897-.004m5.364-5.386c.522.519.524 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.35 1.35 0 0 1-.004-1.897a1.347 1.347 0 0 1 1.897-.004M13.213.388c.521.52.523 1.376.004 1.897a1.347 1.347 0 0 1-1.897.004a1.347 1.347 0 0 1-.004-1.897a1.35 1.35 0 0 1 1.897-.004"/></svg>
</template>

CSS

.icon-i3 {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8.933%209.09a1.34%201.34%200%200%200%20.031%201.896l6.973%206.945a1.342%201.342%200%201%200%201.893-1.901l-6.973-6.945a1.344%201.344%200%200%200-1.924.005m-1.66%207.176a426%20426%200%200%200-1.338-1.339c-.377-.369-.829-.843-1.401-.856a1.7%201.7%200%200%200-.615.132c-.123.05-.383.276-.383.276a1.34%201.34%200%200%200-.394%201.122c.051.414.364.728.653.993c.066.063.142.132.262.25c.305.298.755.751%201.312%201.312c1.114%201.123%202.658%202.688%204.39%204.414c1.508%201.501%203.668%201.701%205.549%201.149s3.66-1.757%205.148-3.25s2.685-3.278%203.229-5.162s.335-4.042-1.173-5.544l-6.22-6.194a1.34%201.34%200%200%200-1.923.005a1.34%201.34%200%200%200%20.03%201.896l6.22%206.194c.739.736.858%201.619.488%202.898c-.369%201.28-1.325%202.781-2.552%204.013c-1.228%201.233-2.725%202.195-4.002%202.57c-1.278.374-2.162.259-2.9-.476c-1.723-1.716-3.261-3.275-4.38-4.403m-4.946-4.947c.522.52.524%201.376.004%201.897a1.347%201.347%200%200%201-1.897.004a1.35%201.35%200%200%201-.004-1.897a1.35%201.35%200%200%201%201.897-.004m5.364-5.386c.522.519.524%201.376.004%201.897a1.347%201.347%200%200%201-1.897.004a1.35%201.35%200%200%201-.004-1.897a1.347%201.347%200%200%201%201.897-.004M13.213.388c.521.52.523%201.376.004%201.897a1.347%201.347%200%200%201-1.897.004a1.347%201.347%200%200%201-.004-1.897a1.35%201.35%200%200%201%201.897-.004%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M8.933%209.09a1.34%201.34%200%200%200%20.031%201.896l6.973%206.945a1.342%201.342%200%201%200%201.893-1.901l-6.973-6.945a1.344%201.344%200%200%200-1.924.005m-1.66%207.176a426%20426%200%200%200-1.338-1.339c-.377-.369-.829-.843-1.401-.856a1.7%201.7%200%200%200-.615.132c-.123.05-.383.276-.383.276a1.34%201.34%200%200%200-.394%201.122c.051.414.364.728.653.993c.066.063.142.132.262.25c.305.298.755.751%201.312%201.312c1.114%201.123%202.658%202.688%204.39%204.414c1.508%201.501%203.668%201.701%205.549%201.149s3.66-1.757%205.148-3.25s2.685-3.278%203.229-5.162s.335-4.042-1.173-5.544l-6.22-6.194a1.34%201.34%200%200%200-1.923.005a1.34%201.34%200%200%200%20.03%201.896l6.22%206.194c.739.736.858%201.619.488%202.898c-.369%201.28-1.325%202.781-2.552%204.013c-1.228%201.233-2.725%202.195-4.002%202.57c-1.278.374-2.162.259-2.9-.476c-1.723-1.716-3.261-3.275-4.38-4.403m-4.946-4.947c.522.52.524%201.376.004%201.897a1.347%201.347%200%200%201-1.897.004a1.35%201.35%200%200%201-.004-1.897a1.35%201.35%200%200%201%201.897-.004m5.364-5.386c.522.519.524%201.376.004%201.897a1.347%201.347%200%200%201-1.897.004a1.35%201.35%200%200%201-.004-1.897a1.347%201.347%200%200%201%201.897-.004M13.213.388c.521.52.523%201.376.004%201.897a1.347%201.347%200%200%201-1.897.004a1.347%201.347%200%200%201-.004-1.897a1.35%201.35%200%200%201%201.897-.004%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/simple-icons/i3.svg?color=%231a73e8&size=48